Das Wichtigste in Kürze
- Shopify konvertiert Bilder automatisch in WebP – aber große Quelldateien machen deinen Shop trotzdem langsam.
- Nicht optimierte Bilder sind eine der häufigsten Ursachen für schlechte Core Web Vitals-Werte bei Shopify.
- Komprimiere Bilder vor dem Hochladen mit kostenlosen Tools wie Squoosh oder TinyPNG.
- Peile unter 200 KB für Produktbilder und unter 300 KB für Hero-/Banner-Bilder an.
Um Bilder für Shopify zu komprimieren, jage sie vor dem Hochladen durch Squoosh oder TinyPNG, halte Produktfotos auf einer maximalen Breite von 2048px und nutze eine App wie TinyIMG für Bilder, die bereits in deinem Shop sind. Das CDN von Shopify konvertiert und skaliert sie, behebt aber keine zu schwere Quelldatei.
Wenn du ein 5 MB großes Produktfoto hochlädst, liefert Shopify zwar eine kleinere Version aus, geht aber von einer schweren Quelldatei aus. Das Komprimieren von Bildern vor dem Upload ist eine einfache Angewohnheit, die sich durch schnellere Ladezeiten, besseres SEO und niedrigere Absprungraten auszahlt.
Warum du uns vertrauen kannst
Jacques hat über 15 Jahre Erfahrung in der Entwicklung und hat langsam ladende Storefronts für hunderte von Marken analysiert. Wir entwickeln Fudge, den KI-Operator für Shopify-Shops, der von über 3.100 Shopify-Shops genutzt und im Shopify App Store mit 4.9 bewertet wird.
Komprimiert Shopify Bilder automatisch?
Teilweise.
Shopify macht automatisch Folgendes:
- Konvertiert Bilder ins WebP-Format (kleinere Dateigröße, gleiche Qualität)
- Liefert Bilder über sein globales CDN aus
- Generiert mehrere Größen für verschiedene Bildschirmbreiten
Shopify macht Folgendes NICHT:
- Deine Quelldateien vor dem Speichern komprimieren
- Unnötige Metadaten aus Uploads entfernen
- Alle Bilder auf deiner Seite standardmäßig lazy-loaden (hängt von deinem Theme ab)
Also ja, Shopify hilft – aber wenn du mit einem bereits komprimierten Bild startest, hat das CDN weniger Arbeit und die Ladezeit wird weiter verbessert.
Du fragst dich, ob ein Drittanbieter-Bild-CDN besser wäre? In unserem Shopify Image CDN-Vergleich erfährst du, wann das integrierte CDN ausreicht und wann Cloudinary oder Bunny ihr Geld wert sind.
Warum Bildkomprimierung für deinen Shopify-Store wichtig ist
Die Ladezeit der Seite beeinflusst direkt zwei Dinge: SEO-Rankings und die Conversion Rate.
Google nutzt die Core Web Vitals als Ranking-Signal. Die Hauptmetrik, die durch große Bilder beeinflusst wird, ist der Largest Contentful Paint (LCP) – wie lange es dauert, bis das größte Element auf der Seite (meist ein Hero-Bild oder Produktfoto) geladen ist.
Langsamer LCP = schlechtere Rankings. Langsamere Seiten konvertieren zudem meist schlechter, und komprimierte Bilder sind oft der schnellste Quick Win für die Geschwindigkeit in einem Shopify-Shop.
Für den Rest der Page-Speed-Optimierung, siehe Ein Shopify-Theme schneller machen.
So komprimierst du Bilder vor dem Upload in Shopify
Kostenlose Tools
Squoosh – Googles browserbasierter Kompressor. Unterstützt WebP, AVIF und JPEG. Zeigt einen Vorher-Nachher-Vergleich der Dateigröße. Bestens geeignet für einzelne Bilder.
TinyPNG / TinyJPG – Einfache Drag-and-Drop-Komprimierung. Reduziert PNG- und JPEG-Dateien um 60–80 % bei minimalem sichtbarem Qualitätsverlust. Kostenlos für bis zu 500 Bilder pro Monat.
ImageOptim – Mac-App für Batch-Komprimierung. Gut geeignet, um einen ganzen Ordner voller Bilder vor einem Produkt-Launch zu verarbeiten.
Empfohlene Einstellungen
| Bildtyp | Format | Max. Dateigröße | Max. Abmessungen |
|---|---|---|---|
| Produktbild | WebP oder JPEG | 200 KB | 2048 × 2048px |
| Hero / Banner | WebP oder JPEG | 300 KB | 2560 × 1440px |
| Hintergrundbild | WebP oder JPEG | 300 KB | 1920 × 1080px |
| Icon / Logo | PNG oder SVG | 100 KB | Nach Bedarf |
Tipp: Du brauchst keine Produktbilder, die breiter als 2048px sind. Shopify empfiehlt 2048 × 2048px für quadratische Produktfotos, und das CDN skaliert jedes Bild auf die Breite, die dein Theme anfordert. Banner in voller Breite sind die Ausnahme – für diese und jeden anderen Bildtyp, schau dir unseren Guide zu Shopify-Bildgrößen an.
So komprimierst du vorhandene Shopify-Bilder per Bulk-Verarbeitung
Wenn dein Shop bereits hunderte nicht optimierte Bilder enthält, ist es unpraktisch, diese händisch zu bearbeiten. Eine Shopify-App kann die Bulk-Komprimierung deiner bestehenden Mediathek übernehmen.
TinyIMG und Crush.pics sind zwei bewährte Optionen im Shopify App Store. Beide scannen deine vorhandenen Produktbilder, komprimieren sie und ersetzen die Originale – meist ohne sichtbaren Qualitätsunterschied.
Achte auf eine App, die Vorher-Nachher-Dateigrößen anzeigt und ein Rollback ermöglicht, falls nötig.
So nutzt du Lazy-loading für Bilder in Shopify
Lazy Loading bedeutet, dass Bilder erst geladen werden, wenn ein Nutzer in ihre Nähe scrollt – und nicht alle auf einmal, wenn die Seite das erste Mal lädt. Das verbessert die anfängliche Ladezeit der Seite enorm.
Die meisten modernen Shopify-Themes (Dawn, Horizon usw.) nutzen standardmäßig Lazy Loading für Bilder über das loading="lazy"-Attribut in <img>-Tags. Um deins zu prüfen: Rechtsklick auf ein beliebiges Bild in deinem Shop → Untersuchen → suche nach loading="lazy" im HTML.
Falls dein Theme das nicht enthält, kann ein Entwickler (oder Fudge) es zu deinen Bild-Templates hinzufügen. Mehr zu Lazy Loading findest du unter So nutzt du Lazy Loading für Bilder in Shopify.
Wie sich Bildkomprimierung in den Geschwindigkeitsberichten von Shopify zeigt
Shopifys Web-Performance-Bericht nutzt Core Web Vitals von echten Nutzern. PageSpeed Insights führt Lighthouse aus, einen Labortest, der große Bilder unter einer Erkenntnis markiert: „Bildbereitstellung verbessern“. Er listet Bilder auf, deren Downloadgröße kleiner sein könnte, weil sie größer ausgeliefert als angezeigt werden, zu schwach komprimiert sind oder in einem älteren Format vorliegen. Ältere Lighthouse-Berichte teilten dies in „Bilder richtig skalieren“ und „Bilder effizient codieren“ auf.
Das meiste davon hast du selbst in der Hand, indem du Bilder vor dem Hochladen komprimierst und skalierst. Allein die Bildoptimierung hebt den PageSpeed-Score eines Shops oft spürbar an.
Skripte sind die andere häufige Lighthouse-Warnung; siehe Renderblockierende Skripte in Shopify beheben.
Welches Bildformat sollte ich für Shopify verwenden?
- WebP bietet die beste Kombination aus Qualität und Dateigröße. Es ist bei gleicher visueller Qualität typischerweise 25–35 % kleiner als JPEG und wird von allen modernen Browsern unterstützt. Shopify konvertiert hochgeladene Bilder automatisch in WebP, wenn sie an kompatible Browser ausgeliefert werden.
- JPEG ist der sichere Fallback für Produktfotos und ältere Tools.
- PNG lohnt sich nur, wenn du einen transparenten Hintergrund brauchst (Logos, Icons).
- GIF ist nur für kurze animierte Loops gedacht. Nutze stattdessen kurze MP4-Videos für eine bessere Komprimierung.
Für die SEO-Seite von Bildern, siehe Alt-Texte zu Bildern in Shopify hinzufügen.
FAQ
Sollte ich mich allein auf Shopifys automatische Komprimierung verlassen?
Nein. Die CDN-Optimierung von Shopify hilft zwar, bewirkt aber keine Wunder: Sie kann eine aufgeblähte Quelldatei nicht beheben. Ein 5-MB-Upload wird als kleinere Datei ausgeliefert, aber die zugrunde liegende Datei bleibt groß und die ausgelieferte Version geht von einer viel schwereren Quelle aus. Komprimiere unabhängig vom CDN-Verhalten immer vor dem Hochladen.
Was ist der Unterschied zwischen WebP, JPEG und PNG bei Shopify?
WebP: kleinste Größe bei gleicher Qualität, unterstützt sowohl Fotos als auch Grafiken mit Transparenz, ideal für die meisten Produktbilder. JPEG: weithin kompatibel, etwas größer als WebP, gut für Fotos. PNG: größte Dateigröße, unterstützt Transparenz, nur für Logos/Icons oder Grafiken mit scharfen Kanten verwenden. Shopify konvertiert hochgeladene Bilder für unterstützende Browser automatisch in WebP.
Verschlechtert zu viel Komprimierung die Bildqualität?
Ja, ab einem gewissen Punkt. Die JPEG-Qualität ist bei 80 % optisch meist identisch mit 100 %, aber 30–50 % kleiner. Unter 60 % werden Artefakte (blockige Bereiche, Streifenbildung bei Verläufen) sichtbar. Auch bei WebP sind 80 % Qualität ein guter Standardwert. Schau dir die komprimierte Version vor dem Upload immer bei 100 % Zoom auf einem echten Bildschirm an.
Kann ich bereits bei Shopify hochgeladene Bilder nachträglich komprimieren?
Ja, über Apps (TinyIMG, Crush.pics usw.), die bestehende Bilder durch komprimierte Versionen ersetzen. Shopify selbst hat keine integrierte Massen-Rekompression. Für einzelne Produkte funktioniert der manuelle Weg (herunterladen → neu komprimieren → neu hochladen), ist aber langsam. Oder beschreibe Fudge einfach, was du brauchst ("Untersuche unseren Shop auf Produktbilder über 200 KB"), und es listet dir die zu großen Bilder Seite für Seite auf.
Wie sehr verbessert die Bildkomprimierung den PageSpeed von Shopify wirklich?
Oft spürbar. Schwere Bilder sind eine häufige Ursache für langsame Shopify-Shops, und ein 3-MB-Hero-Bild auf 300 KB zu komprimieren, kann den LCP bei langsamen Verbindungen merklich verkürzen. Das ist meistens einer der ersten Performance-Fixes, die sich wirklich lohnen.
