Kurze Ladezeiten sind ein wichtiges Kriterium erfolgreicher Onlineshops. Gerade die vermehrte mobile Internetnutzung erfordert Optimierungen zur Beschleunigung der Ladezeit von Webseiten, um eine hohe Usability und User Experience (UX) zu gewährleisten.

Die Seitengeschwindigkeit wird von Suchmaschinen ermittelt und fließt in das Ranking des Shops bei Suchmaschinen-Treffern ein. Daher ist die sog. PageSpeed-Optimierung von großer Bedeutung.

Mit dem PageSpeed-Tool von WEBSALE V8s können Sie den PageSpeed Ihres Onlineshops unter folgenden Gesichtspunkten auf einfache Weise optimieren:

1. HTTP-Requests reduzieren

2. CSS und JavaScript komprimieren

3. Browser-Caching aktivieren

 

---

1. HTTP-Requests reduzieren

Zur vollständigen Darstellung einer Webseite im Browser sind stets unterschiedlich viele HTTP-Requests zwischen Server und Client erforderlich. Jede erforderliche Datei (CSS-Styles, JavaScripts, Bilder, usw.) wird dabei einzeln angefragt und übertragen.

Je weniger HTTP-Requests erforderlich sind, desto schneller wird die Seite geladen. Deshalb sollte die Anzahl der HTTP-Requests auf ein Mindestmaß reduziert sein.

WEBSALE V8s stellt Ihnen innerhalb des PageSpeed-Tools eine Möglichkeit zur Verfügung, Ihre CSS- und JavaScript-Dateien seiten- oder themenspezifisch zu gruppieren. Dadurch können Sie pro Seite nur entsprechende CSS- und JavaScript-Dateien einbinden, die für den Aufruf der Seite benötigt werden. Damit diese Dateien nicht alle einzeln eingebunden werden müssen, können sie zu einer Gruppierung mit einer frei wählbaren ID zusammengefasst werden. Diese Gruppierungen werden dann als eine separate CSS- und JavaScript-Datei bereitgestellt – mit verringerten Dateigröße (minimiert) und mit URL-Fingerprinting.

Hinweise zur Integration von JavaScript und CSS-Dateien unter Verwendung des PageSpeed-Tools finden Sie hier:

Wegweiser: JavaScript und jQuery

Wegweiser: CSS

 

---

2. CSS und JavaScript komprimieren

Der Effekt zur Verbesserung des PageSpeed ist noch größer, wenn die ausgelagerten CSS- und JavaScript-Dateien komprimiert (minimiert) werden.

Jede CSS- und JavaScript-Gruppierung wird bei ihrer Bereitstellung über das PageSpeed-Tool automatisch komprimiert. Dadurch werden unnötige Bytes entfernt, die z. B. aus zusätzlichen Leerzeichen, Zeilenumbrüchen und Einzügen resultieren. Durch diese Verkürzung des CSS- und JavaScript-Codes können die Dateien schneller heruntergeladen, geparst und ausgeführt werden.

 

---

3. Browser-Caching aktivieren

Viele Onlineshops erfreuen sich wiederkehrender Besucher. Diese Besucher rufen bei jedem Folgebesuch immer wieder Bilder, Styles und Scripts ab, die im Vergleich zum vorhergehenden Besuch unverändert sind. Durch die Aktivierung der Mitteilung an den Browser, welche Dateien aus dem Browser-eigenen Cache bezogen werden sollen, kann der Browser, statt die gleichen Dateien nochmals vom Server zu holen, diese lokal aus dem Cache laden. Je mehr Dateien aus dem Browser-Cache und je weniger vom Server geladen werden, desto schneller kann Ihr Onlineshop geladen werden: positiv für den Käufer und ein positives Ranking-Kriterium für Suchmaschinen.

Das aktivierte Browser-Caching kann, sofern keine Gegenmaßnahmen ergriffen werden, auf der anderen Seite jedoch dazu führen, dass zwischenzeitlich vom Händler durchgeführte Änderungen an Dateien im Shop dem Besucher bei erneutem Aufruf des Shops nicht korrekt angezeigt werden. Stattdessen wird die alte Version dieser Dateien aus dem Cache geladen und es werden veraltete oder sogar inzwischen falsche Inhalte angezeigt.

Daher ist – ja nach Dateityp – abzuwägen, für welche Inhalte das Browser-Caching aktiviert werden soll!

Das Caching-Thema betrifft in der Regel keine Produktdaten, denn diese stehen üblicherweise direkt im HTML-Inhalt der Shopseite, und bei diesem ist gekennzeichnet, dass er nicht gecached werden soll. Das gewährleistet, dass z. B. neue Preise auch bei jedem Seitenbesuch angezeigt werden.

Auch CSS- und JavaScript-Dateien können vom Browser zwischengespeichert werden – so lange, bis sie auf dem Server geändert werden. Bei Einsatz des PageRank-Tools von WEBSALE teilt der Server dem Browser mit, dass eine neue Dateiversion verfügbar ist. Dazu weist das PageSpeed-Tool jeder Gruppierung von CSS- und JavaScript-Dateien einen eindeutigen Dateinamen zu. Realisiert wird das, indem der Dateiname zusätzlich einen sog. Fingerprint erhält. Der Dateiname "my_css_group.css" einer Styles-Gruppierung erhält z. B. den Fingerprint "_1234", so dass die aktuell vom Server ausgelieferte Datei "my_css_group_1234.css" wäre. Wenn Dateien innerhalb der Gruppierung geändert werden, erhält der Dateiname der Gruppierung einen neuen Fingerprint und wird somit als geändert erkannt. Dadurch ist der Browser gezwungen, die neue CSS- und JavaScript-Gruppierung abzurufen. Unveränderte Gruppierungen hingegen behalten ihren Fingerprint und werden weiterhin aus dem Browser-Cache geladen.

Das aktivierte Browser-Caching für diese Dateien – sofern sie über das PageSpeed-Tool gepflegt werden – ist empfehlenswert, da sich die daraus resultierende höhere Seitengeschwindigkeit positiv auf die Usability und das Suchmaschinen-Ranking auswirken kann.

Für andere Dateitypen, z. B. PDF, JPEG, ist in Abstimmung mit dem Versandhändler abzuwägen, ob das Browser-Caching für diese Dateitypen aktiv sein soll und wenn ja, mit welcher Caching-Dauer.
Denkbar ist, die Caching-Dauer z. B. für .jpg, .png und .gif auf eine kurze Zeitspanne (z. B. 1 h) zu setzen, um zumindest für die Dauer des Shopbesuchs ein Vorhalten der Bilder durch den Browser zu ermöglichen und somit das Nachladen zu verhindern, aber dennoch eine gute Aktualität zu gewährleisten.

Die Caching-Anweisungen können für jeden einzelnen Dateityp separat über die im Wurzelverzeichnis der Domain stehende Apache-Konfigurations-Datei .ws_access.conf (funktionsidentisch mit der Standard-Apache Konfigurationsdatei .htaccess) mittels Expires-Eintrag konfiguriert werden.