E-Commerce-UX: Regeln nach Seitentyp

Kurz gesagt

Ein Onlineshop besteht aus Seitentypen, die aufeinander folgen. Der Käufer kommt über die Startseite oder die Suche, vergleicht in der Liste und entscheidet auf der Produktseite. Dann geht er in Warenkorb und Checkout, und zuletzt kommt er ins Konto zurück und fragt nach seiner Lieferung.

Deshalb schaue ich mir Onlineshops Seite für Seite an. Jeder Seitentyp hat seine eigene Frage, und die Regeln ändern sich mit dieser Frage. Was auf der Produktseite richtig ist, kann im Warenkorb falsch sein.

Dieser Ratgeber ist der Ausgangspunkt meiner Seiten zum E-Commerce. Die Einzelheiten zum Checkout stehen auf der Seite zum Checkout-Design, die Regeln für jedes Feld auf der Seite zum Formulardesign. Hier beschreibe ich die Grundregeln jedes Seitentyps und wo Sie anfangen.

Abbildung: Die Seitentypen, die ein Käufer nacheinander durchläuft. Jeder Schritt führt zu seinem Abschnitt unten.

Regelliste: nach Seitentyp filtern

Die Liste unten ist die Kurzfassung der Regeln in diesem Ratgeber. Wenn Sie Ihre eigene Website prüfen, wählen Sie einen Seitentyp und prüfen nur die Regeln dieser Seite.

Regeln filtern

Diese Liste enthält 21 Regeln.

• Sagen Sie auf dem ersten Screen, was Sie verkaufen.

  Startseite

  Warum?

  In der Studie von NN/g hatten Teilnehmende Mühe mit überladenen Startseiten, die nicht zeigten, was verkauft wird.

  Quelle: NN/g, Harley 2018

• Zeigen Sie die Kategorien im Hauptmenü, nicht versteckt hinter einem einzigen Link „Shop“.

  Startseite

  Warum?

  Laut Harley nimmt ein Nutzer, der ein Produkt nicht dort findet, wo er es erwartet, an, dass die Website es nicht verkauft.

  Quelle: NN/g, Harley 2018

• Die Suche ist ein Eingabefeld, kein Link.

  StartseiteSuche

  Warum?

  Nielsen schrieb, dass die Nutzung der Suche auf useit.com um 91 % stieg, als er den Suchlink auf der Startseite durch ein Feld ersetzte.

  Quelle: Nielsen 2001

• Jede Produktkarte zeigt Name, Foto, Preis und die weiteren Farben.

  Kategorie und Liste

  Warum?

  Laut Harley gehören diese vier Angaben mindestens auf jede Karte in der Liste.

  Quelle: NN/g, Harley 2018

• Im selben Filter lassen sich mehrere Werte wählen.

  Kategorie und Liste

  Warum?

  Teilnehmende, die Optionen nicht kombinieren konnten, nutzten Filter seltener. 14 % der Websites erlauben das nicht.

  Quelle: Baymard 2025

• Fassen Sie die angewendeten Filter über der Liste zusammen.

  Kategorie und Liste

  Warum?

  Baymard empfiehlt, angewendete Filter in einer Übersicht zu zeigen. 20 % der Websites zeigen diese Übersicht nicht.

  Quelle: Baymard 2025

• Bieten Sie Sortierung nach Preis, Bewertung, Bestseller und Neuheit an.

  Kategorie und Liste

  Warum?

  In Baymards Test wählte eine Teilnehmerin, die die Produkte nicht kannte, die Sortierung „Bestseller“. 69 % der Websites bieten nicht alle vier Sortierungen.

  Quelle: Baymard 2025

• Verstehen Sie Suchen mit Eigenschaften: „rote Jacke Größe 38“.

  Suche

  Warum?

  39 % der Websites haben Probleme mit Suchen, die Farbe, Größe oder Material enthalten. Die Eigenschaft als sichtbaren Filter anzuwenden, gibt dem Nutzer die Kontrolle.

  Quelle: Baymard 2026

• Beantworten Sie Suchen, die kein Produkt meinen: „Rücksendung“, „Versand“.

  Suche

  Warum?

  Nutzer erwarten, dass die Suche die ganze Website umfasst. 66 % der Websites listen bei solchen Suchen Produkte statt Hilfeinhalte.

  Quelle: Baymard 2026

• Die Seite „Keine Ergebnisse“ ist keine Sackgasse.

  Suche

  Warum?

  Etwa die Hälfte der Websites bietet nach einer Suche ohne Ergebnis keinen wirksamen Weg, weiterzumachen.

  Quelle: Baymard 2025

• Zeigen Sie die Größenauswahl als Buttons, nicht im Dropdown.

  ProduktseiteMobil

  Warum?

  Größen im Menü zu verstecken, macht es schwer zu erkennen, welche vorrätig ist. 57 % der Websites nutzen für Größen keine Buttons.

  Quelle: Baymard 2026

• Zeigen Sie die Verfügbarkeit sofort, wenn Farbe oder Größe gewählt wird.

  Produktseite

  Warum?

  Der Nutzer soll nicht erst nach dem Hinzufügen zum Warenkorb erfahren, dass das Produkt ausverkauft ist.

  Quelle: NN/g, Sherwin 2019

• Setzen Sie Versand- und Rückgabeinformationen neben den Kaufbereich.

  Produktseite

  Warum?

  60 % der Nutzer suchen die Rückgabeinformation auf der Produktseite. 44 % der Websites zeigen dort weder sie noch einen Link.

  Quelle: Baymard 2026

• Bestätigen Sie das Hinzufügen zum Warenkorb deutlich.

  Produktseite

  Warum?

  Bei zu schwachem Feedback dachten manche Nutzer, sie hätten das Produkt hinzugefügt, andere fügten es immer wieder hinzu. Eine kleine Zahl am Warenkorb-Icon wird oft übersehen.

  Quelle: NN/g, Sherwin 2019; Schade 2014

• Zeigen Sie den Gesamtbetrag samt Versand im Warenkorb.

  Warenkorb

  Warum?

  40 % der Abbrecher im Checkout nannten zu hohe Zusatzkosten als Grund, 12 % einen Gesamtbetrag, den sie nicht von Anfang an sahen.

  Quelle: Baymard 2025

• Lassen Sie den Rabattcode früh eingeben oder wenden Sie ihn automatisch an.

  Warenkorb

  Warum?

  Laut NN/g untergräbt es das Vertrauen, wenn ein Rabatt schwer einzulösen ist.

  Quelle: NN/g, Schade 2014

• Machen Sie den Gastkauf zur auffälligsten Option.

  Checkout

  Warum?

  18 % der Abbrecher im Checkout nannten als Grund, dass die Website ein Konto verlangte.

  Quelle: Baymard 2025

• Verstecken Sie Produkt- und Bestellangaben in der Bestellliste nicht in eingeklappten Bereichen.

  Konto

  Warum?

  Angaben in eingeklappten Bereichen zu verstecken, schnitt im Test so schlecht ab, wie sie gar nicht zu zeigen.

  Quelle: Baymard 2026

• Zeigen Sie die Sendungsverfolgung auf der eigenen Website.

  Konto

  Warum?

  Die Verfolgung einer fremden Website zu überlassen, deckt den Bedarf an Information und Navigation oft nicht. In Baymards quantitativer Studie war die Sendungsverfolgung die wichtigste Self-Service-Funktion.

  Quelle: Baymard, Collins 2026

• Testen Sie Hauptmenü und Suchvorschläge eigens auf dem Handy.

  Mobil

  Warum?

  In Baymards mobiler Bewertung waren Hauptmenü, Suchvorschläge und Formulare die schwächsten Bereiche.

  Quelle: Baymard, mobile Forschung

• Halten Sie Tippziele groß genug für den Finger.

  Mobil

  Warum?

  Das ist meine Beobachtung. Auf einem kleinen Screen heißt ein falscher Tipper, dass die falsche Größe oder das falsche Produkt im Warenkorb landet.

  Quelle: meine Beobachtung

Wählen Sie einen Seitentyp, dann zeigt die Liste nur die Regeln für diese Seite. Die Zeile „Warum?“ unter jeder Regel öffnet Begründung und Quelle. Manche Regeln erscheinen bei zwei Seitentypen. Die Prozentzahlen stammen aus Studien von Baymard.

Die Anteile von Websites in der Liste geben an, wie viele der großen Websites, die Baymard untersucht hat, die Regel nicht umsetzen. Die Prozente bei Warenkorb und Checkout sind dagegen Abbruchgründe, die Käufer genannt haben. Beides beschreibt nur die jeweilige Stichprobe, nicht den ganzen Markt.

Startseite: Orientierung geben

Die Aufgabe der Startseite ist Orientierung. Laut dem Leitfaden von Aurora Harley von NN/g aus dem Jahr 2018 erklärt die Startseite, was die Website verkauft und warum sie anders ist. Teilnehmende der Studie hatten Mühe mit überladenen Startseiten, die nicht zeigten, was verkauft wird.

Zeigen Sie die Kategorien deutlich im Hauptmenü. Harley rät, sie nicht hinter einem einzigen Link „Shop“ zu verstecken. Ein Nutzer, der ein Produkt nicht dort findet, wo er es erwartet, nimmt laut Harley an, dass die Website es nicht verkauft.

Derselbe Leitfaden empfiehlt, dass ein Produkt in mehreren Kategorien stehen kann. Eine Thermoskanne sollte zum Beispiel unter „Küche“ und unter „Camping“ zu finden sein. Das ist eine Entscheidung der Informationsarchitektur, die vor dem Menüdesign fällt.

Die Suche auf der Startseite darf kein Link bleiben, den man anklickt. Sie muss ein Feld sein, in das man tippt. Jakob Nielsen schrieb das 2001 und berichtete, dass die Nutzung der Suche auf seiner Website useit.com um 91 % stieg, als er den Link durch ein Feld ersetzte. Er empfahl außerdem, die Suche auf jede Seite zu setzen, weil man nicht weiß, wo sich ein Nutzer verirrt.

In Audits sehe ich oft dieses Bild: Rotierende Aktionsbilder füllen den ersten Screen, die Kategorien liegen weiter unten. Die Aktion mag wichtig sein. Wer zum ersten Mal kommt, will aber zuerst verstehen, was hier verkauft wird.

Kategorie- und Listenseite: vergleichen lassen

Die Listenseite ist der Ort zum Vergleichen. In Baymards Bewertung der Produktlisten 2025 erreichten 58 % der Desktop-Websites und 78 % der mobilen Websites eine Note zwischen „schlecht“ und „mittelmäßig“.

Die Produktkarte

Laut Harleys Leitfaden gehören auf jede Karte in der Liste mindestens vier Angaben: ein kurzer, aussagekräftiger Name, ein Foto, das groß genug zum Vergleichen ist, ein Hinweis auf weitere Farben und der Preis.

Baymard ergänzt zwei Dinge. Fassen Sie die Farben eines Produkts auf einer Karte zusammen statt auf getrennten Karten; 42 % der Websites tun das nicht. Zeigen Sie bei Produkten in unterschiedlichen Mengen den Grundpreis; 67 % der Websites zeigen ihn nicht.

Unterkategorien

NN/g empfiehlt, Unterkategorien in die Listenseite aufzunehmen und sie getrennt von den Filtern über der Liste zu zeigen. In der Studie zeigten die erfolgreichsten Seiten die Unterkategorien so, und sie wurden leichter gefunden. Wie die Zahl der Optionen die Entscheidungszeit beeinflusst, beschreibt das Hick’sche Gesetz.

Filter und Sortierung

Laut Baymard gehören fünf Filter auf jede Website, auf der sie anwendbar sind: Preis, Nutzerbewertung, Farbe, Größe und Marke. 51 % der Websites bieten nicht alle davon. Konnten Teilnehmende im selben Filter nicht mehrere Werte wählen, nutzten sie Filter viel seltener oder weniger wirksam.

Zeigen Sie die angewendeten Filter als Übersicht über der Liste. Bieten Sie bei der Sortierung vier Optionen: Preis, Nutzerbewertung, Bestseller und Neuheit. In Baymards Test wechselte eine Teilnehmerin, die sich mit Lautsprechern nicht auskannte, zur Sortierung „Bestseller“, weil sie nicht wusste, was sie wählen sollte.

Vorsicht bei horizontalen Filterleisten. Laut Baymard sind die Filteroptionen in diesen Leisten standardmäßig nicht sichtbar, und manche Teilnehmende übersahen den Button „Alle Filter“. Dieses Layout funktioniert nur mit einer begrenzten Zahl von Filtertypen.

Suche: die Sprache der Nutzer verstehen

Etwa die Hälfte der Käufer geht bei der Produktsuche zuerst ins Suchfeld. In Baymards Bewertung der Suche 2026 tat das grob die Hälfte der Teilnehmenden. In derselben Bewertung erfüllten 56 % der Websites den Suchbedarf der Nutzer nicht ausreichend.

Baymard teilt Suchen in acht Typen ein. In der Tabelle steht für jeden Typ ein deutsches Beispiel, das ich geschrieben habe, und der Anteil der Websites mit Problemen bei diesem Typ.

Suchtyp	Beispiel	Websites mit Problemen
Genauer Name oder Modellnummer	„KX-200 Staubsauger“	12 %
Produkttyp	„Jacke“	20 %
Eigenschaft	„rote Jacke Größe 38“	39 %
Verwendungszweck	„Geschenk zum Muttertag“	43 %
Abkürzung und Symbol	„TV“ und „Fernseher“	54 %
Kompatibilität	„Beutel für KX-200 Staubsauger“	44 %
Symptom	„Knieschmerzen“	37 %
Kein Produkt	„Rücksendung“, „Versandkosten“	66 %

Die größte Lücke liegt bei Suchen, die kein Produkt meinen. Wer „Rücksendung“ tippt, erwartet die Seite zur Rücksendung, die Website listet aber oft Produkte. Laut Baymard erwarten Nutzer, dass das Suchfeld nicht auf Produkte beschränkt ist, sondern die ganze Website umfasst.

Bei Suchen mit Eigenschaften empfiehlt Baymard, die Eigenschaft als sichtbaren Filter anzuwenden. Ist bei der Suche „rote Jacke“ der Filter „Farbe: rot“ sichtbar gesetzt, versteht der Nutzer, was passiert ist, und kann ihn bei Bedarf entfernen.

Im Deutschen kommen die Umlaute dazu. Nutzer tippen „grun“ oder „gruen“ statt „grün“, „Schlussel“ statt „Schlüssel“. Baymard empfiehlt, bei Suchen nach genauen Namen Tippfehler zu tolerieren. Umlaute gleich zu behandeln, ist meiner Erfahrung nach die deutsche Entsprechung dazu.

Wenn es keine Ergebnisse gibt

Laut Baymard bietet etwa die Hälfte der Websites nach einer Suche ohne Ergebnis keinen wirksamen Weg zum Weitermachen. Zu den empfohlenen Wegen gehören passende Kategorien, vereinfachte alternative Suchen und der Kontakt zum Support. Nur „Suchtipps“ zu schreiben, reicht nicht.

Eine Warnung von Nielsen aus dem Jahr 2001 hilft auch heute: Ist die Suche auf einen Bereich beschränkt, sollte der Standardumfang „ganze Website“ sein. Bringt die beschränkte Suche kein Ergebnis, sollte es einen deutlichen Weg geben, auf der ganzen Website zu suchen.

Produktseite: Fragen beantworten

Die Produktseite muss alle Fragen des Käufers beantworten. Der Leitfaden von Katie Sherwin von NN/g aus dem Jahr 2019 nennt das Unverzichtbare so:

• Ein beschreibender Name und gut erkennbare Fotos.
• Ein Bild, das sich vergrößern lässt.
• Ein Preis, der produktspezifische Gebühren enthält.
• Verständliche Optionen und die Verfügbarkeit.
• Ein Button zum Hinzufügen in den Warenkorb, der klares Feedback gibt.
• Eine kurze, informative Beschreibung.

In Baymards Bewertung der Produktseiten 2026 erreichten nur 48 % der Desktop-Websites eine Note „gut“ oder „ordentlich“. Mobil waren es 38 %. Häufige Lücken habe ich unten gesammelt.

Optionen und Verfügbarkeit

Zeigen Sie Größen als Buttons, nicht im Dropdown. 57 % der Websites nutzen für die Größenauswahl keine Buttons. Laut Baymard macht es ein Menü schwer zu erkennen, welche Größe vorrätig ist.

Laut Sherwin muss die Verfügbarkeit deutlich sichtbar sein, besonders wenn sie sich nach Farbe oder Größe ändert. Der Nutzer soll nicht erst nach dem Hinzufügen zum Warenkorb erfahren, dass das Produkt ausverkauft ist.

Bilder

In Baymards Tests versuchten 42 % der Nutzer, die Größe eines Produkts aus den Fotos abzulesen. Trotzdem bieten 37 % der Websites kein Foto, das das Produkt neben etwas mit bekannter Größe zeigt. Baymard empfiehlt, einen Menschen oder einen Gegenstand mit bekannter Größe neben das Produkt zu stellen, etwa einen Laptop neben einen Rucksack.

Versand, Rückgabe und Gesamtbetrag

In Sherwins Studie rechneten Teilnehmende beim Vergleich von Websites die Versandkosten in den Preis ein. Deshalb gehören Versandinformationen auf die Produktseite.

Auch die Rückgabe wird dort gesucht. Laut Baymard suchen 60 % der Nutzer die Rückgabeinformation auf der Produktseite, aber 44 % der Websites geben dort weder Information noch Link. 67 % der Websites zeigen neben dem Kaufbereich auch keine Schätzung des Gesamtbetrags.

Hinzufügen zum Warenkorb

Bestätigen Sie das Hinzufügen deutlich. In Sherwins Test dachten manche Nutzer wegen zu schwachem Feedback, sie hätten das Produkt hinzugefügt, andere fügten es immer wieder hinzu. Amy Schade von NN/g schrieb schon 2014, dass eine kleine Zahl am Warenkorb-Icon oft übersehen wird.

Bewertungen

Sherwin empfiehlt, positive und negative Bewertungen zu zeigen und eine Zusammenfassung anzubieten; viele Nutzer schauen zuerst auf die negativen. Laut Baymard antworten 89 % der Websites nicht auf negative Bewertungen. Eine ruhige Antwort auf eine Beschwerde sagt für mich mehr als der Sternedurchschnitt.

Warenkorb: den Gesamtbetrag zeigen

Die Aufgabe des Warenkorbs ist es, den Gesamtbetrag zu zeigen und dem Nutzer zu erlauben, seine Entscheidung bequem zu ändern. Die durchschnittliche Abbruchrate im Warenkorb, die Baymard aus 50 Studien ermittelt hat, liegt bei 70,22 %.

Ein Teil der Abbrüche hat nichts mit Design zu tun. Laut Baymard haben 42 % der Käufer in den USA den Warenkorb verlassen, weil sie sich nur umgesehen haben. Aber 40 % der Abbrecher im Checkout nannten zu hohe Zusatzkosten, 12 % einen Gesamtbetrag, den sie nicht von Anfang an sahen.

Diese beiden kann Design beheben: Zeigen Sie den Gesamtbetrag samt Versand im Warenkorb. Alle Gründe und die Schritte des Checkouts stehen als Tabelle auf der Seite zum Warenkorbabbruch, hier wiederhole ich sie nicht.

Haben Sie eine Grenze für kostenlosen Versand, schreiben Sie in den Warenkorb, wie viel noch fehlt. Der Satz „Noch 14 € bis zum kostenlosen Versand“ erspart dem Nutzer das Rechnen. Das ist mein Designvorschlag, kein Forschungsergebnis.

Beim Rabattcode empfiehlt Schade, einen angekündigten Rabatt automatisch anzuwenden, wenn der Nutzer Anspruch darauf hat. Braucht es einen Code, muss er sich lange vor dem Checkout leicht eingeben lassen. Einen Rabatt schwer einlösbar zu machen, untergräbt laut Schade das Vertrauen.

Menge ändern, Produkt entfernen und für später merken geht mit einem Tippen. Hat der Nutzer versehentlich ein Produkt entfernt, muss ein Rückgängig sichtbar sein. Laut Baymards Bewertung der Produktseiten sind die Merkfunktionen auf 89 % der Websites schwer zu erreichen oder zu nutzen.

Checkout: keine Überraschungen

Den Checkout beschreibe ich ausführlich auf einer eigenen Seite, deshalb halte ich mich hier kurz. Die Grundregel: Der Checkout enthält keine Überraschungen. Kontopflicht oder eine Gebühr im letzten Schritt sind Dinge, die der Nutzer nicht erwartet.

• Machen Sie den Gastkauf zur auffälligsten Option. Auf Baymards Liste nannten 18 % der Abbrecher die Kontopflicht als Grund. Das bekannteste Beispiel dafür ist die Geschichte vom 300-Millionen-Dollar-Button.
• Reduzieren Sie die Zahl der Felder und zeigen Sie Fehler am betroffenen Feld. Die Regeln für jedes Feld stehen auf der Seite zum Formulardesign.
• Die Fehlermeldung sagt dem Nutzer, was er tun soll. „Vorgang fehlgeschlagen“ reicht nicht.

Für Designtricks, die den Nutzer gegen Ende unter Druck setzen, lesen Sie den Ratgeber zu Dark Patterns.

Konto und Sendungsverfolgung: das Danach nicht vergessen

Der Verkauf endet nicht im Checkout. Ein paar Tage später geht der Nutzer in sein Konto und sucht seine Lieferung, die Rechnung oder die Rücksendung. In Baymards quantitativer Studie wählten 50 % der Teilnehmenden die Sendungsverfolgung als wichtigste Self-Service-Funktion.

Bestellliste und Verfolgung

Laut Baymards Forschung zu Konten, veröffentlicht im September 2026, gehören die grundlegenden Produkt- und Bestellangaben sichtbar in die Bestellliste. Sie in eingeklappten Bereichen zu verstecken, schnitt im Test so schlecht ab, wie sie gar nicht zu zeigen.

Für die Seite der Sendungsverfolgung empfiehlt Baymard sechs Angaben: voraussichtliches Lieferdatum, Statusleiste, Name des Versanddienstleisters, anklickbare Sendungsnummer, Sendungsverlauf und eine Übersicht der Produkte im Paket. Nur 33 % der untersuchten Websites geben alle sechs an, 25 % zeigen das Lieferdatum nicht zuverlässig.

Zeigen Sie die Verfolgung möglichst auf Ihrer eigenen Website. Laut Baymard decken Websites, die den Nutzer auf die Seite eines Dritten schicken, den Bedarf an Information und Navigation oft nicht. Diese Seiten verlinkten auch nicht direkt zum Bestelldetail.

Rückgabe und Anmeldung

Laut derselben Forschung hatten Teilnehmende oft Mühe zu erkennen, ob ein Produkt zurückgegeben werden kann. Den Button „Rücksendung starten“ nach Ablauf der Frist stillschweigend zu entfernen, verwirrte. Schreiben Sie statt dessen, dass die Frist abgelaufen ist und was der Nutzer tun kann.

In einem von Baymards Tests sahen Teilnehmende auf dem Anmeldescreen keinerlei Hinweis zu Passwortregeln. Sie konnten ihr eingegebenes Passwort auch nicht anzeigen lassen. 60 % der Teilnehmenden sahen eine freiwillige Zwei-Faktor-Authentifizierung positiv. Sicherheitsschritte dürfen Bezahlen und Kontoverwaltung aber nicht blockieren.

Mobil: jede Seite auf dem Handy neu denken

Mobil ist eine Ebene über allen Seitentypen. Laut Baymard macht Mobil bei vielen Onlineshops oft 50 % des Traffics aus. Auf manchen Websites macht die mobile Version aber weniger als halb so viele Besucher zu Kunden wie der Desktop.

In Baymards Bewertung von 138 großen mobilen Websites erreichte keine insgesamt die Note „gut“, 62 % waren „mittelmäßig“ oder schlechter. Die schwächsten Bereiche waren Hauptmenü, Suchvorschläge, Formulare und gemeinsame Elemente der ganzen Website.

Auf einem kleinen Screen sieht der Nutzer nicht die ganze Seite. Mit Baymards Worten sind selbst die besten mobilen Muster Kompromisse. Deshalb verkleinere ich das Desktopdesign nicht, sondern baue jeden Seitentyp auf dem Handy neu.

• Öffnen Sie Filter in einem Panel über den ganzen Screen und zeigen Sie die Zahl der angewendeten Filter auf dem Button.
• Setzen Sie den Button für den Warenkorb dorthin, wo der Daumen hinkommt. Zu Größe und Entfernung von Zielen lesen Sie das Fitts’sche Gesetz.
• Öffnen Sie in Formularen die passende Tastatur: Ziffernblock beim Telefonfeld, Tastatur mit @ bei der E-Mail.
• Bestellen Sie auf Ihrem eigenen Handy, über mobile Daten, wirklich etwas. Nach meiner Erfahrung zeigen sich hier am meisten Hänger, die am Desktop nicht auffallen.

Haben Sie auch eine App, lesen Sie für die Themen der App-Screens den Ratgeber zum App-Design.

Wo anfangen

Versuchen Sie nicht, alle Regeln auf einmal umzusetzen. Schauen Sie zuerst in der Analyse, bei welchem Seitentyp Sie die meisten Nutzer verlieren: Ist der Schritt von der Liste zum Produkt schwach, oder der vom Warenkorb zum Checkout?

1. Wählen Sie den Schritt mit dem größten Verlust. Öffnen Sie diesen Seitentyp im Regelfilter und prüfen Sie Regel für Regel.

2. Probieren Sie es selbst auf dem Handy. Suchen Sie ein echtes Produkt, filtern Sie, legen Sie es in den Warenkorb und bezahlen Sie. Notieren Sie jede Stelle, an der Sie hängen bleiben.

3. Bestätigen Sie es mit Nutzern. Ein Usability-Test mit wenigen Personen zeigt Hänger, die Sie selbst nicht sehen.

4. Messen Sie die Änderung. Reicht Ihr Traffic, vergleichen Sie zwei Versionen. Die Stichprobengröße berechnen Sie vorher mit dem A/B-Test-Rechner.

Wenn Sie das mit einem Blick von außen machen lassen wollen, ist ein Audit der richtige Anfang. Wie das abläuft, beschreibe ich im Ratgeber zum UX-Audit.

Meine Notiz

Das Problem, das ich in E-Commerce-Audits am häufigsten sehe: Das Team steckt viel Arbeit in die Startseite und wenig in die Listenseite. Über die Startseite wird in Meetings gesprochen, die Listenseite bleibt jahrelang gleich. Nach allem, was ich sehe, trifft der Käufer seine eigentliche Entscheidung aber in der Liste, zwischen Filter und Foto.

Auf Platz zwei kommen überraschende Kosten. Tauchen Versand, Zuschlag für eine Zahlungsart oder eine Servicegebühr erst im letzten Schritt auf, schaut der Nutzer mit Misstrauen auf die ganze Website. Dieses Problem löst weniger eine Designänderung als die Entscheidung, die Information früh zu nennen.

Und dann ist da die Kontoseite. Teams gestalten die Screens nach dem Kauf oft zuletzt und am schnellsten. Für mich beeinflusst die Antwort auf „Wo ist mein Paket?“ auch die nächste Bestellung.