„Cascading Style Sheets“, kurz CSS, erleichtert euch die Gestaltung eurer Website. In den Anfangsjahren des World Wide Web musste bei einer Änderung des Designs noch jede einzelne Seite des Webauftritts angepasst werden. Dank CSS sind diese Zeiten lange vorbei.
Fast immer werden CSS-Anweisungen zentral festgelegt und dann für die gesamte Website verwendet. Beim Aufruf einer Unterseite werden diese Anweisungen vom Browser geladen und angewendet. Wenn ihr das Design Eurer Seiten ändern möchtet, reicht es deshalb oft aus, wenn ihr die CSS-Anweisungen bearbeitet.
CSS und SEO – das solltet ihr beachten
Wenn ihr eine neue Website erstellt, gibt es ein paar Dinge, die ihr im Zusammenhang mit CSS und SEO beachten solltet. Einige dieser Punkte haben wir nachfolgend für euch zusammengefasst:
1. Lagert eure CSS-Anweisungen in eine separate Datei aus
Das hat den Vorteil, dass der Webbrowser eines Besuchers diese Datei nur einmal von eurem Webserver lädt und sie dann im Browsercache ablegt. Ruft der Besucher weitere Seiten eures Internetauftritts auf, greift der Browser auf die CSS-Daten in seinem Cache zu. Das spart Bandbreite und Ladezeit. Bindet CSS-Anweisungen möglichst nicht in eure HTML-Dokumente ein, weil sie dann mit jeder neue Unterseite erneut mitgeladen werden („Overhead“).
2. Haltet eure CSS-Anweisungen so klein und so einfach wie möglich
Ein schlankes Konstrukt aus CSS-Anweisungen wirkt sich vorteilhaft auf die Ladezeiten aus und sorgt für einen schnelleren Seitenaufbau.
3. Gestaltet eure Website mit CSS-Anweisungen responsiv
Beschäftigt euch mit CSS-Anweisungen wie „min-width“ und „min-height“. Mit ihnen könnt ihr das Seitenlayout responsiv gestalten, so dass es sich automatisch an die Breite des Bildschirms anpasst. Eine separate Mobil- und Desktopversion einer Website ist heute nicht mehr erforderlich.
4. Testet das Erscheinungsbild eurer Seiten auf unterschiedlichen Geräten
Da es heute eine Vielzahl an unterschiedlichen internetfähigen Geräten mit verschiedenen Bildschirmgrößen sowie Betriebssystemen und Browsern gibt (Smartphones, Tablets, Notebooks, Desktop-PCs) ist es unabdingbar, dass ihr eure Seiten auf möglichst vielen unterschiedlichen Geräten testet. Einzelne Browser stellen manche Elemente „gerne“ anders dar, als es bei den meisten anderen Browsern der Fall ist.
5. Testet abschließend nochmal, ob alle CSS-Anweisungen tatsächlich verwendet werden
Im Designprozess einer neuen Website passiert es schnell, dass Elemente wieder entfernt werden, die CSS-Anweisungen dafür aber bestehen bleiben – einfach, weil man vergisst, sie ebenfalls zu entfernen. Prüft daher bei der Fertigstellung der Website nochmal, ob alle CSS-Anweisungen auch wirklich aktiv verwendet werden.
Bild: Pexels / pixabay.com
