Shopify Page Speed optimieren: Core-Web-Vitals-Checkliste

⏱ 9 Min. Lesezeit

Shopify Page Speed wird selten durch einen einzigen grossen Fehler ruiniert. Meist sind es zehn kleine: zu schwere Hero-Bilder, ein Theme mit zu viel Show, App-Skripte, die alles mitladen, und mobile Templates, die auf dem Desktop noch halbwegs harmlos wirken.

Diese Checkliste zeigt dir, was du zuerst testen solltest, welche Probleme wirklich auf LCP, INP und CLS schlagen und welche Massnahmen zuerst Wirkung bringen. Das Ziel ist nicht ein hübscher Screenshot aus Lighthouse. Das Ziel ist ein Shop, der schneller lädt, stabiler bleibt und auf mobilen Geräten nicht wie ein Einkaufswagen mit losem Rad wirkt.

Was du vor dem Shopify Speed Test brauchst

Ein brauchbarer Test beginnt mit den richtigen Seiten und den richtigen Daten. Nur die Startseite einmal auf Desktop zu prüfen und dann zufrieden zu nicken, ist ungefähr so sinnvoll wie einen Lieferwagen nur im Leerlauf zu testen.

Die richtigen Tools für eine saubere Analyse

Nutze immer drei Quellen zusammen:

• PageSpeed Insights für eine schnelle Kombination aus Felddaten und Labordaten.
• Google Search Console für Muster über mehrere Templates hinweg.
• Browser-Wasserfall und Script-Ansicht für die reale Ladereihenfolge von Assets, Apps und Drittanbieter-Code.

Zusätzlich brauchst du Zugriff auf Theme-Einstellungen, installierte Apps und idealerweise ein Staging-Theme. Performance-Arbeit direkt im Live-Theme ohne Netz ist keine Effizienz. Es ist nur ein anderer Name für teure Nervosität.

Welche Werte bei LCP, INP und CLS zählen

Die Core Web Vitals decken drei sehr konkrete Dinge ab: wie schnell der wichtigste Inhalt sichtbar wird, wie schnell die Seite auf Eingaben reagiert und wie ruhig das Layout bleibt.

Wer hier nur auf den Shopify speed score starrt, verpasst oft das eigentliche Problem. Ein schöner Score kann mit einem nervigen mobilen Einkaufserlebnis wunderbar koexistieren. Leider.

Schritt 1 — Die richtigen Templates statt nur die Startseite testen

Unterschiedliche Shopify-Templates laden oft völlig unterschiedlich. Die Produktseite ist meist schwerer als die Startseite, und Kategorieseiten sind oft heimliche Sammler für Filter, Badges, Widgets und unnötige Logik.

Felddaten und Labordaten korrekt lesen

Felddaten zeigen, wie echte Nutzer deine Seite erlebt haben. Labordaten zeigen, wie sich eine Seite unter kontrollierten Bedingungen verhält. Beides ist nützlich, aber nicht austauschbar.

Wenn die Felddaten schlecht sind, hast du ein echtes Nutzerproblem. Wenn nur die Labordaten schlecht aussehen, hast du oft ein Code- oder Setup-Problem, das noch nicht breit sichtbar ist. Priorisiere die Seiten, bei denen beide Signale schwach sind.

Diese Seitentypen solltest du zuerst prüfen

1. Startseite, weil dort visuelle Last oft am höchsten ist.
2. Top-Kategorieseiten, weil Filter und Merchandising dort gerne eskalieren.
3. Produktseiten, weil dort Geschwindigkeit und Umsatz direkt zusammenhängen.
4. Warenkorb, weil Tracking und App-Code sich hier gerne stapeln.

Wenn Performance-Probleme gleichzeitig Crawl-Effizienz, interne Verlinkung oder Template-Qualität betreffen, solltest du das nicht isoliert betrachten. Genau dort wird eine saubere Priorisierung durch eine Shopify SEO Agentur oft wertvoller als noch ein einzelner Tool-Report.

Schritt 2 — Die grössten LCP-Bremsen zuerst entfernen

LCP ist oft der schnellste Hebel. Wenn der wichtigste Inhalt zu spät sichtbar wird, fühlt sich der ganze Shop langsam an, selbst wenn der Rest später sauber lädt.

Hero-Bilder, Banner und Slider entschlacken

Ersetze übergrosse PNGs durch korrekt zugeschnittene WebP-Dateien. Lade kein 3000-Pixel-Bild hoch, wenn du am Ende 1200 Pixel zeigst. Das ist kein Qualitätsanspruch, das ist Ballast.

App-Skripte oberhalb des Folds reduzieren

Review-Widgets, Pop-up-Tools, Badge-Apps und Social-Skripte laden oft zu früh. Alles, was nicht für den ersten sichtbaren Bereich nötig ist, sollte nicht um Aufmerksamkeit betteln, bevor dein eigentlicher Inhalt da ist.

Schwere Theme-Sektionen vereinfachen

Slider, Video-Header, animierte Blöcke und zu viele dynamische Sektionen sehen im Pitch gern aufregend aus. Im Alltag kosten sie Ladezeit. Wenn das Problem im Theme selbst steckt, ist eine Shopify Theme Entwicklung Agentur meist sinnvoller als eine weitere kosmetische App.

Schritt 3 — JavaScript-Ballast abbauen, ohne Conversion-Probleme zu erzeugen

Viele Shops haben nicht ein JavaScript-Problem, sondern sechs mittlere. Shopify Page Speed verbessert sich erstaunlich oft dann am stärksten, wenn du Code entfernst, statt ihn noch raffinierter zu verpacken.

Ungenutzte Apps und Drittanbieter-Skripte aufräumen

Prüfe jede installierte App nüchtern: Wird sie wirklich noch gebraucht? Danach kontrollierst du, ob App-Blöcke, Snippets oder alte Assets trotz Deinstallation weiterladen. Das passiert öfter, als Shop-Owner gern hören.

Nicht-kritischen Code verzögert laden

Chat, Heatmaps, sekundäre Widgets und manche Marketing-Skripte können oft später laden. Kritische Kauf-Elemente wie Variantenlogik, Add-to-Cart oder Preisberechnung natürlich nicht. Performance-Arbeit darf nicht in eine Conversion-Falle kippen.

Wann eine Speed App hilft und wann nicht

Eine gute Speed App kann Bilder komprimieren oder kleine Script-Probleme entschärfen. Sie heilt aber kein überladenes Theme, kein App-Chaos und keine mobile Seite, die bei jeder Berührung nachdenkt.

Schritt 4 — CLS senken und mobile Stabilität verbessern

CLS ist das Problem, das Nutzer eher als Ärger denn als Langsamkeit wahrnehmen. Sie tippen auf einen Button, das Layout springt, und plötzlich klicken sie auf etwas, das sie nie öffnen wollten.

• Lege für Bilder, Videos und eingebettete Medien feste Breite und Höhe fest.
• Reserviere Platz für Widgets, die später laden, vor allem Bewertungen und Empfehlungen.
• Verhindere, dass Pop-ups und Sticky Bars den sichtbaren Bereich nachträglich verschieben.
• Lade Schriften sauber und vermeide harte Font-Swaps in Überschriften und Buttons.

Wenn Widgets oder Integrationen dein Layout systematisch verschieben, liegt das Problem oft nicht im CSS-Finish, sondern in der App-Logik. Genau dort kann eine Shopify App Entwicklung Agentur mehr lösen als noch ein Script-Hack.

Schritt 5 — Mobile Shopify Page Speed dort verbessern, wo Umsatz passiert

Die meisten echten Performance-Probleme sind mobile Probleme. Desktop-Berichte sehen oft netter aus als die Realität im Zug, im Café oder auf normalem Mobilfunk.

Produkt- und Kategorieseiten vereinfachen

Reduziere Slider, stapelnde Badges, zu viele Sticky-Elemente und aggressive Filter-Logik. Gerade Kategorieseiten tragen oft zu viel Marketing-Idee und zu wenig technische Disziplin.

Echte Geräte statt nur Desktop-Tests nutzen

Öffne Produktgalerien, wechsle Varianten, nutze Filter, lege Produkte in den Warenkorb und beobachte, wie sich der Shop wirklich anfühlt. Eine Seite kann auf dem Laptop okay aussehen und auf dem Handy trotzdem unerquicklich langsam sein.

Wenn langsame Templates gleichzeitig Conversion-Probleme erzeugen, macht es Sinn, Performance mit UX zusammen zu betrachten. Ein Conversion-Rate-Optimierung Audit zeigt oft deutlicher als ein Tool-Score, wo Mobilnutzer abspringen.

Schritt 6 — Neu testen, priorisieren und dauerhaft überwachen

Ändere nicht zwanzig Dinge gleichzeitig. Sonst weisst du später nicht, was geholfen hat und was nur beschäftigt aussah.

Was sofort gefixt werden muss

• Sofort: schwere Hero-Medien, alte App-Reste, Layout-Sprünge am Add-to-Cart-Bereich, träge mobile Interaktionen.
• Als Nächstes: tiefere Template-Refactorings, nicht-kritische visuelle Optimierungen, schwache Warnungen ohne Nutzerwirkung.
• Beobachten: saisonale Kampagnenassets, Tools mit geringer Nutzung, Skripte, die du kurzfristig nicht entfernen kannst.

Wann du nachtesten solltest

Teste nach jedem grösseren Theme-Update, nach jeder neuen App, nach Landingpage-Rollouts und nach Kampagnen, die zusätzliche Scripts oder Medien mitbringen. Shopify site speed bleibt nicht zufällig gut. Sie bleibt gut, weil jemand regelmässig unnötige Dinge streicht.

Häufige Fehler, die Shopify wieder langsam machen

• Nur die Startseite optimieren. Umsatzstarke Produkt- und Kategorieseiten bleiben dann oft langsam.
• Score-Optimierung mit Nutzererlebnis verwechseln. Ein schöner Wert ersetzt keine saubere mobile Nutzung.
• Apps nicht aufräumen. Tote Tools laden oft länger mit, als man glaubt.
• Nach Kampagnen nicht neu testen. Marketing kann Monate guter Arbeit in einer Woche zerlegen.

Die 12-Punkte-Checkliste für Shopify Page Speed

1. Startseite, Kategorie, Produkt und Warenkorb getrennt testen.
2. Felddaten vor Einzel-Screenshots priorisieren.
3. Hero-Bilder korrekt zuschneiden und komprimieren.
4. Alte Apps und Script-Reste entfernen.
5. Nicht-kritische Drittanbieter-Skripte verzögert laden.
6. Slider, Video-Header und visuelle Spielereien kritisch prüfen.
7. Für alle Medien feste Abmessungen setzen.
8. Pop-ups, Sticky Bars und Widgets layout-stabil einbinden.
9. Mobile Templates vereinfachen.
10. Mit echten Geräten testen.
11. Nach Theme- und App-Änderungen immer nachtesten.
12. Umsatzrelevante Seiten vor Vanity-Seiten priorisieren.

Shopify Page Speed dauerhaft schnell halten

Schnelle Shops entstehen selten durch einen cleveren Trick. Sie entstehen durch weniger Ballast, sauberere Templates und konsequentes Nachtesten. Wenn du statt vager Reports eine klare Prioritätenliste willst, ist ein Shopify PageSpeed Audit der direkteste nächste Schritt.