Ramschkasten.de

Alles was so hängen bleibt

Aufräumen im CSS-File

Beim lesen des Artikels „Efficient CSS with shorthand properties“ bestätigte sich meine Arbeitsweise zur Verhinderung von übermäßigen Inhalten im CSS-File. Die Gefahr bei der Optimierung von Webseiten besteht meistens darin, die Beschreibungen des Seitencode aus der Webseite in die CSS-Datei zu verlagern. So tritt man zwar dem Ladevolumen der Seiten entgegen doch die CSS-Dateien blähen sich künstlich auf.

Zusammenfassend richtet sich das Augenmerk darauf die Eigenschaften von background, border, border-color, border-style, border sides, border-width, font, list-style, margin, outline, und padding in einer Zeile zu beschreiben, als eine Zeile für jede Eigenschaft. Ein paar Bytes zusätzlich lassen sich dann auch noch einsparen, wenn man in den Farbeigenschaften statt drei Paaren von hexadezimalen Zahlen nur je eine davon übergibt. So wird aus #000000 #000 oder #336699 #369.

Hilfreich fand ich den Hinweis bei der Beschreibung der Seitenelementen wie top, right, bottom, left. Durch eine Eselsbrücke soll man sich eine Uhr vorstellen bei der die 12=top, die 3=right, die 6=bottom und die 9=left anzeigt. Easy! Bsp: statt margin-top:1em; margin-right:0; margin-bottom:2em; margin-left:0.5em; gibt man margin:1em 0 2em 0.5em an.

Weniger Code ergibt mehr Übersicht. Wer mehr Informationen benötigt findet in den folgende Büchern weitere Hilfe:

  • CSS-Praxis
  • Professionelles Webdesign mit (X)HTML und CSS.
  • Eric Meyer on CSS. Mastering the language of  Web Design
 

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.