Website-Performance
optimieren
Warum ist es so wichtig, das eine Website schnell geladen wird? Eine schnelle Website bringt gleich mehrere Vorteile mit sich: die Verweildauer von Besuchern erhöht sich, die Absprungrate wird gesenkt, bessere Platzierungen bei Suchmaschinen und höhere Conversions bei Google Adwords.
Wenn Ihre Website länger als 1.5 Sekunden für den initialen Aufbau benötigt, verlieren Sie bereits dadurch Kunden – hier einige Tipps zur Steigerung der Website-Performance:
Komprimierung aktivieren
Die serverseitige Komprimierung mittels gzip oder deflate reduziert die auszuliefernde Datenmenge erheblich. Die meisten moderneren Browser unterstützten die Daten-Kompression für HTML, CSS und JavaSkript Dateien. Diese Komprimierung reduziert die Datenmenge, welche an den Browser gesendet wird und erhöht somit die Website-Performance.
JavaScript später parsen und reduzieren
JavaScript Dateien sollten am Ende einer HTML-Website oder Asyncron integriert werden – somit wird die Website schneller gerendert ohne auf das Laden von JavaSkript Dateien warten zu müssen. Zusätzlich sollten Javaskript Dateien verkleinert (minified) werden, d.h. unnötige Formatierungen, Leerzeichen und Kommentare werden entfernt.
CSS reduzieren
Genau wie JavaScript Dateien sollten auch CSS Dateien verkleinert werden – zusätzlich sollten möglichst wenig CSS Dateien verwendet werden, da dies nochmals die Serveranfragen reduziert. Für das Content-Management-System webEdition haben wir ein kostenloses Plugin erstellt, welches automatisch CSS Dateien verkleinert.
Bilder in CSS-Sprites kombinieren
Icons und andere kleine Grafiken sollten zu einer Grafik zusammengefasst werden, so genannte Sprites – somit muss ein Bild nur einmal geladen werden und die Ansicht wird mittels CSS bestimmt. Alternativ kann für Icons auch ein Icon-Font wie Font Awesome verwendet werden. Dabei stehen über 300 Icons zur Verfügung, die wie eine Schrift mittels CSS eingebunden werden.
Bilder optimieren
Bilder sollten möglichst klein gespeichert werden – mit zusätzlichen Tools können dies ohne Qualitätsverlust komprimiert werden – in vielen Fällen kann mit der Optimierung von Bildern enorm viel Datenmenge gespart werden.
Browser-Caching nutzen
Mit Angabe eines Gültigkeitsdatums werden die Informationen einer Website lokal zwischengespeichert und nicht bei jeder Anfrage erneut geladen. Damit lässt sich die Geschwindigkeit einer Website gut steigern und unnötige Serveranfragen werden reduziert.
Reihenfolge der Formate und Skripts optimieren
Die Reihenfolge der eingebundenen CSS- und Javascripte ist für die Website-Performance ausschlaggebend: CSS-Dateien sollten an erster Stelle im Head-Bereich eingebunden werden, damit wird die Website schneller gerendert und richtig dargestellt. Am Ende der Website oder Asyncron sollten JavaSkript-Dateien eingebunden werden.
Fehlerhafte Anforderungen vermeiden
Fehlende Bilder, CSS- oder JavaScript-Dateien verschlechtern die Performance einer Website. Dazu gehört auch ein fehlendes Favicon, welches automatisch vom Browser versucht wird, zu laden.