Die Ladezeit einer Website zu optimieren ist oft eine mühsame Angelegenheit. Dennoch gibt es ein paar wenige Tricks, die einen spürbaren unterschied machen. CSS und JavaScript so spät wie möglich laden Grundsätzlich galt es lange als Best Practice die CSS und JavaScript Datei im Head Teil zu laden. Die Website ist allerdings performanter, wenn diese […]
WeiterlesenPosts in category Web-Design
Responsive Webdesign erklärt
Die meiste Menschen, die sich ein wenig mit Webdesign beschäftigt haben, haben schon von responsive Design gehört und wenn sie eine neue Webseite haben wollen, dann sollte diese responsive sein. Was bedeutet aber responsive Webdesign nun aber im Detail und was müssen sie für die Planung ihrer neuen Webseite berücksichtigen.
WeiterlesenPositionsermittlung und Wegbeschreibung mit Google API
Standortinformationen sind eines der liebsten Spielzeuge der Web(app)-Entwickler. Diese Informationen werden dann oft mit Google Maps verwendet. Mit Hilfe der Geolocation API ist es sehr einfach den Standort abzufragen. Diese API wird eigentlich von allen gängigen Browsern unterstützt. Trotzdem ist es immer noch sinnvoll zu allererst abzufragen ob das auch wirklich so ist. Denn ansonsten […]
WeiterlesenSASS – Schleifen und Bedingungen
Bedingungen machen jeder Art von Programmiersprache erst sinnvoll. Ohne Bedingungen mach programmieren keinen Spaß/Sinn. Trotzdem mag es auf den ersten Blick etwas verwirrend sein wofür man Bedingungen in einem Stylesheet braucht. Es stimmt schon dass man Bedingungen bei Sass weniger häufig braucht als in anderen Programmiersprachen, aber ganz darauf können wir eben auch nicht verzichten.
WeiterlesenSass – Mixins
Mixins sind Funktionen die Code ausgeben können anstatt von einem Resultat. Mixins helfen dabei nicht immer wieder den selben CSS-Code schreiben zu müssen. @mixin resize { width: 80%; } .container { @include center; } Wenn keine Parameter übergeben werden, braucht man bei einem Mixin nach dem Namen auch keine () angeben. Parameter im Kontext von […]
WeiterlesenSass – Funktionen
Vereinfach ausgedrückt stellt Sass Funktionen bereit um CSS zu schreiben. .foo { color: darken(#BADA55, 4.2%); } In Sass beginnen Funktionen mit @function dem Funktionsnamen und dann {}. Mit @return wird der Rückgabewert ausgegeben . Funktionen ohne Rückgabewert führen zu einem Fehler. @function get-base-url(){ @return ‚/assets/‘; } .module{ background-image: url(get-base-url() +’hintergrund.png‘); } Parameter Funktionen machen vor […]
WeiterlesenSASS – Grundlagen
Variablen Mit Variablen lassen sich Farben, font Listen, maps of breakpoints und Pfade speichern. Variablen beginnen immer mit mit einem $ Zeichen. $meine-variable: 42px; .foo { width: $meine-variable; } Variablen können wie in anderen Programmiersprachen auch verschiedene Datentypen zugewiesen werden: string, number, list, map, bool, null. Mit der Funktion type-off(..) kann man den Typ einer […]
WeiterlesenGoogle Maps im Responsive Webdesign | kulturbanause® blog
Kaum eine Website kommt mittlerweile mehr ohne eingebundene Google Maps Karte mehr aus. Genauso selbstverständlich ist es, dass eine Website mittlerweile responsive ist. Da stößt man zwangsläufig auf das Problem, dass die eingebettete iframe Karte ebenfalls responsive sein muss. Hier ein Beitrag wie das Problem innerhalb weniger Sekunden gelöst ist. .responsiveContainer { position: relative; padding-bottom: […]
WeiterlesenFarbschema einfach und schnell generieren
Wenn man sich mit Webdesign beschäftigt, braucht man oft ein zusammenpassendes Farbschema. Diese Palette zu erstellen ist ziemlich mühsam vor allem wenn man eher ein Techniker als ein Grafiker ist. Zum Glück gibt es ganz praktische Tools dafür. Generate infinite color palettes for your designs and share, export or save it in your profile. Quelle: […]
WeiterlesenKlickbare Telefonnummer auf Ihrer mobilen Website
+43 (0)699 11112222 Quelle: Klickbare Telefonnummer auf Ihrer mobilen Website
Weiterlesen