Web-Performance im E-Commerce: Ein schnelles Bild sagt mehr als tausend Worte

Automatisierte Web Performance Optimization unterstützt E-Commerce-Anbieter dabei, die richtige Balance zu finden zwischen Umfang und Format des eingesetzten Bildmaterials und der Performance ihrer Website.

Als die F.A.Z. 2007 erstmals in ihrer Geschichte Farbfotos auf die Titelseite druckte, war das für die renommierte Zeitung und ihre Leserschaft eine Revolution. Es war das Jahr, in dem das erste iPhone auf den Markt kam und die Digitalfotografie neu definierte. Erst seitdem gibt es massentaugliche Smartphones mit wirklich guten Digitalkameras, heute nutzen bereits rund 2,5 Milliarden Menschen solche “Telefone”. Und sie fotografieren viel damit, sehr, sehr viel: 1,2 Billionen Fotos wurden alleine 2017 aufgenommen.

Diese riesige Menge an Fotos nimmt stetig zu, vor allem Social Networks haben großen Anteil daran. Über Snapchat, Whatsapp, Instagram und andere Netzwerke können Fotos nicht nur einfach geteilt werden, sie sind zugleich – neben Videos – die wichtigste Ausdrucksform für sehr viele Nutzer.

Das Bild bestimmt den ersten Eindruck

Das gilt nicht nur in den persönlichen Filter-Bubbles der sozialen Netzwerke: Bilder, seien es Fotos oder Grafiken, sind für die allermeisten Web-Angebote ein zentrales Element. Vor allem E-Commerce-Anbieter setzen auf das Foto als universellste aller “Sprachen”. Nur wenige User könnten zu zahlenden Kunden konvertiert werden, zeigte man ihnen nicht das betreffende Produkt im Detail.

Fotos müssen also ins Netz, überall. Während aber ein Instagram-User einfach loslegen kann, weil die App ihm die meiste Arbeit bei Verarbeitung und Upload abnimmt, stoßen Menschen, die über ein CMS einen Online-Shop pflegen, auf (mindestens) vier Probleme bei der Arbeit mit Fotos:

1. Dateigröße: Moderne Kameras machen immer bessere Digitalfotos, aber zum Preis steigender Dateigrößen. Ein 10-Megabyte-Foto auf einer Website einzubinden ist zumeist nicht sinnvoll; die Datei muss verkleinert werden, damit sie auch Usern mit langsamer Internetverbindung schnell angezeigt wird.

2. Bildformat: Damit ein Foto nicht verzerrt dargestellt wird, muss auch das Seitenverhältnis in Relation zur Darstellung auf der Website beachtet und deshalb oft bearbeitet werden.

3. Fehlende Caching-Informationen: Wird auf komplexen Websites fehlerhaftes oder gar kein Image-Caching eingesetzt, steigt die Ladezeit an. Das wäre einfach zu beheben, bleibt aber oft außer Acht.

4. Dateiformate: Es gibt unüberschaubar viele RAW-Formate, bei denen die Fotos als Rohdaten der jeweiligen Kamera gespeichert sind. Und natürlich gibt es mit JPG, PNG, GIF und WebP gleich mehrere Standardformate für die Online-Nutzung. Und jede hat ihre begründete Bewandtnis. Was nutzt man wann, wo und wie? Kommt halt drauf an…

(Ja, neben diesen gibt es noch weitere Probleme. Wir beschränken uns hier auf diese vier.)

Probleme mit Fotos können sich negativ auf den Umsatz auswirken

Diese vier Probleme gleichzeitig und nachhaltig in den Griff zu bekommen ist nicht trivial. Viele Fälle lassen sich zwar einfach automatisieren, etwa die Umwandlung in ein bestimmtes Dateiformat oder die Verringerung der DPI-Zahl. Aber in den meisten Fällen werden solche und andere Aufgaben von Menschen erledigt. Solche manuellen Workflows zwischen Fotografie, Grafik und Marketing kosten Arbeitszeit, also Geld, und sind einer von zwei Gründen, warum das Problem mit den Fotos auch ein finanzielles ist.

Der andere Grund ist vor allem für E-Commerce-Anbieter der wichtigere: Probleme mit Bilddateien führen oft zu längeren Ladezeiten einer Website. Das wirkt sich negativ auf den Umsatz aus – und zwar direkt, nicht erst im nächsten Quartal oder Jahr.

“In retail, we see that for every one second delay in page load time, conversions can fall by up to 20%”, ist eine Erkenntnis von Google. Und weil der Primus unter den Suchmaschinen seinen Nutzern vor allem Websites empfehlen will, die eine gute User Experience bieten, werden langsame Angebote weiter hinten in der Ergebnisliste angezeigt. Die Sichtbarkeit sinkt und das kann sich massiv auf den Umsatz auswirken.

Auch Amazon stellt eigene Forschung zum Thema “Ladezeiten” an, und kommt zu dem Ergebnis: “Amazon calculated that a page load slowdown of just one second could cost it $1.6 billion in sales each year.” Klar, dass Amazon neben der Optimierung des Check-Out-Prozesses vor allem in eine möglichst schnelle Website investiert.

Anbieter sollten also die Balance finden zwischen Umfang und Format des eingesetzten Bildmaterials und der Performance ihrer Website. Zu wenige oder schlecht aufgelöste Fotos sind ebenso schlecht für den Umsatz wie lange Ladezeiten.

Zwei unterschiedliche Lösungsansätze

Aber es gibt Hoffnung! Künstliche Intelligenz in neuronalen Netzwerken wird das Foto-Problem ein für alle mal lösen!

Nicht. (Erste Ansätze dafür mag es geben, der Weg dahin ist aber noch sehr weit.)

Bis es soweit ist, bleibt es eine große Herausforderung, bildlastige Websites gleichzeitig aktuell zu halten, auf Conversion zu optimieren und möglichst schnell auszuliefern. Anstatt sich mit der Lösung des Foto-Problems zu beschäftigen, liegt es nahe, größer zu denken und gleich die Geschwindigkeit der Website insgesamt zu optimieren; unabhängig davon, wie viele und welche Fotos in welchen Formaten dort eingesetzt werden. “Web Performance Optimization” heißt das, und es adressiert natürlich nicht nur Bildmaterial, sondern etliche weitere Faktoren, die Websites ausbremsen.

Anbieter, für die Geschwindigkeit UND Fotos umsatzrelevant sind, und die dem Problem begegnen wollen, haben zwei Möglichkeiten:

1. Manuell optimieren: Es gibt zahlreiche Entwickler, die den Code einer Website derart optimieren können, dass die Performance nachhaltig steigt. Diese sollte ein Anbieter allerdings möglichst fest an sich binden, denn das ist eine langfristige und immer wiederkehrende Aufgabe. Was “schnelle Website” in der Praxis heißt, wird von Kundenwünschen und Technologie vorgegeben – und beides entwickelt sich rasant weiter. Permanente manuelle Optimierung muss man sich leisten können.

2. Automatisch optimieren: Deshalb ist automatisierte Web Performance Optimization hier oft die bessere Alternative. Denn statt fortlaufend den Code der Website zu aktualisieren, können Tools wie “wao.io” Performance-relevante Anpassungen auch “on-the-fly” während der Übertragung zum User durchführen. Das ist ein völlig neuer Ansatz und in den meisten Fällen effizienter als die manuelle Optimierung, bei der jedes Mal neuer Aufwand für Entwicklung, Testing und Roll-out anfällt.

Welche Lösung die bessere ist, hängt von der Ausgangslage ab. Amazon beispielsweise entwickelt gezielt neue Technologien dafür und setzt auf eine Mischform von interner manueller und selbst-entwickelter automatisierter Optimierung. Allerdings spielt Amazon in einer ganz eigenen Liga, für 90% aller E-Commerce-Anbieter kommt das nicht in Frage.

Hier setzt die automatisierte Optimierung an, die noch nicht weit verbreitet ist, aber das Potential hat, gute Performance (und Security!) zum Standard für jeden Online-Shop zu erheben. Sevenval setzt dabei auf “wao.io”, für dessen Aktivierung ein Anbieter nur den DNS-Eintrag für seine Website anpassen muss. Ein eigens für wao.io entwickelter Algorithmus reduziert Dateigrößen von JPG-Dateien deutlich, ohne dass diese an Qualität einbüßen. “Viele gute Fotos” und “kurze Ladezeiten” schließen einander nicht mehr aus.

 

Dieser Artikel basiert auf dem Vortrag “Photography curation in a digital age” von Jonothan Birkett beim “CGNwebperf #22” im März 2018. Jonothan ist Teil des Sevenval-Teams und mitverantwortlich für wao.io, den neuen on-the-fly-Service für die Web Performance (& Security) Optimization für Websites.

Lesen Sie zu diesem Thema auch:
Gute UX, schlechte UX: Wann Investitionen in SEO und Ads keinen Sinn ergeben
Ist Ihr Business zu langsam für Facebook?
Risiko 3rd Party Integrations: Längere Ladezeiten = Weniger Umsatz

 

Zur Blog-Startseite