Pagespeed-Guide für E-Commerce Shopbetreiber: Diagnose und Maßnahmen

Die Ladezeit (Pagespeed) deines E-Commerce Shops hat direkten Einfluss auf die Conversionrate. Von schlecht optimierten Shops springen Besucher häufig sofort ab. Gut optimierte Shops hingegen verbessern ihren Umsatz spürbar.

Pagespeed im E-Commerce: Das Wichtigste in Kürze

• Bedeutung der Pagespeed: Bereits 1 Sekunde Verzögerung kann die Conversion-Rate um bis zu 7 % senken. Schnelle Shops (unter 1 Sek. Ladezeit) konvertieren bis zu dreimal besser als langsame Seiten.

• Core Web Vitals: Google misst die Nutzererfahrung anhand von Kennzahlen wie LCP (Ladegeschwindigkeit des Hauptinhalts), CLS (visuelle Stabilität) und INP (Reaktionsschnelligkeit bei Klicks). Diese sind offizielle Rankingfaktoren.

• Pagespeed verbessern: Die Optimierung von Bildern (WebP-Format, responsive Größen) und das Reduzieren von Drittanbieter-Skripten (Tracking, Plugins).

• Technische Grundlage: Ein leistungsfähiges Caching (z. B. Redis oder Varnish) und aktuelle Server-Technologien (PHP 8.2+, HTTP/3) sind die Basis, auf der alle weiteren Optimierungen aufbauen.

• Shopware: Shopware 6 automatisiert viele Prozesse wie die WebP-Erstellung, das Thumbnail-Management und das Full-Page-Caching automatisch.

Warum ist die Pagespeed für Onlineshops so wichtig?

Pagespeed ist im E-Commerce deshalb so wichtig, weil er die Brücke zwischen technischer Performance und psychologischem Kaufverhalten schlägt. Eine schnelle Ladezeit führt nachweislich zu höheren Conversion-Rates, geringeren Absprungraten und besseren Rankings in den Suchergebnissen von Google.

• Direkter Einfluss auf die Conversion-Rate: Es gibt einen direkten Zusammenhang zwischen der Ladezeit und deinem Umsatz. Onlineshops, die in unter 1 Sekunde laden, weisen eine dreimal höhere Conversion-Rate auf als Shops, die 5 Sekunden benötigen.

• Google-Rankings und Core Web Vitals: Google hat die Seitengeschwindigkeit unter dem Begriff Core Web Vitals zu einem offiziellen Rankingfaktor gemacht. Das bedeutet: Ein langsamer Shop wird in den Suchergebnissen schlechter platziert, selbst wenn der Content oder die Produkte hervorragend sind.

• Höhere Effizienz deiner Werbeausgaben (ROI): Wenn du bezahlte Werbung (z. B. Google Ads oder Social Media Ads) schaltest, zahlst du für jeden Klick. Wenn ein Nutzer auf deine Anzeige klickt, die Seite aber nicht schnell genug lädt, springt er ab, noch bevor er dein Angebot gesehen hat.

• Einkaufen am Smartphone: 66 Prozent der Onlineumsätze entfallen auf Smartphones und Tablets. Daher ist die Pagespeed-Optimierung direkt für diese Geräte besonders wichtig.

Welche Metriken gehören zur Pagespeed im E-Commerce?

Google nutzt zur Bewertung der Geschwindigkeit deines Shops die Core Web Vitals, eine Gruppe von Messwerten, die das tatsächliche Nutzererlebnis widerspiegeln. Diese setzen sich zusammen aus Largest Contentful Paint (LCP), Cumulative Layout Shift (CLS), Interaction to Next Paint (INP) und Time to First Byte (TTFB).

Largest Contentful Paint (LCP) (Die gefühlte Geschwindigkeit)

Der LCP misst die Zeit, die vergeht, bis das größte sichtbare Element auf der Seite (meist das Hero-Image auf der Startseite oder das Produktbild auf der Produktdetailseite) vollständig geladen ist.

• Zielwert: Unter 2,5 Sekunden.

• E-Commerce-Relevanz: Wenn das Produktbild nicht sofort erscheint, zweifelt der Kunde an der Seriosität oder Funktionalität des Shops.

Cumulative Layout Shift (CLS) (Die visuelle Stabilität)

Buttons und andere Elemente, die sich kurz vor dem Klick bzw. der Berührung noch einmal verschieben, sodass der Klickversuch daneben geht, sind ein großes Ärgernis für Nutzer. Je niedriger der CLS-Wert, desto schneller bleiben alle Elemente stabil an Ort und Stelle.

• Zielwert: Unter 0,1.

• E-Commerce-Relevanz: Ein hoher CLS-Wert führt zu Fehlklicks. Im schlimmsten Fall bricht der Kunde den Kauf ab, weil er sich durch die instabile Nutzeroberfläche manipuliert oder frustriert fühlt.

Interaction to Next Paint (INP) (Die Reaktionsfähigkeit)

Der INP hat im März 2024 den alten Messwert FID (First Input Delay) abgelöst. Er misst, wie schnell der Shop auf Interaktionen reagiert, zum Beispiel wenn ein Kunde auf „In den Warenkorb“ klickt.

• Zielwert: Unter 200 Millisekunden.

• E-Commerce-Relevanz: Eine verzögerte Reaktion nach einem Klick fühlt sich für den Nutzer „zäh“ an. Im Checkout-Prozess führt dies oft dazu, dass Kunden mehrfach klicken oder den Prozess ganz verlassen, weil sie unsicher sind, ob ihre Eingabe registriert wurde.

Time to First Byte (TTFB) (Die Rückmeldung vom Server)

Die TTFB misst die Zeit zwischen der Anfrage des Browsers und dem ersten empfangenen Byte vom Server.

• Zielwert: Unter 800 Millisekunden (für E-Commerce oft schwerer zu erreichen aufgrund dynamischer Warenkörbe).

• E-Commerce-Relevanz: Eine schlechte TTFB deutet auf ein langsames Hosting oder eine überlastete Datenbank hin. Wenn das Fundament nicht stimmt, können Frontend-Optimierungen die Ladezeit kaum noch retten.

Was sind die größten Pagespeed-Killer im E-Commerce?

Für dich als Shopbetreiber ist es wichtig, herauszufinden, was die Performance deines Shops bremst. Oft sind es jedoch nicht die Kernfunktionen des Shopsystems, sondern nachträglich hinzugefügte Elemente wie zu große Bilddateien, Skripte oder Plugins.

• Nicht optimierte Bildmedien: Hochauflösende Produktbilder sind für den Verkauf sehr wichtig, aber in den Formaten PNG oder JPEG blähen sie die Seitengröße unnötig auf. Web-Formate wie WebP oder AVIF bieten bei gleicher Qualität eine Dateigrößen-Reduzierung von bis zu 30 bis 50 %.

• Drittanbieter-Skripte (Third-Party-Code): Tracking-Pixel, Chat-Widgets, Review-Plattformen und Social-Media-Einbindungen laden eigenen JavaScript-Code nach. Jedes dieser Skripte blockiert das Rendern der Seite. In vielen Shops machen diese externen Abfragen mehr als 50 % der gesamten Ladezeit aus, da der Browser warten muss, bis die externen Server antworten.

• Plugins: Jede zusätzliche App oder jedes Plugin lädt eigene Stylesheets und Skripte. Problematisch sind Plugins, die bei jedem Seitenaufruf komplexe Datenbankabfragen durchführen, ohne die Ergebnisse zwischenzuspeichern (Caching).

• Caching: Ohne Caching muss der Server bei jedem Klick die gesamte Seite neu „berechnen“, also Datenbanken abfragen, Preise abrufen und das Layout zusammenbauen. Ein effektives Full-Page-Caching liefert stattdessen eine bereits fertige Kopie der Seite aus, was die Antwortzeit stark senkt.

• CSS und JavaScript: Viele Shop-Themes laden Funktionen für die gesamte Website, auch wenn diese nur auf einer einzigen Unterseite benötigt werden. Der Browser muss diesen „toten Code“ dennoch herunterladen und verarbeiten, was besonders auf Smartphones die Ladezeit spürbar erhöht.

Wie verbessere ich die Pagespeed meines E-Commerce Shops?

Um die Ladezeit deines Onlineshops zu senken, musst du die Dateigrößen reduzieren, die Anzahl der Serveranfragen minimieren und eine wirkungsvolle Caching-Strategie einsetzen. Das gelingt durch die Kompression von Bildern, das Deaktivieren unnötiger Plugins und die Nutzung von zeitgemäßen Protokollen wie HTTP/2.

Schritt 1: Die Bestandsaufnahme

Bevor du technische Änderungen vornimmst, benötigst du einen Vorher-Nachher-Vergleich. Nur so siehst du, welche Maßnahme welchen Effekt hatte.

• Vorgehen: Nutze Google PageSpeed Insights. Gib deine URL ein und führe die Analyse für Mobil und Desktop durch.

• Tipp: Erstelle einen Screenshot der Ergebnisse oder notiere dir die Werte für LCP (Largest Contentful Paint) und den Gesamt-Score. Dokumentiere jede Änderung in einer einfachen Liste (z. B. „15.03. – Bildkompression aktiviert“), um den Erfolg der Änderungen zu sehen.

Schritt 2: Optimierung der Bildmedien

Bilder verursachen mitunter über 60 % des gesamten Datenvolumens einer Seite. Hier liegt das größte Einsparpotenzial.

• Maßnahme: Nutze zeitgemäße Formate wie WebP statt klassischer JPEGs. Diese bieten bei identischer Qualität deutlich kleinere Dateigrößen.

• Umsetzung: Wenige Bilder kannst du manuell umwandeln. Dazu gibt es kostenlose Onlinetools, die direkt im Browser funktionieren. 

• Tipp: Systeme wie Shopware wandeln die Bilder automatisch in sparsame Dateiformate. 

Schritt 3: Inventur deiner Erweiterungen (Plugins und Skripte)

Jedes aktive Plugin lädt eigenen Code, der den Seitenaufbau verzögert. Oft sammeln sich über die Jahre Erweiterungen an, die gar nicht mehr aktiv genutzt werden.

• Vorgehen: Gehe deine Plugin-Liste in der Administration von oben nach unten durch. Frage dich bei jedem Eintrag: „Welche Funktion erfüllt dieses Plugin derzeit noch für meinen Umsatz?“

• Check: Deaktiviere testweise Plugins, bei denen du unsicher bist, in einer Testumgebung (Staging) und miss den Pagespeed erneut. Häufig blockieren vor allem Marketing-Pixel (z. B. alte Tracking-Codes) oder ungenutzte Design-Effekte das Rendern der Seite. Lösche ungenutzte Plugins komplett, statt sie nur zu deaktivieren.

Schritt 4: Die technische Basis

Einige Hebel zur Verbesserung der Pagespeed liegen tief in der Serverstruktur. 

• Vorgehen: Suche das Gespräch mit deinem Fachpersonal. Das ist entweder dein interner IT-Administrator (bei eigenem Server) oder der Support deines Hosting-Providers.

• Wichtig: Gehe erst auf den Provider zu, wenn du die Schritte 1 bis 3 (Bilder und Plugins) erledigt hast. Sonst wird der Support dich lediglich auf deine eigenen unoptimierten Inhalte verweisen.

• Frage gezielt nach der PHP-Version und ob ein serverseitiger Cache wie Redis oder Varnish für deinen Shop aktiv ist. Bei Cloud-Lösungen (SaaS) sind diese Einstellungen oft schon optimiert, hier lohnt sich dennoch ein Blick in die Dokumentation des Anbieters.

Automatische Pagespeed-Optimierung in Shopware

In Shopware sind viele Optimierungsschritte bereits nativ in der Software verankert. Das  Shopsystem bietet automatisierte Mechanismen, um die Last auf dem Server zu minimieren und die Bereitstellung der Inhalte im Browser des Kunden zu beschleunigen.

• WebP-Generierung: Shopware kann hochgeladene Quellbilder automatisch in das WebP-Format umwandeln. Dies reduziert die zu übertragende Datenmenge erheblich, ohne dass du jedes Bild manuell bearbeiten musst.

• Thumbnail-Sets: Shopware generiert für jedes Produktbild automatisch verschiedene Größen (Thumbnails). Für den User wird die Bildgröße geladen, die zur Bildschirmauflösung seines Geräts passt.

• Integrierter HTTP-Cache: Das System speichert fertig gerenderte Seiten zwischen. Bei einem erneuten Aufruf muss der Server nicht die Datenbank abfragen oder PHP-Code ausführen, sondern liefert die fertige HTML-Datei aus.

• Intelligente Leerung: Shopware erkennt automatisch, wenn sich ein Produktpreis oder ein Lagerbestand ändert, und leert gezielt nur den Cache für die betroffenen Seiten. Dies stellt sicher, dass der Shop schnell bleibt, ohne veraltete Informationen anzuzeigen.

• Shopware bündelt und optimiert die für das Design notwendigen Dateien (CSS und JavaScript) eigenständig.

Lerne Shopware kennen!

Ein schneller Shop führt zu einer höheren Conversionrate. Nutze die automatische Pagespeed-Optimierung in Shopware und biete deinen Kunden ein blitzschnelles Shopping-Erlebnis. Entdecke jetzt deine Möglichkeiten in Shopware!

Pagespeed im E-Commerce – häufige Fragen und Antworten