Background

Pixelz Blog

Erhalten Sie einen Einblick in die Produktfotografie, Nachbeareitung und optimale Vorgehensweisen in Sachen E-Commerce-Produktbilder.

Produktbilder von Pixelz: Was uns 7 Millionen bearbeitete Bilder lehren [Infografik ]


Main Image
Wollten Sie schon immer wissen, wie die meisten Produktbilder tatsächlich aussehen? Sind Sie neugierig zu erfahren, ob es so etwas wie ein Industriestandard gibt?
Nun, wir haben uns das gefragt. Und weil wir Daten von mehr als zwanzigtausend Kunden und sieben Millionen bearbeiteten Produktbildern haben, haben wir beschlossen, die Antworten zu finden und sie mit Ihnen zu teilen.

Hier ist, was wir gelernt haben

Wir haben die Highlights in einer handlichen Infografik dargestellt. Für tiefergehende Analysen, wie zum Beispiel, “Was bedeutet das für mich?”-Interpretationen, lesen Sie nach dieser Grafik bitte weiter.

Product image infographic showing industry standards and best practices for background, alignment, filetype, dimensions, and more

Wie sieht das eigentlich aus?

Jedes Bild hat einen Dateityp, Größe, Ränder und einen Hintergrund. Nachdem wir die Bilder betrachtet haben, haben wir folgende Daten ermittelt:

  • 75% der ausgegebenen Bilder sind JPG
  • 76% sind mit einem weißen Hintergrund gefüllt
  • 79% sind vertikal zentriert ausgerichtet
  • 1000px ist die häufigste Breite
  • 750px ist die häufigste Höhe
  • 25px für jede Seite ist der häufigste Randsaum

Möchten Sie sehen wie das in Wirklichkeit aussieht? Hier ist ein Beispiel, dass den häufigsten Spezifikationen entspricht:

Vor der Nachbearbeitung.

Vor der Nachbearbeitung.

Nach der Nachbearbeitung mit den häufigst genutzten Spezifikationen.

Nach der Nachbearbeitung mit den häufigst genutzten Spezifikationen.

Nicht zu dramatisch, nicht wahr? Schön und sauber. Es ist die Art von Bild, die eine E-Commerce-Website zu einer gelungenen Surferfahrung macht.

Fangen wir mal an nach den Daten zu suchen, wir werden sehen ob wir herausfinden können, was passiert ist und warum.

Universelle Bildeigenschaften

Sie können raffiniert Besonderheiten hinzufügen, um Ihre Bilder von Ihren Konkurrenten abzuheben, trotzdem teilen aber alle Bilder einige Eigenschaften. Hier sind die häufigsten Werte, die wir gefunden haben, angelegt als Pixelz Bestell-Spezifikationen.

Pixelz product image order specifications using the most common values

Produktbild-Spezifikationen, mit den am häufigsten verwendeten Werten.

Lassen Sie uns jede Eigenschaft durchgehen und sie etwas näher betrachten.

Dateityp : Alle begrüßen König JPG

Zunächst einmal hat jedes Bild einen Dateityp. Bei Pixelz, können Sie aus JPG, PNG, TIFF und PSD wählen. Wie man es erwartet, JPG dominiert absolut:

In Sachen Produktbild ist JPG bei weitem der häufigste Dateityp.

pie chart showing most common product image file types: jpg, png, tiff, psd

JPG is far and away the most common product image file type.

Warum JPG das Web beherrscht?

Seitenladegeschwindigkeit ist wichtiger als die optimale Komprimierung.

JPG verwendet eine verlustbehaftete Komprimierung, die eine hohe (aber nicht perfekte) Qualität beibehält, während PNG verlustfreie Komprimierung verwendet, die jede Menge von Zoomen verträgt und Transparenz ermöglicht. JPG-Bilder sind kleiner (weniger Bytes), das ist alles, um die Debatte zu beendet. Im Internet kann ein Bruchteil einer Sekunde langsameres Laden, den Umsatz kosten.

Im Netz sind Produktbilder in der Regel JPG und das wird sich nicht ändern, bis die Bandbreite keine Rolle mehr spielt, oder einige neue Dateitypen den Apple Cart aus der Bahn werfen.

Zurück zu unserer Tabelle: Also ist anzunehmen das PSD und TIFF, die letzten Bilder im Einsatz, die ausgewählt werden, für etwas anderes sein müssen. Beide Formate lassen Ebenenmasken und Beschneidungspfade von Bildbearbeitungsprogrammen zu, wenn Sie an den Eigentümer zurückgegeben werden, was nützlich ist, wenn Sie plattformübergreifende Publikation Ihrer Produktbilder (wie gedruckte Kataloge, Web, E-Mail, etc.) planen.

Haben Sie keine Angst anders zu sein! 7.000.000 Produktbilder offenbaren Industrie-Normen, aber Ihr…

Hintergrund: Weiß gewinnt ausgezeichnet

Die meisten Nutzer von Produktbildern wählen, den ursprünglichen Hintergrund aus ihren Produktbildern zu schneiden und mit reinem Weiß zu ersetzen.

76% aller Produktbilder haben weiße Hintergründe.

Pie chart showing most common product image backgrounds after post-production: white, transparent, no change.

Warum sind die meisten Bildhintergründe mit Weiß gefüllt?

Konsistenz und präzise Farbwiedergabe, beide werden von einem weißem Hintergrund geliefert.

Es gibt tatsächlich einige Dinge die hier vorgehen:

  1. Das Entfernen des Hintergrunds aus einem Produktbild beseitigt Ablenkungen und hält den Fokus auf Ihrem Produkt.
  2. Einfarbige Hintergründe reduzieren die Dateigröße, weil sie die Kompression vereinfachen.
  3. Die meisten Web-Seiten sind weiß, sodass ein Produktbild mit weißem Hintergrund, sich gut in die Seite einfügt.
  4. Das Füllen des Hintergrunds eines Bildes mit weiß, ähnlich wie Produkte auf einem weißen Hintergrund zu fotografieren, stellt die Produktfarben genauer dar.

Was ist ein transparenter Hintergrund?

Eine coole, aber nicht voll unterstützte Funktion.

PNG-Bilder können transparente Hintergründe haben, aber es wird nicht überall unterstützt.

PNG-Bilder können transparente Hintergründe haben, aber es wird nicht überall unterstützt.

Bilder mit transparentem Hintergrund haben den ursprünglichen Hintergrund ausgeschnitten und nicht ersetzt. Transparenz kann es einfacher machen, Ihr Produkt auf verschiedene Bilder zu überlagern, wie in einer Montage oder auf Webseiten mit verschiedenen farbigen Hintergründen.

Allerdings wird Transparenz nicht von JPG unterstützt und Sie können bei der Wiedergabe von transparenten PNG-Dateien Probleme bekommen. Wenn eine Anwendung oder CMS Transparenz, aus welchen Gründen auch immer, nicht unterstützt, wird Ihr hübsches Bild im Handumdrehen hässlich.

Vertikale Ausrichtung: Finden Sie Ihr Mitte

Bilder können vertikal ausgerichtet werden, relativ nach ihrer Höhe von oben, unten oder der Mitte. Wir haben auch hier einen überragenden Gewinner: die zentrierte vertikale Ausrichtung.

Zentrierte vertikale Ausrichtung hatten 79% der untersuchten Produktbilder.

Pie chart showing most common product image vertical alignment choices: center, no change, bottom, top

Warum sollte ich meine Produktbilder vertikal zentrieren?

Es bietet die größte konsistente Darstellung.

Vertikal zentrierte Ausrichtung schafft klare Linien, wenn Sie Produkte haben, die in Größe und Form variieren, wie Schmuck, Möbel, Werkzeuge oder andere diverse Produkte.

Eine Ausrichtung am Boden ist wirksam, wenn Sie eine Kategorie-Seite mit einem Produkttyp haben, wie z. B. eine Seite vollständig aus ähnlich geformten Handtaschen zusammengestellt. Sie können sich die unterschiedlichen Ausrichtungen vorher anschauen, wenn Ihr Pixelz Bestell-Spezifikationen erstellen.

Ränder: Gleichheit für Alle

Wir erlauben es Kunden, Ränder zu setzen, in Pixel, Prozent oder gar nicht. Wir haben eine Auswahl, genau zwischen Pixel und Prozent aufgeteilt. Es ist eine ziemlich offensichtliche Tendenz, wenn Sie den exakten Pixeleinstellungen auf den Grund gehen.

Die meisten Produktbilder haben den gleichen Rand (innerhalb 1px) von oben, unten, links und rechts.

Pie chart comparing equal and unequal product image margins

Warum sind gleich Ränder so beliebt?

Sie liefern ausfallsicheren Abstand.

Es ist nicht abzusehen, wo Ihre Produktbilder enden und wie sie angezeigt werden. Sie könnten auf Ihrer Webseite angezeigt werden, auf einem Pinterest Bord, auf einem einflussreichen Blog oder von einer Suchmaschine oder gepuscht durch eine nachgeschaltete Händlerseite.

Nicht jeder wird technisch so versiert sein, wie Sie es wünschen. Wenn Sie ihren Bildern den gleichen Rand von oben, unten, links und rechts hinzufügen, können Sie ein komplettes Durcheinander verhindern; die Größe der Ränder zählt weniger als der Fakt, konsistent zu sein.

5 Jahre, 7 Millionen bearbeiteter Produktbilder und 1 Infografik um sie alle zu beherrschen!

Höhe und Breite: keine Einheitsgröße für Alle

Unsere Bildabmessungsdaten zu Überprüfen ist interessant, aber schwierig. Sie können eine exakte Pixelgröße setzen, Ihre ursprüngliche Größe halten, ein Seitenverhältnis bieten oder eine minimale und maximale Größe ansetzen. Das bedeutet, dass unsere Daten querbeet sind.

Es gibt eine große Vielfalt von verwendeten Methoden um Produktbildabmessungen einzustellen.

Pie chart showing how product image dimensions are set: exact pixels, keep original, aspect ration, min & max

Schauen wir uns die exakten Pixelgrößen-Auswahl näher an, die machen etwa 38% des Datensatzes aus:

Produktbilder variieren stark in Breiten und Höhen.

Produktbilder variieren stark in Breiten und Höhen.

Welche Dimensionen soll ich verwenden?

Es gibt keine objektive Antwort. Höhe und Breite sollte durch Ihr Produkt und Ihre Web-Strategie festgelegt werden.

E-Commerce-Plattformen und Sie haben unterschiedliche Bedürfnisse, wie Sie in diesem Spickzettel sehen. Sprechen Sie mit Ihrem Web-Entwickler um herauszufinden, was für Ihre Website optimal ist. Wenn Sie Zweifel haben, halten Sie Ihre ursprünglichen Bildabmessungen. Sie können jederzeit ein Bild verkleinern, aber es größer zu skalieren wird die Qualität beeinträchtigen.

Beliebte Add-On’s

Folgen Sie uns noch? Klasse, Sie müssen Produktbilder genauso lieben wie wir! Lassen Sie uns ins Detail gehen, über noch mehr Funktionen, die Sie mit Pixelz Add-On’s hinzufügen können, wie z.B. Schatten, DPI und Farbprofil.

Schatten: Halten Sie es natürlich

Nichts ist wie eine guter Schatten, der Ihrem Produktbild Tiefe gibt, nicht wahr? Die Eigentümer von 1,2 Millionen Produktbildern sind damit auch einverstanden.

Natürlicher Schatten ist der beliebteste Schatten für Produktbilder.

Pie chart showing shadow selections for 1.2 million product images: natural, drop, reflection, and cast

Halt, wie kann man einen natürlichen Schatten “hinzufügen”?

Wenn wir den Hintergrund entfernen, belassen wir den Schatten, um ihn dann so zu retuschieren, wie er gebraucht wird. Wir können ihn in Photoshop erstellen, wenn kein Originalschatten vorhanden ist, wie es im Fall von Fotografie mit professioneller Studiobeleuchtung sein wird.

Wenn Sie an etwas anderem als natürlichen Schatten interessiert sind – Schlagschatten und Reflexionsschatten können ihre Bildqualität wirksam steigern.

DPI: Die Druckqualität erhöht sich

Über 2,4 Millionen Produktbilder die wir bearbeitet haben, hatten DPI-Einstellungen. 300 und 72 DPI sind die häufigsten Einstellungen bei Produktbildern.

Pie chart showing most common DPI settings for product images, led by 300 DPI and 72 DPI

Spielt DPI für meine Bilder im Internet eine Rolle?

Nein, überhaupt nicht.

DPI (dots per inch) zählt, wenn gedruckt wird, wie z.B. für einen Katalog: Je höher die Zahl, desto schärfer ist das Detail beim drucken. Es beeinflusst nicht die Auflösung des digitalen Bildes; es ist einfach eine Zeichenfolge in der Kopfzeile, die mit der Druck-Software kommuniziert.

Jede Zahl auf der Y-Achse der Grafik hat mehr als 1000 Bilder verarbeitet, es ist klar, dass 300 DPI und 72 DPI mit Abstand die beliebtesten sind. 300 DPI ist eine hohe Qualität für den Druck. 72 DPI ist vermutlich aus dem Mythos von DPI hängen geblieben und dem Glauben, dass 72 DPI für das Netz gut ist. In Wirklichkeit hat DPI keine Auswirkungen auf Ihre Bilder im Netz.

Farbprofil : sRBG ist der Farbraum den man nutzt

Wir haben nicht immer Farbprofil-Optionen angeboten und die meisten Bildeigentümer wählen, ihr ursprüngliches Farbprofil zu halten. Unter den rund 620.000 Bildern, die ein Farbprofil festgelegt haben, gibt es vier zur Auswahl, die einen Vergleich wert sind: sRGB, Adobe RGB, RGB und CMYK.

Pie chart showing most common color profile of product images: sRGB, Adobe RG, RGB, and CMYK

Man, all diese Abkürzungen sehen gleich aus.

Wir wissen das, machen Sie sich deswegen also keine Sorgen. Verwenden Sie einfach sRGB.

Wieder einmal haben wir einen klaren Sieger der Stimmen, mit sRGB in allen Feldern vorn. Sie können eine Aufschlüsselung seiner Vorteile im Zen des sRGB Farbraum finden. Einfach ausgedrückt, das Web ist für den sRGB-Farbraum optimiert, sodass es der beste Weg ist, eine genaue Darstellung Ihrer Produkte zu gewährleisten.

Was wir gelernt haben

Optimieren, optimieren, optimieren. Auch wenn wir nicht unbedingt empfehlen würden alle gängigen Einstellungen für die eigenen Produktbilder zu kopieren, sollten Sie auf jeden Fall ihren Wert betrachten. Das Analysieren von sieben Millionen Bildern hat branchenübliche Praktiken deutlich gemacht.

Sie sollten Ihre Produkte wahrscheinlich vertikal zentriert ausrichten, Ihren Hintergrund weiß anlegen, unter Verwendung immer gleicher Ränder und als JPG-Bilder für das Web. Natürliche Schatten sind die beliebteste Art von Schatten, und sRGB ist das beste Farbprofil für das Web. Wenn Sie drucken, verwenden Sie 300 DPI.

All das sagt: Haben Sie keine Angst anders zu sein! Ihre Produktbilder sollten für Ihre Website optimiert sein. Im Web zu sein, bedeutet das viele E-Commerce-Besitzer den gleichen Herausforderungen gegenüberstehen, aber Produkte sind einzigartig und Ihre Bedürfnisse können von der Norm abweichen.

Interessieren Sie sich für zukünftige Produktbild Berichte? Was möchten Sie sehen?