Shopify schneller machen: Theme, Apps, Bilder

Jeder Shopify-Shop läuft auf denselben Servern und demselben CDN. Ein langsamer Shop ist also langsam wegen dem, was er lädt: Theme, App-Skripte, Bilder und Videos. Ladezeit-Optimierung bei Shopify heißt, diese Dinge zu entfernen und zu verkleinern, nicht das Hosting zu wechseln. In den meisten Shops bringen das Entfernen ungenutzten App-Codes, das Komprimieren des Hero-Bilds und das spätere Laden von Widgets am meisten.

Dieser Guide zeigt, wie du die Ladezeit richtig misst, und geht die Fixes dann in der Reihenfolge durch, in der sie sich meist auszahlen. Er ist Teil des Guides zu SEO für Shopify.

Die richtigen Seiten messen

Teste eine Produktseite und eine Kollektionsseite, nicht nur die Startseite. Das sind die Seiten, die ranken und auf denen Käufer landen.

Google PageSpeed Insights liefert Laborwerte für einen einzelnen Ladevorgang und, wenn dein Shop genug Besucher hat, echte Core Web Vitals von Chrome-Nutzern der letzten 28 Tage. Die echten Nutzerdaten sind die, die Google verwendet.
Der Core-Web-Vitals-Bericht in der Search Console gruppiert deine URLs nach Status, sodass du siehst, ob alle Produktseiten dasselbe Problem haben.
Der Web-Performance-Bericht von Shopify in Analytics zeigt dieselben echten Nutzerwerte im Zeitverlauf. Das hilft zu prüfen, ob eine Änderung etwas gebracht hat.

Konzentrier dich auf die drei Core Web Vitals: Largest Contentful Paint (wie schnell das Hauptbild oder der Haupttext erscheint), Interaction to Next Paint (wie schnell die Seite auf ein Tippen reagiert) und Cumulative Layout Shift (wie sehr Elemente herumspringen). Laborwerte schwanken von Test zu Test; jag keiner perfekten 100 hinterher.

1. App-Code entfernen, den du nicht nutzt

Apps sind die häufigste Ursache für einen langsamen Shopify-Shop. Jede App, die die Storefront berührt, kann JavaScript und CSS auf jeder Seite hinzufügen.

Liste deine Apps auf. Deinstalliere alle, die du nicht mehr nutzt.
Eine Deinstallation entfernt nicht immer den Code, den eine App ins Theme eingefügt hat. Durchsuch deine Theme-Dateien (Onlineshop > Themes > Code bearbeiten) nach dem Namen der App und entferne übrig gebliebene Snippets und Script-Tags.
Bevorzuge Apps mit Theme-App-Erweiterungen (App-Blöcke, die du im Theme-Editor einfügst). Sie werden bei der Deinstallation sauber entfernt und laden nur dort, wo du sie platzierst.
Prüf bei Apps, die du behältst, ob sie auf jeder Seite laden. Eine Größentabelle braucht nur Produktseiten.

2. Das größte Bild optimieren

Auf den meisten Produkt- und Kollektionsseiten ist das größte Element ein Produktfoto oder ein Hero-Banner. Mach es schnell:

Lade vernünftige Dateien hoch. Skaliere Fotos vor dem Upload auf etwa 2.000 bis 2.500 Pixel Breite und komprimiere sie. Das CDN von Shopify liefert automatisch verkleinerte Versionen und moderne Formate wie WebP aus, aber ein riesiges Original kostet trotzdem Zeit.
Lade das erste Bild nicht per Lazy Loading. Bilder oben auf der Seite sollten sofort laden. Lazy Loading ist für Bilder weiter unten gedacht.
Nutze responsive Bilder. Aktuelle Themes nutzen die Filter image_url und image_tag von Shopify, um je nach Bildschirm die richtige Größe auszuliefern. Ältere Themes liefern eventuell eine große Version an jedes Gerät.
Vermeide automatisch startende Videos im Hero-Bereich. Brauchst du ein Video, zeig zuerst ein Vorschaubild und lade das Video danach.

3. Widgets später laden

Bewertungen, Chat-Bubbles, Pop-ups, Upsell-Karussells und Social-Feeds müssen selten vor dem Produkt laden.

Lade Chat und Pop-ups, nachdem die Seite interaktiv ist, oder mit Verzögerung.
Platzier Bewertungs-Widgets unterhalb des sichtbaren Bereichs, damit sie den Hauptinhalt nicht blockieren. Behalte den Bewertungstext für SEO im HTML der Seite.
Entferne Tracking-Pixel von Drittanbietern, die du nicht mehr anschaust. Jedes ist ein weiteres Skript.

4. Ein aktuelles Theme nutzen

Themes für Online Store 2.0, darunter die kostenlosen Dawn-basierten Themes von Shopify, sind auf App-Blöcke, responsive Bilder und schlankeres JavaScript ausgelegt. Ein Theme von vor einigen Jahren mit schweren Slidern und jQuery kann langsam sein, egal was du entfernst.

Teste vor einem Wechsel die Demo-Produktseite des neuen Themes in PageSpeed Insights. Ein Theme, das schon in seiner eigenen Demo langsam ist, wird es auch mit deinen Produkten sein.

5. Layout-Verschiebungen stoppen

Inhalte, die beim Laden springen, verschlechtern den Cumulative Layout Shift und nerven Käufer.

Gib Bildern Breite und Höhe (der Filter image_tag von Shopify fügt sie hinzu).
Reservier Platz für Banner und Ankündigungsleisten, die nach dem Laden erscheinen.
Lade eigene Schriften mit font-display: swap und beschränke die Zahl der Schriftschnitte.

Was wenig bringt

Speed-Booster-Apps. Die meisten fügen der Seite ihr eigenes Skript hinzu. Code entfernen schlägt Code hinzufügen.
Hosting oder CDN wechseln. Bei Shopify geht das nicht, und es ist auch nicht nötig.
Ein paar Kilobyte CSS minifizieren. Das bewegt die echten Nutzerwerte selten, verglichen mit dem Entfernen einer App oder dem Optimieren des Hauptbilds.

Schnell bleiben

Die Ladezeit verschlechtert sich, wenn du Apps und Abschnitte hinzufügst. Prüf nach jeder neuen App eine Produktseite erneut und schau monatlich in den Core-Web-Vitals-Bericht. Ein Site Audit, etwa das von zaDojo, markiert langsame Seiten und zu große Bilder im ganzen Shop, sodass du nicht jede Seite einzeln testen musst.

Häufige Fragen

Beeinflusst die Ladezeit von Shopify das SEO? Ja, ein wenig. Core Web Vitals sind ein Rankingsignal, aber Inhalt und Relevanz zählen mehr. Für den Umsatz zählt die Ladezeit stärker: Käufer verlassen langsame Produktseiten.

Was ist ein guter Speed-Score bei Shopify? Ziel auf „Gut“ bei den Core Web Vitals in echten Nutzerdaten (Largest Contentful Paint unter 2,5 Sekunden, Interaction to Next Paint unter 200 Millisekunden, Cumulative Layout Shift unter 0,1). Der Laborwert von 100 ist eine Orientierung, kein Ziel.

Warum ist mein Shopify-Shop auf dem Handy langsam? Smartphones haben langsamere Prozessoren und Verbindungen, deshalb schadet schweres JavaScript von Apps dort viel mehr. Teste zuerst mobil.