Der schnellste E-Shop des Jahres 2024: Häufige Fehler, funktionierende Maßnahmen und was zeichnet den Sieger aus?

Im vorherigen Blogpost haben wir den schnellsten E-Shop des Jahres 2024 bekanntgegeben. Es ist iWant.cz, dessen Machern wir herzlich gratulieren, ebenso wie den Entwicklern der Websites Hornbach.cz und Altisport.cz, die es auf das Siegertreppchen geschafft haben.

Doch was sagen die Daten aus und was können Sie daraus lernen, abgesehen vom Vergleich mit den größten (und schnellsten) tschechischen E-Shops? In diesem Text konzentrieren wir uns auf häufige Fehler, die E-Shops immer wieder machen, Empfehlungen zur Optimierung, die immer funktionieren, und schließlich werfen wir noch einen Blick auf den Gewinner der Umfrage.

Häufige Fehler von E-Shops in Bezug auf Geschwindigkeit#

Wenn wir uns die weniger erfolgreichen E-Shops in unserer Liste ansehen, finden wir dort sehr ähnliche Fehler, wie sie uns auch bei vielen unserer Kunden zu Beginn der Zusammenarbeit zur Web-Geschwindigkeit begegnen.

1. Schlecht implementiertes Lazy Loading von Bildern. Lazy Loading ist entweder gar nicht vorhanden oder fälschlicherweise auf alles angewendet, einschließlich des Hauptelements für die LCP-Metrik. Allgemein ist der Umgang mit Ladeprioritäten seitens der Entwickler oft mangelhaft.
2. Nicht eingehaltene Bildgrößen verschlechtern die CLS-Metrik. Dabei bedarf es nur wenig, nämlich die <img>-Elemente gewissenhaft mit width und height Attributen zu versehen.
3. Grundlegende Optimierungen werden nicht durchgeführt, wie die Reduzierung des Datenvolumens von Bildern, Webfonts, CSS- oder JS-Dateien.
4. Es wird vergessen, dass die Server-Antwort die Grundlage von allem ist. Webseiten am Ende der Liste haben eine TTFB-Metrik, die im Durchschnitt um ein Vielfaches schlechter ist als die der schnellsten. Zum Beispiel weist bauhaus.cz einen 75. Perzentilwert der Serverantwort auf Mobilgeräten von 1,84 Sekunden auf, während der Konkurrent Hornbach.cz die Serverantwort dreimal schneller meistert – in 0,58 Sekunden.
5. Schlecht optimierte Analytik und eine Flut von Drittanbieter-Skripten. Mit der Einführung der INP-Metrik können wir Interaktionsverzögerungen messen, die durch Analytik verursacht werden. Alle schnellsten E-Shops schaffen es, die INP auf Mobilgeräten unter dem empfohlenen Wert von 0,2 Sekunden zu halten, aber beispielsweise hat Bibloo.cz im 75. Perzentil dieser Metrik den fünffachen Wert, also über eine Sekunde.

In unseren Popularisierungsaktivitäten zur Web-Geschwindigkeit sagen wir stets, dass die Optimierung der Geschwindigkeit kein Checklisten-Abhaken ist, noch eine „Art von Magie“ (wie etwa SEO). Die Optimierung der Geschwindigkeit ist eine exakte Disziplin, bei der wir das Problem und, wenn möglich, die effizienteste Lösung suchen.

Der Blick auf die schnellsten E-Shops sowie unsere eigenen Erfahrungen bei PageSpeed.ONE zeigen jedoch, dass es hier Gewissheiten gibt, auf die Sie immer setzen können und die sehr gut funktionieren.

Was funktioniert bei der Optimierung der E-Shop-Geschwindigkeit fast immer?#

1. LCP-Metrik: Verwenden Sie Bilder im WebP-Format überall, sie sind fast immer daten-effizienter als JPG und ersetzen auch PNG. Mutigere können auf das AVIF-Format umsteigen.
2. LCP-Metrik: loading=lazy, also Lazy Loading von Bildern, fügen Sie bei allen <img> außerhalb des ersten Bildschirms hinzu.
3. LCP-Metrik: Verwenden Sie <link preload>, um Webfonts vorzuladen, die im ersten Viewport des Nutzers verwendet werden.
4. CLS-Metrik: Fügen Sie immer die Attribute width und height zu allen Inhaltsbildern, also <img>-Elementen, hinzu.
5. CLS-Metrik: Verwenden Sie den size-adjust Deskriptor bei der Typografie, um die Größe der Systemschrift mit der Webfont zu angleichen.
6. INP-Metrik: Reagieren Sie sofort in der Benutzeroberfläche, geben Sie dem Nutzer sofortiges Feedback.
7. Erwägen Sie die Optimierung für schnelle Navigationsarten wie Speculation Rules oder Back/Forward Cache.
8. Geschwindigkeit verschlechtert sich immer im Laufe der Zeit. Daher ist Geschwindigkeitsüberwachung ein absolutes Muss.

Analyse des Siegers iWant.cz#

Was wird bei iWant.cz aus der Perspektive der Web-Geschwindigkeitsoptimierung inspirierend gelöst?

Lassen Sie uns einige Tipps betrachten:

1. Die Server laufen hier auf Hochtouren. Der TTFB-Wert auf Mobilgeräten beträgt für die gesamte Domain iWant.cz 0,37 Sekunden, was ein herausragendes Ergebnis ist und die Hälfte des von Google empfohlenen Wertes. Noch schneller ist nur Zalando.com (0,24 Sekunden), ein Wert, bei dem uns bei einem so großen internationalen Projekt wirklich der Atem stockt.
2. Gute Arbeit mit Ladeprioritäten. Wir sehen hier optimiertes Lazy Loading für weniger wichtige Bilder (loading=lazy) und im Gegensatz dazu das Vorladen wichtiger Elemente mit <link preload>.
3. Optimierte Bilder im WebP-Format. Aufgrund des Webseitentyps und der präsentierten Produkte ist es kaum möglich, das Datenvolumen durch Qualitätsreduzierung weiter zu verringern. Kleinerer Spielraum für Optimierungen bietet hier nur der Wechsel zum AVIF-Format.
4. Sehr sparsamer Umgang mit CSS und JavaScript. Eigene Styles haben auf der wichtigen Typseite Produktdetail nur etwa 15 kB (!), JavaScript-Dateien etwas über 100 kB. Das ist in der heutigen Zeit des Herunterladens von Megabyte-großen Dateien, die der Nutzer in dem Moment nicht benötigt, ein echtes Phänomen.

Es ist uns eine große Freude gewesen, dem Team von Smarty.cz bei der Optimierung der Geschwindigkeit zu helfen. Es muss jedoch gesagt werden, dass in letzter Zeit von unserer Seite nur kleine Korrekturen vorgenommen wurden. Das Webteam ist hier bereits sehr gebildet und kann die Geschwindigkeit weiter eigenständig verbessern.

Das war's zur diesjährigen Studie der schnellsten tschechischen E-Shops. Wir freuen uns auf die Ergebnisse der kommenden Jahre und wünschen Ihnen als Webentwickler und Nutzern schnelle Webseiten!

---

Benötigen Sie Hilfe bei der Geschwindigkeit Ihres E-Shops oder beim Monitoring? Kontaktieren Sie uns.

Tags:PageSpeed.ONEWeb Performance