Schweizer WordPress Magazin

Webdesign

Stylesheets optimieren

Früher oder später wird jeder Blogger selber zum Webdesigner, auch wenn man vielleicht nur etwas Kleines in der Datei ändern muss. Sollte man aber auf die Idee kommen, die CSS-Dateien zu editieren, tauchen schon erste Fragen à la "Wo um alles in der Welt finde ich diese ID?". Das kann wirklich passieren, deshalb rate ich jedem angehenden Webdesigner, folgende Tipps zu beachten:

CSS Formatierer

Die auf den ersten Blick unscheinbare Website Clean CSS bietet das, wovon viele schon träumten. Mit einem Klick kann man dem Stylesheet ein paar Kilobytes abnehmen, Selektoren und Eigenschaften sortieren. Und wer sich oft mit dem CSS Formatierer auseinander setzt, kann auch Templates für diese Anwendung benutzen. Eine ähnliche Funktion hat übrigens auch der CSS Compressor.

Hinweis: Stylesheet vorher und nachher unbedingt durch den Validator schicken!

10 Tipps zur besseren Übersichtlichkeit

1. Benutze ein Master-Stylesheet, welches die anderen Stylesheets für Schrift, Layout, usw. einbindet
2. Erstelle ein Inhaltsverzeichnis am Anfang des Stylesheets
3. Benutze so wenig Container (<div></div>) wie möglich (Stichwort "Divitis")
4. Häufig verwendete Farben am Anfang der Datei deklarieren
5. Stelle ein für den Druck optimiertes Stylesheet zur Verfügung
6. #000 ist das selbe wie #000000 und #369 ist das selbe wie #336699
7. Schreibe die Deklarationen auf einer Linie, damit du auf dem Bildschirm mehr siehst
8. Nutze ein Debugging-Stylesheet um Fehler schneller zu finden
9. Versuche Hacks zu vermeiden, wenn die Bugs nicht tatsächlich existieren
10. Stets UTF-8 im HTML-Dokument verwenden

Noch nicht genug? Hier finden sich ganze 70 Expertenmeinungen.