In Googles PageSpeed Insights wird einem deutlich vor Augen geführt, wie grottenschlecht die eigene Website doch sein soll. Dazu gibt's einige Verbesserungsvorschläge, was man besser machen kann. Dabei verwendet Google gerne Signalfarben (rot/grün) um den Webmaster so richtig scharf auf's Optimieren zu machen.

Für viele Internetseiten mag es auch ganz sicher eine Menge Potenzial geben. Wenn man aber mal die Kirche im Dorf lässt und das Tool nur auf unsere Gambio-Shop's bezieht, stellt man schnell fest, dass es am Shopsystem selbst fast nichts zu optimieren gibt. Denn im Grunde beziehen sich die angeblich so "schlechten" Ergebnisse fast nur auf das erste Laden der Site. Dannach werden ja die größten Dateien, CSS-Dateien, Banner, Boxen, Background, usw. nur noch aus dem Browsercache abgerufen. Letztlich werden beim Surfen durch den Shop nur noch Produktbilder und Text nachgeladen.

Man muss sich also wirklich fragen, inwieweit es überhaupt Sinn macht seinen Shop beim Erstaufruf um eine viertel Sekunde schneller zu machen und dafür aber Nachteile in Kauf zu nehmen, dass z.B. Änderungen am Layout nicht mehr so schnell im Browser des Kunden aktualisiert werden oder Grafiken unter der Qualität leiden müssen.

Gleichzeitig darf man aber auch nicht vergessen, dass die meisten Probleme hausgemacht sind. Da sind die vielen Tools und Module, die häufig in unserem Shops zum Einsatz kommen. Sei es LiveZilla, Piwik, und viele mehr, bei denen vielleicht nicht immer auf Optimierung geachtet wurde. Die eigenen Grafiken werden ebenfalls oft unoptimiert und unkomprimiert in den Shop geworfen.

1. Komprimierung aktivieren
Wer als Webserver den Apache nutzt, das dürfte auf die meisten zutreffen, sollte das Modul Deflate aktivieren. IdR. ist es aber bereits aktiviert.
Im Shop unter Server-Info sollte in der PHP-Variable _SERVER["HTTP_ACCEPT_ENCODING"] deflate stehen
Ansonsten aktivieren in der Konsole:
Code:
a2enmod deflate
/etc/init.d/apache2 restart
... oder über die Konfig-Oberfläche Plesk, usw. ... oder den Provider kontaktieren.

Anschließend in die .htaccess im Stammverzeichnis:
PHP-Code:
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/plain
AddOutputFilterByType DEFLATE text/html
AddOutputFilterByType DEFLATE text/xml
AddOutputFilterByType DEFLATE text/css
AddOutputFilterByType DEFLATE application/xml
AddOutputFilterByType DEFLATE application/xhtml+xml
AddOutputFilterByType DEFLATE application/rss+xml
AddOutputFilterByType DEFLATE application/javascript
AddOutputFilterByType DEFLATE application/x-javascript
</IfModule> 
2. JavaScript- und CSS-Ressourcen, die das Rendering blockieren, ...
Ohne größere Umbaumaßnahmen ist es mittlerweile gar nicht mehr möglich die Dateien derart asynchron zu laden, dass Google zufrieden ist und der Shop dabei auch noch funktioniert. Spätestens beim nächsten Update gibt es da wieder Schwierigkeiten. Außerdem sind die mittlerweile so weit optimiert, dass weitere Maßnahmen schlichtweg sinnlos sind.

3. CSS und JavaScript reduzieren
Es gibt im Netz viele Online-Tools die eine CSS- und JavaScript-Optimierung/-Kompression anbieten. Dieser Kompressor kann z.B. alles.

4. Browser-Caching nutzen
Bilder cachen ist nicht immer von Vorteil. Google möchte aber am liebsten mindestens eine Woche haben. Für das Layout, Logos, usw. macht das ja auch Sinn.
Wenn man aber Produktfotos oder Grafiken häufig ändert, weil dort vielleicht z.B. Aktionspreise enthalten sind, dann gibt es ein Problem. Man müsste dann den neuen Bildern immer einen anderen Namen geben.
JavaScript-Dateien werden meistens nicht mehr geändert. Hier würde also ein längeres Caching Sinn machen.
In die .htaccess im Stammverzeichnis:
PHP-Code:
<IfModule mod_expires.c>
ExpiresActive On 
ExpiresDefault "access plus 1 week"
ExpiresByType image/x-icon "access plus 1 week"
ExpiresByType image/gif "access plus 1 week"
ExpiresByType image/png "access plus 1 week"
ExpiresByType image/jpg "access plus 1 week"
ExpiresByType image/jpeg "access plus 1 week"
ExpiresByType text/javascript "access plus 1 week"
ExpiresByType text/html "access plus 1 week"
ExpiresByType text/xml "access plus 1 week"
ExpiresByType text/css "access plus 1 week"
ExpiresByType text/js "access plus 1 week"
ExpiresByType application/javascript "access plus 1 week"
</IfModule> 
In den folgenden Verzeichnissen sind noch weitere Dateien, die in .htaccess umbenannt werden müssen:
/gm/htaccess
/images/htaccess
/images/product_images/htaccess
/templates/htaccess
In diesen Dateien sollte das Caching dann auch auf eine Woche begrenzt werden. Wer sich wirklich 100%ig sicher ist, bestimmte Dateien nicht mehr zu ändern, kann die Zeit dann auch auf maximal 1 Jahr setzen ("access plus 1 year").

5. Bilder optimieren
Das macht auf jeden Fall Sinn. Bei den eigenen Grafiken wird häufig nicht auf Sparsamkeit geachtet.

  • Die Grafiken sollten nie größer sein, als sie tatsächlich angezeigt werden sollen.
  • Es sind auch nicht immer 16 Millionen Farben notwendig.
  • In vielen Fällen ist das PNG-Datei-Format die bessere Wahl, manchmal aber auch GIF.
  • Transparenz ist auch nicht immer notwendig.

Nicht selten lassen sich hier 90% und mehr an Dateigröße sparen! Auch hierfür gibt es zahlreiche Anbieter im Netz, die online eine sofortige Optimierung ermöglichen.

6. Antwortzeit des Servers reduzieren
Wer einen einfachen preiswerten Webspace gemietet hat, befindet sich mit seinem Shop in vielen Fällen mit etlichen, teils einigen hundert anderen Website- und Shopbetreibern auf dem selben Server und damit prinzipiell auch auf der selben Festplatte. Jeder kennt das von seinem PC. Man verschiebt gerade große Archive und Unmengen an Dateien und schon wird der Rechner spürbar langsamer wenn man nebenbei eine große Grafik in PhotoShop öffnen will.
Wenn also die Kunden aller Shops und Websites auf dem selben Server zur selben Zeit eine Seite aufrufen, dann werden gleich tausende kleine Dateien verlangt. Da können die Latenzen mal um einige zig Millisekunden zulegen. Das macht dann in der Summe gerne mal 2 oder 3 Sekunden pro Seite aus. Für den wartenden Kunden eine halbe Ewigkeit.
Um schnelle Reaktionszeiten zu gewährleisten, ist letztenendes ein eigener guter Server die beste Wahl.

7. HTML reduzieren
Der aktuelle Gambio-Shop beinhaltet z.Z. fast 1.000 HTML-Dateien. Wer mit seinem Kerngeschäft noch nicht ausgelastet ist, ... bitte schön. Mangels messbarem Ergebnis ist die Arbeit jedoch sinnlos.
Zum Testen reicht natürlich erstmal die index.html aus dem entsprechenden Template. Wer dann aber später mal Änderungen an der Datei vornehmen will wird sich angesichts der fehlenden Strukturierung bedanken.

8. Sichtbare Inhalte priorisieren
Auch hier steht der Aufwand nicht in Relation zum Nutzen. Gambio hat die Strukturierung relevanter Informationen schon sehr gut umgesetzt. Nennenswerte Probleme dürfte es hier deshalb nicht geben.

9. Zielseiten-Weiterleitungen vermeiden
Das sollte jedem bekannt sein. Wenn es sich nicht gerade um eine 301-Weiterleitung (redirect permanent) handelt, dann sollten alle Inhalte direkt in der aufgerufenen Domain liegen.

10. Piwik optimieren
Die piwik.js ist mit 52 kB nicht gerade klein und wird standardmäßig unkomprimiert übertragen. Dies wird von PageSpeed immer bemängelt und muss von Hand geändert werden.
Im Tracking-Code finden sich 2 Einträge "piwik.js".
Diese einfach ändern in "js/" und schon wird das ganze komprimiert gehandled.
Das ist übrigens unter /piwik/js/README.md nachzulesen.