Komprimierte CSS-Befehle
Große Projekte bedeuten auch immer große Layoutdateien und meist auch mehrere CSS-Dateien. Je mehr CSS-Befehle, umso unübersichtlicher wird das Ganze. Das Laden und Interpretieren verschlingt trotz gestiegener Bandbreiten und Rechenleistung Zeit, da beispielsweise jede CSS-Datei vor der ersten Verwendung angefordert werden muss. Je länger die Dateien sind, umso länger dauert deren Abarbeitung.
CSS-Befehle lassen sich aber zusammenfassen. Dies führt zu geringeren Ladezeiten, schnelleren Interpretieren sowie übersichtlicheren und kürzeren Quelltexten.
Beispiel 1
font-size: 12px; line-height: 16px; font-weight: bold; font-style: italic; font-variant: small-caps; font-family: Verdana, sans-serif;
Kurzschreibweise:
font: 12px/16px bold italic small-caps Verdana,sans-serif;
Beispiel 2
background-image: url(fileadmin/bild.png); background-repeat: repeat-x; background-attachment: scroll; background-position: 20px 45px;
Kurzschreibweise:
background: url(fileadmin/bild.png) repeat-x scroll 20px 45px;
Komprimierbare CSS-Anweisungen
- Background
- Border
- List-Style
- Margin
- Outline
- Padding
Wenn Sie einige Parameter bei den CSS-Befehlen nicht angeben, so werden sie durch Vorgaben ersetzt.
Weiteres Einsparpotenzial
Das Zusammenfassen von CSS-Klassen und CSS-Dateien bringt weitere wertvolle Millisekunden.
Container, die eine ganze Webseite beinhalten, können ihre Anweisungen auf den BODY- oder HTML-Container übertragen. Eine Webseite mit weniger Container wird schneller gerendet als eine mit vielen Containern.
Siehe auch
Themen: TYPO3-Web-Design, TYPO3-Optimierung, CMS-Homepages gestalten, TYPO3-Internetseiten erstellen, Website-Programmierung, Komprimierte CSS-Befehle.