Schlanke Websites: Ladezeiten verkürzen, Code/Content Verhältnis verbessern

Grundsätzlich sollte man immer versuchen Webseiten so "schlank" wie nur möglich zu halten. Das bedeutet, dass der reine Code (HTML, JavaScript und CSS) auf ein Minimum reduziert werden muss. Abgesehen davon, dass diese Maßnahme die Ladezeiten zum Teil deutlich verinngern kann hat es noch weitere Vorteile. Zum einen verringert sich dadurch die Serverauslastung - je mehr Traffic eine Seite hat, desto deutlicher wird man diesen Effekt merken. Und zum anderen verbessert sich das Verhältnis zwischen Code und Content - das sog. Code/Content Verhältnis. Das spielt vor allem aus SEO-Sicht eine nicht zu unterschätzende Wirkung. Durch weniger Code gewinnt der Website-Content an Bedeutung (und die darin enthaltenen Keywords auch ;)). Und mal ehrlich... wie würdet Ihr, aus der Sicht einer Suchmaschine, eine Seite beurteilen die jede menge Code aber kaum Text enthält? Eben! Kurz: Schlanke Seiten wirken sich positiv auf die Nutzererfahrung bzw. Usability und das Ranking in Suchmaschinen aus. Worauf also noch warten?

Damit will ich eine Beitragsreihe ins Leben rufen die in mehreren Schritten zeigt wie man dem oben gestecktem Ziel näher kommen kann. Da ich bis jetzt noch nicht genau weiß, was mir dazu alles einfällt bzw. was ich mit aufnehme, gibt es an dieser Stelle zunächst mal keine Übersicht ;). Ich beginne einfach mit dem ersten Thema und wir sehen mal was noch so alles kommt...

Schlanke Seiten Tipp 1: JavaScript und CSS auslagern
Die Ausgabe von TYPO3 beinhaltet zum Teil sehr viel JavaScript und CSS Code. Das hängt vor allem mit den installierten Extensions zusammen. Mit wenigen Zeilen TypoScript Code kann man dieses unschöne Verhalten jedoch abstellen.

# remove JavaScript to external files
config.removeDefaultJS = external

# remove CSS to external files
config.inlineStyle2TempFile = 1

Diese Zeilen können hier raus kopiert und direkt in das Haupt-TypoScript-Template der Website eingebunden werden.

Darüber hinaus ist es sinnvoll "_CSS_DEFAULT_STYLE" sämtlicher Plugins - sofern man die standard CSS Ausgabe nicht braucht - zu löschen. Normalerweise übernehm ich alles was ich brauche in ein eigenes CSS und deaktivier danach die Standardausgabe. Das hält die Dateien schlanker und verhindert, dass irgendeine Einstellung "im Hintergrund" zu Fehlern führt.
Immer dran denken: Aufräumen heißt die Devise - also weg mit allem was man nicht unbedingt braucht!

Um die Standardausgabe zu unterbinden folgende Zeilen in das Haupt-TypoScript-Template einfügen:

# clear default CSS styles - only if using plugin css_styled_content plugin.tx_cssstyledcontent._CSS_DEFAULT_STYLE >

# clear default CSS styles of Plugin tx_veguestbook_pi1 plugin.tx_veguestbook_pi1._CSS_DEFAULT_STYLE >

Die erste Zeile benötigt man beim Einsatz von CSS Styled Content. Die zweite zeigt wie man für ein anderes Plugin (hier tx_veguestbook_pi1 - Plugin für Kommentare) die Standard CSS Ausgabe unterbindet.

Dann könnte man noch den TYPO3 Header entfernen der standardmäßig im bereich mit ausgegeben wird... davon halte ich jedoch nichts! Immerhin kann man TYPO3 kostenlos nutzen - da sollte man das auch sehen können. Das ist meine persönliche Meinung und deshalb gibt den Tipp auch nicht ;).

Das soll's fürs Erste mal gewesen sein...

Noch eine Anmerkung an dieser Stelle: Eine Auswirkung meiner früheren Tätigkeit als Programmieren ist, dass ich besonders auf sauberen Code achte (meistens zumindest ;)). Dazu gehört auch, dass man deutsch/englische Programmierung vermeidet. Nachdem TYPO3 und sämtliche Dokumentationen in englischer Sprache sind, sind auch meine Code Beispiele hier im Blog englisch. Früher oder später muss man sich ja im Umgang mit TYPO3 sowieso an das Englisch gewöhnen ;).