Produktbilder komprimieren: 4 Lösungen für schnellere Ladezeiten

Ob Design-Stehlampe, Sneakers oder Armbanduhr: Je besser sich Ihre Kundschaft ein Bild von Ihrem Produkt machen kann, desto wahrscheinlicher wird es gekauft. Hochwertige Produktfotos sind daher ein unverzichtbarer Bestandteil einer gelungenen Customer Journey.

Produktfotos sind der Schlüssel zum Page Speed

Doch die vielen Bilder auf Übersichts- und Detailseiten sorgen auch für ein größeres Download-Volumen von Shops: Zurzeit beträgt der Anteil von Bildern in einem durchschnittlichen Online-Shop ca. 1,6 MB.

Je mehr Daten beim Aufruf der Webseite heruntergeladen werden müssen, desto langsamer dauert der Seitenaufbau. Wie bedeutend der Page Speed – die Ladegeschwindigkeit ihres Online-Shops – für den Erfolg und Umsatz ist, haben wir bereits in diesem Artikel beschrieben.

Kurz gesagt: Schnelle Shops profitieren von...

•  niedrigerer Bounce Rate: Weniger Nutzer springen beim Ladevorgang ab.

•  höherer Conversion Rate: Mehr Nutzer werden zu zahlenden Kunden.

Was bedeutet das für Produktbilder? Weniger Bilder würden zwar einen schnelleren Page Speed ergeben, aber auf sie zu verzichten, kommt nicht in Frage!

Im Gegenteil: Fast 80% der Nutzer*innen wünschen sich sogar mehr Bilder in Online-Shops.

Fazit: Die Produktfotos müssen also bei gleicher Bildqualität ein kleineres Datenvolumen haben. Wie das geht und wie Sie als Shopbetreiber mit so wenig Kosten und Aufwand wie möglich Bilder komprimieren können, zeigen wir in diesem Artikel.

Auch spannend: (Checkliste) 10 Tipps für die perfekten Produktbilder

Produktbilder verkleinern ohne Qualitätsverlust?

Ob mit dem Smartphone oder der Digitalkamera aufgenommen: Das Standardformat für Fotos ist nach wie vor JPEG. Das Kompressionsverfahren ist für hohe Bildkomplexitäten und geringe Dateigrößen optimiert.

Der Nachteil: JPEG-Bilder sind “verlustbehaftet”. Gespeicherte Änderungen an einem Bild sind nicht mehr rückgängig zu machen und ein Bild in zu kleinen Auflösungen lässt sich nicht bei gleichbleibender Qualität “hochskalieren”.

Bevor Sie also JPEG-Bilder komprimieren, denken Sie daran, Sicherheitskopien anzulegen!

Bild-Kompression über die JPEG-Qualitätsstufe

Über die sogenannte Qualitätsstufe können JPEG-Bilder am einfachsten komprimiert werden. Kommen die Bilder aus der Kamera, sind sie für gewöhnlich auf die maximale Qualitätsstufe 100 eingestellt.

Wird die Qualitätsstufe verringert, dann wird auch die Dateigröße des Bildes reduziert – und das in einem beachtlichen Maße. Allein durch die Verringerung auf einen Wert von 85 kann ein Bild auf weniger als die Hälfte seiner Größe reduziert werden.

Bei dieser Komprimierung können allerdings mit dem Auge erkennbare Artefakte und Schlieren im Bild entstehen. Ein auf diese Weise “kaputt komprimiertes” Bild wirkt sich auf die visuelle Qualität des Produktes im Bild aus und wird deswegen von Nutzer*innen abgelehnt.

Achten Sie daher immer darauf, dass die komprimierten Bilder für das menschliche Auge hochwertig bleiben.

Keine optimale Qualitätsstufe für JPEG-Bilder

Da die Bildinhalte jedes Fotos einzigartig zusammengesetzt sind, gibt es jedoch keine optimale Qualitätsstufe für JPEG-Bilder.

So gibt es Fotos, die bereits bei einer Qualitätsstufe von 90 die angesprochenen Artefakte und Schlieren aufweisen können. Andererseits können Fälle auftreten, in denen ein Bild noch auf einer Qualitätsstufe von 60 für das menschliche Auge unverändert erscheint. Das lässt sich an einem anschaulichen Beispiel belegen.

Das bedeutet also, dass für eine optimale Komprimierung jedes Bild individuell komprimiert werden müsste. Doch ist das überhaupt zu schaffen?

Ein Rechenbeispiel:

• In Ihren Shop sollen 100 neue Produkte mit je 5 Fotos aufgenommen werden.

• Insgesamt also 500 Bilder, die komprimiert werden müssen.

• Sie testen verschiedene Qualitätsstufen und speichern die optimale ab.

• Dabei entsteht ein Aufwand von 1 Minute pro Bild.

• Bei 500 Bildern bedeutet das 500 Minuten, also ein ganzer Arbeitstag.

Das ist für Online-Händler*innen auf Dauer kaum zu bewältigen.

4 Lösungen um Produktbilder zu komprimieren

Um die hohen Aufwände individueller Komprimierung zu ersetzen, gibt es verschiedene Möglichkeiten. Im Folgenden wollen wir 4 unterschiedliche Wege zur Bild-Komprimierung aufzeigen und dabei die Vor- und Nachteile abwägen.

1. Manuell mit Stapelverarbeitung

Statt die Produktbilder einzeln zu komprimieren, können Sie Programme nutzen, mit denen mehrere Bilder auf einmal komprimiert werden können.

Diese Stapelverarbeitung wird von Desktop-Programmen wie Irfanview oder Webseiten wie Optimizilla angeboten. Dabei legen Sie eine Qualitätsstufe für alle Bilder fest und sehen in einer Vorschau, ob Anpassungsbedarf besteht.

Diese Programme sind entweder Freeware oder können zu geringen Lizenzgebühren gekauft werden. Über Bildbearbeitungsprogramme können Sie zudem weitere Optimierungen an den Bildern vornehmen.

Für die unterschiedlichen Bilder, die in der Stapelverarbeitung komprimiert werden, müssen Sie jedoch einen Kompromiss finden, bei dem alle Bilder noch qualitativ hochwertig bleiben. Das führt dazu, dass die Qualitätsstufe nur wenig gesenkt wird und sie demzufolge auch wenig bei den Dateigrößen einsparen können.

Vorteile der Stapelverarbeitung:

• Aufwände bei der Komprimierung werden gesenkt

• Programme sind kostenlos oder günstig

Nachteile der Stapelverarbeitung:

• Es entsteht immer noch ein personeller Aufwand

• Keine optimale Einstellung der Qualitätsstufe

• Einsparungen bei der Dateigröße gering

• Wird oft vergessen, wenn nicht Teil des Workflows

Hinweis: Prüfen Sie, mit unserem kostenlosen Whitepaper, ob Ihr Online-Shop die wichtigsten Vertrauenselemente enthält mit denen Sie Kunden von sich überzeugen. 

2. Automatisiert durch einfache Plugins

Die meisten Online-Händler*innen in Deutschland setzen auf Shopsysteme wie Shopware, Shopify oder Magento. Diese Systeme lassen sich durch Plugins erweitern.

Einfache Plugins wie das zur Komprimierung und Skalierung der Bilder für Shopware bieten die Möglichkeit, feste Qualitätsstufen für Produktfotos einzurichten. Beim Hochladen der Bilder werden diese dann automatisiert komprimiert.

Für Plugins entstehen in der Regel nur einmalige Kosten und ihre Einrichtung benötigt keine Programmierung. Durch eine grafische Oberfläche kann das Plugin konfiguriert werden. Das ist praktisch und hält die Aufwände sehr gering.

Durch die fest eingestellte Qualitätsstufe haben Sie jedoch keine Kontrolle mehr über die Bildqualität des komprimierten Fotos, sodass unschöne Ergebnisse entstehen können.

Auch hier werden Sie daher dazu tendieren, die Qualitätsstufe hoch anzusetzen.

Martin Sailer-Arnold vom Online-Möbel-Händler delife.eu beschreibt seine Erfahrung mit einfachen Plugins so:

“Die automatische Optimierung über Plugins brachte leider nicht den gewünschten Erfolg, da die Bilder entweder in zu schlechter Qualität oder mit kaum reduzierter Datengröße ausgeliefert wurden.”

Vorteile einfacher Plugins:

• Sehr geringe Aufwände durch Konfiguration

• Keine Programmierung notwendig

• Einmalige Kosten beim Kauf des Plugins

Nachteile einfacher Plugins:

•  Bilder werden nicht individuell komprimiert

• Qualität kann erst nachträglich kontrolliert werden

• Wenig Einsparungen bei Dateigrößen

3. Automatisiert durch komplexe Plugins und Skripte

Neben diesen einfachen Plugins, die eine Stapelverarbeitung automatisieren, gibt es auch komplexere Plugins und Skripte, die sich in den Entwicklungsprozess integrieren lassen.

Diese Plugins und Skripte wie beispielsweise kraken.io oder TinyPNG nutzen Algorithmen, die das menschliche Auge bei der Einschätzung der Bildqualität ersetzen können. Dadurch wird eine individuelle Komprimierung von Bildern ermöglicht.

Die Bezahlung wird hier nach dem Datenvolumen der Bilder vorgenommen, die durch das Plugin oder Skript komprimiert werden. Dadurch entstehen kontinuierliche Kosten, die für Shops mit vielen Produktfotos besonders hoch sind.

Mit vielen dieser Plugins geht auch ein Entwicklungsaufwand einher, da die komplexeren Systeme Anpassungen am Server benötigen können.

Stephan Helten von dem Schmuckhändler brogle.de sieht komplexe Plugins und Skripte gemischt:

“Das Skript, das wir zur Bild-Optimierung in unsere Build-Tool-Chain integrierten, brachte zwar gute Ergebnisse, war aber aufwendig und teuer.”

Vorteile komplexer Plugins und Skripte:

• Individuelle Komprimierung durch Algorithmen

• Automatischer Ablauf nach einmaliger Integration

Nachteile komplexer Plugins und Skripte:

• Setzen Programmierung oder externe Anmeldung voraus

• Hohe Kosten durch Abrechnung pro Bild

4. Automatisiert durch Cloud-Services

Bei einem Cloud-Service wird Ihr Online-Shop in der Cloud gespeichert und dort optimiert, bevor er an die Nutzer*innen ausgegeben wird.

Auch Cloud-Services wie wao.io und Akamai arbeiten mit Algorithmen, um Produktbilder individuell und bestmöglich zu komprimieren. Im Gegensatz zu Plugins und Skripten ist aber kein Eingriff in das bestehende System vonnöten.

Zu beachten ist, dass nicht alle Shopsysteme mit einem Cloud-Service kompatibel sind. Dies gilt geschlossene Plattformen, die selbst eine Cloud verwenden. Für die meisten Systeme, z.B. Shopware und Magento ist die Kompatibilität aber gegeben.

Die Abrechnung erfolgt nicht über das Datenvolumen der Bilder, sondern pro Besucher*in des Shops. Dies lohnt sich also besonders für kleine und mittlere Shops.

Zusätzlich zur Komprimierung von Bildern sind bei Cloud-Services weitere Maßnahmen zur Page-Speed-Optimierung im Preis enthalten, etwa die schnelle Datenübertragung mit HTTP/2 oder das “Lazy Loading” von Bildern.

Viele Shopbetreiber*innen betrachten Cloud-Services mit Skepsis, wenn diese nicht aus Deutschland oder der EU stammen und ihre Daten im Ausland hosten. Informieren Sie sich daher über die Webseiten der Anbieter, wenn Sie Bedenken haben.

Vorteile von Cloud-Services:

• Individuelle Bild-Komprimierung durch Algorithmen

• Einmalige Einrichtung, zusätzliche Page-Speed-Optimierungen

• Geringere Kosten durch Abrechnung pro Besucher

• Kontinuierliche Verbesserungen

Nachteile von Cloud-Services:

• Mögliche Inkompatibilität mit geschlossenen Plattformen

• Vertrauen in Anbieter muss gegeben sein

Lese-Tipp: Optimieren Sie Ihren Checkout für mehr Konversionen!

Fazit: Finden Sie die beste Lösung für sich

Mit diesen 4 Lösungswegen haben wir Ihnen die breite Palette von Möglichkeiten vorgestellt, mit denen Sie die Produktbilder in Ihrem Shop komprimieren können.

Ob Sie nun manuell oder automatisiert über Plugins oder einen Cloud-Service wie wao.io komprimieren – wichtig ist, dass Sie durch Bild-Komprimierung zu einem schnelleren Shop gelangen können.

Dadurch werden Sie mehr Traffic für Ihren Shop bekommen und Ihre Conversions ankurbeln. Lesen Sie in dem kostenlosen Whitepaper wie Sie die perfekten Produktbilder erstellen können, die Ihre Kundschaft begeistert und zum Kauf motiviert!