8 Beispiele für inspirierende Produktdetailseiten (2023)

Es ist absolut wichtig, dass der Nutzer sich schnell und einfach in einem Onlineshop zurecht findet. Wird die kognitive Abfolge und Intention des Nutzers nicht beachtet oder der Aufwand durch ungewöhnliche Konzepte erhöht, kann dies nachhaltig der Konversionsrate schaden. Vor allem auf der Produktseite, ist es wichtig, dass der Nutzer alle nötigen Informationen und Argumente für das Produkt findet und den nächsten Schritt ausführen kann. Das ist allerdings kein Grund sich auf ein Seitentemplate zu versteifen, welches in identischer Form mehrfach von anderen Shops verwendet wird. Ganz im Gegenteil – gerade auf der Produktseite liegt so ein hohes Potenzial, dass man schlicht weg Geld verbrennt, wenn man hier nicht gezielt optimiert. Gerade in der heutigen Zeit muss für mutige Schritte kein aufwendiger Relaunch mehr hingelegt und dann gebangt werden, dass die Konversionsrate nicht in den Keller sackt. Man kann Ideen mit Testing-Tools umsetzen und erhält nach einigen Wochen eine klare Aussage, wie das neue Konzept performt.

Leider sieht die E-Commerce Realität noch anders aus und Onlineshops sind auf der Produktdetailseite auswechselbar und bieten keine Alleinstellung. Dem Nutzer wird keine Begründung geliefert, wieso er jetzt ausgerechnet in diesem Shop kaufen sollte.

Entfernt man die Markenlogos von bekannten Modeshops zeigt sich dem Nutzer ein ziemlich einheitliches Bild. (Ein ähnlicher Ansatz wurde hier bereits beschrieben) Wo würde der Nutzer nun einkaufen? Entscheidet also zum Schluss alleine Marke und Preis, wo das Produkt gekauft wird? Hier besteht großes Potenzial sich von seinem Mittbewerber abzugrenzen und eben nicht einfach nur auf Marke und Preis zu vertrauen.

Alleinstellungsmerkmale zeigen

Um sich von den Wettbewerbern abzuheben, ist es eine Möglichkeit sich optisch durch ein anderes Layout abzuheben. Aber man kann auch wesentlich gezielter noch auf seine Stärken und Ausrichtung eingehen und diese dem Kunden auf der Produktseite kommunizieren. Hierzu ist es natürlich wichtig zu wissen, über welches Argument man dem Kunden sein Angebot verkaufen möchte und kann. Hierzu drei Beispiele von Shops, die gezielt auf Ihre Expertise bei der Gestaltung der Produktseite eingehen und so dem Nutzer eine klare Alleinstellung bieten.

Service

„Wir haben den besten Service“ könnte ein Grund lauten, um bei einem Shop zu kaufen. Behaupten tun das natürlich viele Shops. Doch wie gut man das Thema Service auch über implizite Signale spielen kann, zeigt Zappos sehr gut. Zappos spielt diese Signale über den ganzen Shop hinweg aus und nicht nur gezielt auf der Produktseite, allerdings können gerade auf der Produktdetailseite solche Hinweise viel stärker wirken, als auf anderen Seiten, wo sich der Besucher noch in einem Stöber-Modus befindet und noch nicht bei der Entscheidung angelangt ist.

Zappos spielt über die komplette Seite verteilt viele Hinweise, die dem Nutzer deutlich machen, dass der Nutzer im Fokus steht und alles unternommen wird, um das Einkaufserlebnis des Nutzers zu verbessern. Viele der Signale werden bei Zappos über alle Seitentypen hinweg fest angezeigt. Aber vor allem auf der Produktseite können solche Signale die volle Wirkung entfalten, wenn der Nutzer nun zur Entscheidung kommt und nicht mehr in einem reinen Stöber-Modus sich befindet.

1. Im Kopfbereich kommuniziert eine komplette Leiste deutlich die Lieferung am nächsten Werktag.
2. Darunter befindet sich ein kompletter Hilfebereich mit der Beratungshotline, die 24/7 erreichbar ist, Link zu Hilfeseiten und einem Live-Chat.
3. Im eigentlichen Kopfbereich neben Logo und Suche ist ein fester Platz eingeplant, um deutlich den kostenlosen Versand und Rückversand zu kommunizieren.
4. Die Passform der Kleidungsstücke erhält bei Zappos einen wichtigen Stellenwert. Direkt unterhalb des Produktbildes werden Größenhinweise prominent angezeigt. Diese Hinweise können lästige Retouren für Käufer und Shop vorbeugen.
5. Am Ende der Seite wird dem Nutzer noch mal deutlich gezeigt, welche Maßnahmen Zappos trifft, damit der Nutzer sicher einkaufen kann. Zudem wird auch noch mal der kostenlose Versand und Rückversand ausführlicher mit weiterführendem Link erläutert.
6. Zu guter Letzt hat Zappos oberhalb des Footers noch eine Leiste integriert, die jeweils einen von zehn Zappos Family Core Value zeigt. Ein eventuell banal erscheinendes Element, das aber Zappos deutlich von anderen Mitbewerbern abhebt. Hier zeigt Zappos mit welcher Leidenschaft sie dem Thema Kundenservice innerhalb des Unternehmens nachgehen.

Logistik-Experte

In einigen Branchen kann die Logistik-Expertise ein wichtiger Konversionstreiber sein. Um 14 Uhr bestellt und morgen schon da, die Auswahl zwischen Hermes oder DHL, Lieferung an Packstation, Paketshop oder die eigene Filiale – es gibt verschiedene Möglichkeiten seine Versandexpertise zu zeigen und dem Nutzer so einen Grund zu geben direkt zu verkaufen. Amazon hat auf diesem Gebiet schon eine Expertise aufgebaut, aber auch bei anderen Anbietern merkt man, dass auf diesem Gebiet noch einiges an Potenzial vorhanden ist.

Cyberport zum Beispiel setzt auf eine stärkere Verknüpfung der Filialen mit dem Onlineshop und bietet dem Besucher eine Lieferung innerhalb von 3 Stunden in Städten mit einer Filiale. Aber auch Experimente von mytaxi und Saturn zeigen, dass das Thema Same Day Delivery in Deutschland vorangetrieben wird.

Qualität

Auch das Herausstellen der besonderen Qualität der verkauften Ware kann vor allem bei hochpreisigen Shops eine elementare Argumentation für den Kauf bieten. Die Qualität dient als logische Erklärung für einen höheren Preis.

Sommelier Privé bringt auf der Produktseite einige Elemente, die die Qualität des Weins dem Nutzer näher bringen.

1. Direkt unterhalb der CTA werden die Auszeichnungen des Weins gezeigt. Dies ist ein starkes Qualitätssignal bei einem Wein, da hier unabhängige Institute den Wein bewerten.
2. Unterhalb des Produktbildes spielt Sommelier Privé ein Alleinstellungsmerkmal. Die Weine des Shops werden von hochkarätigen Sommeliers kuratiert. Diesem Alleinstellungsmerkmal wird ein großer Bereich zugemessen, in dem der Sommelier über den Wein eine Aussage trifft und mit einem großen Foto gezeigt wird.
3. Nachdem der Wein ausführlich persönlich von dem Sommelier erläutert wird, wird auch noch das Weingut vorgestellt. Die Geschichte hinter den Weingütern schafft zusätzlich eine Nähe zum Produkt und zeigt dem Besucher auch wieder die sorgfältige Auswahl und hohe Qualität der Weine.

Stimulanz erhöhen

Betrachtet man sich Produktdetailseiten mit dem 7-Ebenen Modell, so werden zumindest häufig die meisten Bereiche einigermaßen gut abgedeckt.

Eine große Headline für den Produkttitel, Produktbild im sichtbaren Bereich und Beschreibung neben oder unter dem Produktbild sorgen schon mal für den Einstieg für eine ausreichende Relevanz.

Das Vertrauen wird durch einen professionellen Auftritt, positive Kundenmeinungen und Siegel gestärkt.

Die Orientierung ist gegeben, da das Layout gelernt ist. Rechts über die Buy-Box geht es weiter, weiter unten findet man passende Artikel oder ähnliche Artikel, falls der Artikel doch nicht zusagt. Wichtige Informationen zum Produkt sind gut aufzufinden.

Die Service-Hotline ist gut für den Nutzer sichtbar und es wird auf das kostenlose Rückgaberecht oder lange Garantiezeiten hingewiesen, um die Sicherheit zu stärken.

Die Seite lässt sich komfortabel bedienen. Die Seite lädt schnell (Ok zugegeben, hier gibt es auch noch einige Probleme. Mehr dazu hier…) und die Farb- und Größenauswahl lässt sich leicht bedienen und hakelt nicht.

Was in viele Fällen allerdings fehlt ist die Stimulanz. Im Hinblick darauf, dass die Produktseite das Produkt verkaufen muss, ist dies allerdings einer der kritischsten Punkte.

Vor allem im Modebereich, wo Online das Fühlen des Stoffes und das Anprobieren entfällt, müssen die anderen Sinne um so mehr angesprochen werden. Anne Rech, Einkäuferin bei Asos, sagt dazu ganz treffend, dass sie beim Einkauf schon darauf achten muss, dass das Kleidungsstück ein nettes Detail haben muss, was direkt sichtbar ist, weil im Internet stark über visuelle Reize verkauft wird.

20jeans.com

Der Shop 20jeans setzt das Produktbild gekonnt als Bühne über die komplette Seitenbreite hinweg in Szene. Dadurch steht das Produkt sehr gut im Fokus. Die Buy-Box hebt sich gut vom Hintergrund ab und räumt für alle Interaktionselemente viel Platz ein, so lässt sich der Shop auch auf dem Tablet gut bedienen.

Unterhalb der Produktbeschreibung wird noch ein Mal die komplette Seitenbreite für Detailshots eingeräumt und dazu passend 3 Key-Features des Produkts erläutert. Schaut man sich die Features näher an, so sind diese wahrscheinlich auch auf viele andere Jeans übertragbar. Durch die Inszenierung von 20jeans wirken sie allerdings unique und hochwertig.

Storq

Storq bietet Basic-Teile für schwangere Frauen an. Die Philosophie von Storq ist es, dass man mit wenigen Basic-Teilen kombiniert mit bestehenden Kleidungsstücken aus dem eigenen Kleiderschrank auch modisch durch die Schwangerschaft kommt ohne sich einen komplett neuen Kleiderschrank zulegen zu müssen. Dieses Alleinstellungsmerkmal wird auf der Bundle-Seite deutlich durch einen Bereich visuell gezeigt und in einem Video gezeigt, wie man die Basic-Teile beliebig kombinieren kann, ob mit Lederjacke, Jeansjacke oder Blazer – die Frau sieht immer modisch aus und ist für jeden Anlass perfekt gekleidet.

Nasty Gal

Das grundsätzliche Layout von Nasty Gal unterscheidet sich nur kaum von den in der Einleitung gezeigten Modeshops. Doch alleine die Anzeige von zwei großen Produktbildern nebeneinander wechselt die Gewichtung so stark, dass sich ein ganz anderer Eindruck ergibt. Zudem zeigt Nasty Gal im Bereich der minimalistischen Shops, dass man nicht vor Farbe zurückschrecken muss, sondern sich sehr schön von den schwarz/weiß Shops abheben kann ohne an Minimalismus und Hochwertigkeit zu verlieren.

📺 Brauchst du noch mehr Tipps? In unserem Growth Ambassador Programm tauschen wir uns regelmäßig mit unserer Community über erfolgreiches Webdesign aus. Speziell für dich haben wir ein Video über Personalisierung im Fashion E-Commerce, das dir zukünftig bei der Steigerung der Konversionsrate helfen wird. Bewirb dich, um deine Website zu einem Best Practice zu machen!

On Running

On Running bietet direkt einen sehr emotionalen Einstieg und setzt dabei auf einen Videoausschnitt. Nach dem Aufbau der Seite läuft der Schuh ein mal in Zeitlupe durch die Seite, bevor er dann auf der Bühne zum Stehen kommt. Zudem auch sehr schön, wie eine simple Subheadline die Funktion des Schuhs zusammenfassen kann: “Ich mache Asphalt weich.”

Direkt unter dem Produktvideo werden drei Key-Features des Schuhs noch mal mit Detailshots hervorgehoben. Diese drei Features stellen noch mal schön die Besonderheiten des Produkts in den Vordergrund und geben dem Nutzer eine Begründung an die Hand, warum er sich ausgerechnet für diesen Schuh entscheiden sollte.

Warby Parker

Bietet man in seinem Shop tolle Möglichkeiten das Produkt von allen Seiten zu entdecken, sollte dies dem Nutzer nicht zu schwierig gemacht werden. Warby Parker hat eine sehr simple Lösung entwickelt, um sich die Brille von allen Seiten ansehen zu können. Der Blick des Models folgt ganz einfach dem Mauszeiger. So kann man sich die Brille von allen Seiten ansehen ohne viel Klicken oder kompliziert mit der Maus hantieren zu müssen.

Fazit

Die Beispiele zeigen, dass man nicht zwangsläufig von gelernten Konventionen des Nutzers abweichen muss und trotzdem die Alleinstellungsmerkmale prominent und stimulant spielen kann. Sterben Sie nicht den Template-Tod, sondern experimentieren Sie mit wichtigen Alleinstellungsmerkmalen und inszenieren Sie Ihr Produkt stimulant auf der Produktdetailseite, um den Besucher von Ihrem Produkt zu überzeugen.
Zusammengefasst noch mal alle Optimierungsmöglichkeiten auf der Produktdetailseite:

• Alleinstellungsmerkmale des Shops kommunizieren
• Key-Features des Produkts deutlich aufzeigen
• Produkt stimulant in Szene setzen
• Einsatzmöglichkeiten des Produkts exemplarisch zeigen
• Durch individuelles Layout abheben vom Mittbewerber
• Videomaterial einsetzen, um Vorteile des Produkts zu verdeutlichen
• Funktionen zum Entdecken des Produkts dem Nutzer so einfach wie möglich zugänglich machen