Zurück zu Wissen

E-Commerce UX verbessern: Checkout, Mobile und Produktseiten richtig gestalten

Tom
Tom
13. März 2026 · 12 Min. Lesezeit

E-Commerce UX entscheidet darüber, ob ein Besucher kauft oder den Shop verlässt – nicht das Werbebudget. Die drei Bereiche mit dem größten Hebel sind Checkout, Produktseiten und Mobile. Wer dort konsequent aus Nutzerperspektive arbeitet, senkt die Abbruchrate messbar, ohne mehr Traffic kaufen zu müssen.

Das Wichtigste in Kürze

  • Laut Baymard Institute verlassen durchschnittlich 70,22 Prozent aller Käufer den Warenkorb, bevor sie bestellen – der häufigste Auslöser sind unerwartete Zusatzkosten.
  • Erzwungene Registrierung vor dem Kauf ist einer der am einfachsten behebbaren Abbruchgründe: Gastbestellung prominent anzubieten wirkt sofort.
  • Mobile Nutzer brechen häufiger ab als Desktop-Nutzer – mit zu vielen Schritten, kleinen Schaltflächen und langsamen Ladezeiten als Hauptursachen.
  • Produktseiten überzeugen durch konkrete Nutzenaussagen und das gezielte Ausräumen von Einwänden – nicht durch Featurelisten.
  • ActiveCampaign ergänzt die On-Site-UX durch Verhaltens-Automationen, die nach dem Besuch greifen: Warenkorb-Erinnerungen, Folgekommunikation und Review-Anfragen zum richtigen Zeitpunkt.

Der Checkout kostet mehr Conversions als schlechtes Marketing

Wenn ein Besucher den Warenkorb befüllt hat, ist die Kaufentscheidung im Prinzip gefallen – und trotzdem verlässt ein Großteil den Shop ohne Abschluss. Das Baymard Institute hat 50 unabhängige Studien zusammengeführt und kommt auf eine durchschnittliche Warenkorbabbruchrate von 70,22 Prozent (Stand August 2025). Anders gesagt: Von zehn Interessenten kaufen statistisch nur drei.

Die Daten zeigen auch, welche Auslöser am häufigsten dafür verantwortlich sind. Bei 40 Prozent der Abbrecher waren unerwartete Zusatzkosten der Grund – Versandkosten, Gebühren oder Steuern, die erst im letzten Schritt sichtbar wurden. Weitere 18 Prozent brachen ab, weil sie vor dem Kauf ein Konto anlegen mussten. Und 17 Prozent verließen den Shop wegen eines zu langen oder unübersichtlichen Kassenprozesses.

Diese Zahlen sind kein Schicksal. Baymard schätzt, dass ein durchschnittlicher großer Online-Shop allein durch Verbesserungen am Checkout-Design bis zu 35 Prozent mehr Conversions erzielen könnte. Die meisten dieser Maßnahmen erfordern keinen technischen Umbau, sondern Entscheidungen in der Informationsarchitektur – also wie, wann und wo du Informationen zeigst.

Was im Checkout sofort behebbar ist

Baymard hat festgestellt, dass 62 Prozent der Shops Gastbestellung zwar anbieten, aber nicht ausreichend sichtbar machen. Wer die Option nicht sofort sieht, verhält sich so, als gäbe es sie nicht. Das Problem löst du durch eine klare Rangordnung: Gastbestellung steht als erste und prominenteste Option, Kontoerstellung als optionaler zweiter Weg – nicht umgekehrt und nicht gleichwertig nebeneinander.

Ebenso wirksam: alle Kosten früh im Kaufprozess zeigen. Versandkosten gehören schon in den Warenkorb, nicht erst in den letzten Checkout-Schritt. Der durchschnittliche Checkout umfasst laut Baymard 23,48 Eingabefelder – das Ideal liegt bei 12 bis 14. Billing- und Shipping-Adresse sind für viele Kunden identisch; eine einfache Checkbox spart zwei Formularspalten. Fortschrittsanzeigen wie Schritt 2 von 3 senken Abbrüche aus gefühlter Länge, weil Nutzer den verbleibenden Aufwand realistisch einschätzen können.

DACH-spezifische Anforderungen im Checkout

Im deutschsprachigen Markt gibt es Erwartungen, die über allgemeine Best Practices hinausgehen. Kauf auf Rechnung ist in Deutschland, Österreich und der Schweiz für relevante Käufersegmente keine Zusatzoption, sondern eine Grunderwartung – wer ihn nicht anbietet, verliert Käufer, die grundsätzlich nicht per Kreditkarte kaufen. PayPal ist Standard, Klarna, SOFORT und Giropay haben signifikante Nutzergruppen.

Rechtliche Pflichtangaben gehören klar sichtbar in den Checkout, ohne den Kauffluss zu unterbrechen. Widerrufsrecht, Datenschutzhinweis und AGB-Zustimmung sind Pflicht – ihre Platzierung entscheidet darüber, ob sie den Abschluss verzögern oder neben ihm stattfinden. Ein Textlink am Ende des Bestellbuttons, der auf die Details verweist, genügt in vielen Fällen und stört den Kauffluss nicht. Ob die konkrete Umsetzung den Anforderungen des Fernabsatzrechts genügt, sollte juristisch geprüft werden; DSGVO und UWG setzen hier klare Rahmenbedingungen.

Produktseiten so gestalten, dass Einwände vor dem Kaufklick ausgeräumt sind

Die Produktseite ist der Ort, an dem Kaufentscheidungen fallen oder scheitern. Viele Shops listen dort Features auf – Material, Abmessungen, technische Spezifikationen – ohne zu erklären, was der Käufer davon hat. Das ist kein Kommunikationsproblem allein, sondern ein strukturelles: Wer seinen Shop von innen kennt, formuliert anders als jemand, der das Produkt zum ersten Mal sieht.

Der Unterschied zwischen Feature und Nutzen lässt sich an einem einfachen Beispiel zeigen. Die Formulierung aus wasserabweisendem Material ist ein Feature. Hält bei kurzem Regenschauer trocken – kein Schutz für nasse Tage, aber du musst nach dem Einkauf nicht nass nach Hause ist ein Nutzen mit ehrlicher Einschränkung. Letzteres räumt gleichzeitig eine Erwartung aus, die sonst zur Rücksendung führt. Diese Art von Formulierung senkt die Rücksendequote, weil Käufer wissen, was sie bekommen.

Einwände erkennen und direkt ansprechen

Jedes Produkt hat Kaufhürden, die sich wiederholen. Bei Kleidung sind es Passform und Farbtreue der Fotos. Bei Elektrogeräten sind es Kompatibilität und Lieferumfang. Bei Möbeln sind es Abmessungen und Montageaufwand. Diese Einwände tauchen in Retouren-Kommentaren, Support-Anfragen und Bewertungen auf – sie sollten direkt auf der Produktseite beantwortet werden, bevor der Käufer danach sucht.

Ein strukturierter FAQ-Bereich auf der Produktseite mit drei bis fünf häufigen Fragen senkt die Rücksendequote und die Support-Last gleichzeitig. Echte Kundenbewertungen tragen mehr zur Einwandsbehandlung bei als jeder redaktionelle Text, weil sie aus der Nutzerperspektive kommen. Shops, die ausschließlich Fünf-Sterne-Bewertungen zeigen, wirken weniger glaubwürdig als solche, die auch kritische Bewertungen und öffentliche Antworten darauf anzeigen. Die Antwort des Shops auf eine kritische Bewertung kann überzeugender sein als zehn unkritische Lobkommentare.

Visuelle Kommunikation, die Kontext schafft

Produktbilder vor weißem Hintergrund zeigen das Produkt, geben aber keinen Anhaltspunkt zu Größe, Einsatz oder Haptik. Kontext-Aufnahmen schließen diese Lücke: das Produkt in Benutzung, im Größenvergleich zu einem bekannten Objekt, aus mehreren Winkeln und in allen relevanten Farbvarianten. Bei Mode sind Aufnahmen an verschiedenen Körpertypen eine wirksame Maßnahme gegen Rücksendungen aus Passform-Enttäuschung.

Verfügbarkeit gehört auf die Produktseite, nicht erst in den Checkout. Nicht vorrätig als Überraschung im letzten Bestellschritt ist einer der kostspieligsten UX-Fehler, weil er Frustration im Moment der Kaufbereitschaft erzeugt. Zeige den Lagerstand frühzeitig – und biete bei ausverkauften Artikeln eine Benachrichtigungsoption an statt einer Enttäuschung. Wer sich für einen Benachrichtigungs-E-Mail-Verteiler einträgt, ist ein qualifizierter Wiederkehrer.

Mobile UX ist kein vereinfachtes Desktop – es ist ein anderes Nutzungsverhalten

Mobile Nutzer brechen häufiger ab als Desktop-Nutzer. Laut Baymard liegt die mobile Abbruchrate mit 80,02 Prozent deutlich über der Desktop-Rate von 66,41 Prozent. Ein Hauptgrund ist, dass viele Shops die Desktop-Ansicht auf kleinere Bildschirme skalieren, anstatt ein eigenes Nutzungsszenario zu gestalten. Mobile Einkaufen findet in kürzeren Sitzungen statt, mit Daumen statt Maus, oft in Unterbrechungssituationen.

Die technische Grundvoraussetzung ist Ladegeschwindigkeit. Wer auf mobilen Verbindungen zu lang wartet, verlässt die Seite, bevor ein UX-Konzept überhaupt zur Wirkung kommen kann. Jede unnötige Ressource – unkomprimierte Bilder, Third-Party-Scripts ohne verzögertes Laden, Tracking-Pixel ohne Lazy Load – verlängert die Zeit bis zum ersten sichtbaren Inhalt. Der erste sichtbare Inhalt sollte auf mobilen Verbindungen innerhalb von zwei bis drei Sekunden geladen sein; liegt die Zeit deutlich darüber, steigt die Absprungrate messbar.

Touch-Interaktion zuverlässig gestalten

Schaltflächen und Links müssen mit dem Daumen erreichbar und groß genug zum Tippen sein. Eine Mindestgröße von 44 mal 44 Pixel gilt als etablierter Richtwert in Accessibility-Richtlinien – darunter werden Tippfehler wahrscheinlich. Wichtige Aktionen wie Warenkorb, Suche und Kaufen-Button sollten im unteren Bildschirmbereich erreichbar sein, weil der Daumen dort ohne Umgreifen ankommt. Navigation und Hilfe gehören nach oben, Hauptaktionen nach unten.

Formulareingaben im Checkout erfordern auf Mobile besondere Sorgfalt. Der richtige Tastaturtyp für Eingabefelder verhindert Tipp-Aufwand: nummerische Tastatur für Postleitzahl und Telefonnummer, E-Mail-Tastatur für das Adressfeld. Autofill-Attribute beschleunigen das Ausfüllen messbar. Wer Adresse und Zahlungsdaten mit wenigen Taps aus dem Passwort-Manager übernehmen kann, bricht seltener ab als jemand, der dreißig Zeichen auf einer mobilen Tastatur eintippt.

Mobile Checkout mit Express-Zahlungsmethoden verkürzen

Apple Pay, Google Pay und PayPal Express reduzieren den mobilen Checkout auf zwei bis drei Taps. Wer diese Optionen prominent über dem regulären Checkout-Formular platziert, gibt mobilen Nutzern einen direkten Weg zum Abschluss. Das ist besonders relevant für Impulskäufe und Erstkäufer, die noch keine Zahlungsdaten dauerhaft gespeichert haben. Die Integration ist für die meisten Shop-Systeme ein Konfigurationsschritt, kein Entwicklungsprojekt.

So richtest du E-Commerce-Personalisierung mit ActiveCampaign ein

Personalisierte Kommunikation setzt voraus, dass der Shop weiß, was ein Besucher getan hat. ActiveCampaign stellt dafür Site Tracking und Event Tracking bereit, die zusammen ein Verhaltensprofil aufbauen, auf dessen Basis du Automationen und E-Mail-Inhalte differenzierst. Das ist kein Feature für fortgeschrittene Setups – es ist ein Grundbaustein, der früh angelegt werden sollte, weil er retrospektiv keine Daten liefert.

Der Vorteil liegt nicht nur in personalisierten Mails. Segmente, die auf Shop-Verhalten basieren, erlauben Kommunikation im richtigen Moment: nach einem Warenkorb-Abbruch, nach dem ersten Kauf, nach wiederholtem Besuch einer Kategorie ohne Kaufabschluss. Diese Zeitpunkte haben eine höhere Kaufwahrscheinlichkeit als zeitbasierte Newsletter-Versendungen, weil das Verhalten selbst das Signal ist.

  1. Site Tracking aktivieren: Einstellungen → Tracking → Site Tracking → Tracking-Code generieren und in den Shop-Header einbinden. Ab diesem Punkt werden Seitenbesuche von bekannten Kontakten in deren Kontaktprofil gespeichert.
  2. Events für Kaufsignale definieren: Automationen → Ereignisse verwalten → Neues Ereignis anlegen für die Aktionen Produkt angesehen, In Warenkorb gelegt und Bestellung abgeschlossen. Diese Events löst der Shop per API aus, wenn ein bekannter Kontakt die entsprechende Aktion ausführt.
  3. Segmente auf Basis von Verhalten aufbauen: Kontakte → Segmente → Bedingungen aus dem Bereich Seitenbesuche und Ereignisse kombinieren. Ein Segment wie Kategorie X zweimal besucht, aber noch nicht gekauft ist ein präzises Remarketing-Ziel.
  4. Warenkorb-Abbruch-Automation einrichten: Automationen → Erstellen → Trigger In Warenkorb gelegt → Wartezeit 2 Stunden → Bedingung Bestellung abgeschlossen prüfen → bei Nein: E-Mail mit den abgebrochenen Produkten senden. Direkte Links auf die jeweiligen Produktseiten erhöhen die Rückkehrrate.
  5. Folgekommunikation nach dem ersten Kauf aufbauen: Ein zweiter Kauf entsteht ohne erneute Akquisitionskosten. Eine automatische Follow-up-Sequenz mit Produktempfehlungen aus der gekauften Kategorie – ausgelöst nach dem definierten Lieferintervall – ist ein dauerhaft laufendes Setup mit einmaligem Aufwand.
  6. Review-Anfragen automatisieren: ActiveCampaign versendet die Bewertungsanfrage zum richtigen Zeitpunkt nach dem Kauf, nicht sofort nach der Bestellbestätigung. Das Ergebnis ist ein wachsender Bewertungspool ohne manuellen Aufwand.

Wer das Setup für Warenkorb-Abbrecher ausarbeiten will und dabei saisonale Peaks berücksichtigen möchte, findet in unserem Artikel zu Warenkorb-Abbrecher-Automationen für Black Friday mit ActiveCampaign ein konkretes Beispiel mit Timing-Empfehlungen.

Typische UX-Fehler und wie du sie erkennst, bevor sie Umsatz kosten

Die häufigsten UX-Probleme in deutschen Online-Shops sind selten dramatisch sichtbar – sie zeigen sich in Kennzahlen. Eine hohe Absprungrate auf der Produktseite deutet auf Informationslücken oder fehlende Vertrauenssignale hin. Ein Abbruch im zweiten Checkout-Schritt deutet auf unerwartete Kosten oder eine Registrierungspflicht hin. Ein niedriger Anteil mobiler Conversions bei hohem mobilem Traffic deutet auf Touch-UX-Probleme hin. Die Diagnose geht der Maßnahme voraus.

Abbruchpunkte im Trichter lokalisieren

Setze Zielvorhaben für jeden Checkout-Schritt in deinem Analyse-Werkzeug und miss, wo die Absprünge am stärksten einbrechen. Wenn ein Großteil der Checkout-Abbrüche im Schritt Zahlungsmethode wählen passiert, ist das ein anderes Problem als wenn die Abbrüche schon beim Aufrufen des Warenkorbs entstehen. Ergänze Trichterdaten durch Session-Recordings oder Heatmaps auf den kritischen Seiten – Produktseite, Warenkorb, Checkout-Schritt eins bis drei. Wo Nutzer auf nicht klickbare Elemente tippen oder Formulare mitten beim Ausfüllen verlassen, zeigen sich die Prioritäten.

Häufige Fehler mit konkreten Gegenmitteln

  • Keine kombinierbaren Filter auf Produktlisten: Wer auf einer Kategorieseite mit vielen Produkten nicht gleichzeitig nach Größe, Farbe und Preis filtern kann, verlässt die Seite. Facettierte Navigation mit kombinierbaren Filtern löst dieses Problem; das System muss Tippfehler tolerieren und im DACH-Kontext Synonyme kennen – Turnschuhe und Sneaker meinen dasselbe.
  • Verfügbarkeit erst im Checkout sichtbar: Nicht vorrätig als Überraschung im letzten Bestellschritt erzeugt Frustration im Moment der Kaufbereitschaft. Lagerstatus gehört auf die Produktseite, und bei Ausverkauf sollte eine Benachrichtigungsoption angeboten werden.
  • Rückgaberecht nur im Kleingedruckten: In Deutschland ist die Erwartung an ein unkompliziertes Rückgaberecht hoch. Eine kurze, klare Aussage auf jeder Produktseite – 30 Tage Rückgabe, ohne Aufwand – senkt die Kaufhemmung ohne rechtliche Risiken, sofern die Bedingungen eingehalten werden.
  • Bewertungssystem mit zu wenig Inhalt: Ein Produkt ohne Bewertungen erzeugt Unsicherheit, besonders bei Erstkäufern. Eine automatisierte Review-Anfrage nach dem Lieferintervall – eingerichtet in ActiveCampaign – baut den Bewertungspool ohne manuellen Aufwand auf.
  • Keine Fortschrittsanzeige im Checkout: Wer nicht weiß, wie viele Schritte noch folgen, überschätzt den Aufwand und bricht eher ab. Eine einfache Schrittanzeige kostet nichts in der Umsetzung und reduziert Abbrüche aus gefühlter Länge.

Wann UX-Optimierung nicht die richtige Antwort ist

UX-Maßnahmen helfen nicht, wenn das Grundangebot nicht passt. Ein Shop, der preislich nicht wettbewerbsfähig ist oder dessen Lieferzeiten deutlich hinter dem Markt liegen, wird auch mit optimiertem Checkout kaum aufholen. UX-Optimierung ist ein Hebel für Shops, die bereits ein funktionierendes Angebot haben und ihren vorhandenen Traffic effizienter nutzen wollen – nicht für Shops, die an Produkt, Positionierung oder Logistik arbeiten müssen. Die Unterscheidung spart Zeit und Geld.

Häufige Fragen

Was ist die häufigste Ursache für Warenkorbabbrüche in deutschen Online-Shops?

Laut Baymard Institute sind unerwartete Zusatzkosten der häufigste Auslöser – bei 40 Prozent der Abbrecher waren Versand- oder sonstige Kosten der Grund, die erst spät im Prozess sichtbar wurden. Der zweit- und dritthäufigste Grund sind erzwungene Kontoerstellung und zu langer Checkout. Alle drei sind durch Entscheidungen in der Informationsarchitektur behebbar, nicht durch technischen Umbau.

Wie erkenne ich, wo in meinem Shop die größten UX-Probleme liegen?

Der effizienteste Einstieg ist ein Conversion-Trichter in deinem Analyse-Werkzeug. Setze Zielvorhaben für jeden Checkout-Schritt und miss, wo die Absprünge am stärksten einbrechen. Ergänze das durch Session-Recordings oder Heatmaps auf Produktseite und Checkout – wo Nutzer auf nicht klickbare Elemente tippen oder Formulare mitten beim Ausfüllen verlassen, liegen die Prioritäten. Die Diagnose geht der Maßnahme immer voraus.

Ab welchem Warenkorbwert lohnt sich eine Checkout-Optimierung?

Checkout-Optimierung lohnt sich unabhängig vom Warenkorbwert, weil die Maßnahmen einmalig umgesetzt werden und dauerhaft wirken. Shops mit kleinen Warenkorbwerten profitieren besonders stark von Gastbestellung und Express-Zahlungsmethoden, weil Registrierungsaufwand bei niedrigem Kaufwert besonders abschreckend wirkt. Shops mit hohen Warenkorbwerten profitieren stärker von detaillierter Vertrauenskommunikation und klaren Rückgabebedingungen.

Wie bindet ActiveCampaign in eine E-Commerce-UX-Strategie ein?

ActiveCampaign ergänzt die On-Site-UX durch Kommunikation, die nach dem Besuch greift. Was der Shop nicht mehr zeigen kann, weil der Nutzer weg ist, erreicht ihn per E-Mail: Warenkorb-Erinnerungen, personalisierte Empfehlungen nach dem Kauf, Review-Anfragen zum richtigen Zeitpunkt. Das setzt voraus, dass Site Tracking und Event Tracking eingerichtet sind und die Automationen auf reale Verhaltenssignale reagieren, nicht auf Zeitintervalle allein.

Muss ich für E-Commerce-UX-Optimierung einen Designer beauftragen?

Viele der wirkungsstärksten Maßnahmen sind inhaltlicher, nicht gestalterischer Natur: Produktbeschreibungen schärfen, Einwände auf der Produktseite ansprechen, Kosten transparent zeigen, Rückgabebedingungen kommunizieren. Das erfordert Produktkenntnis und gutes Schreiben, aber keinen Designer. Gestalterische Eingriffe – Button-Hierarchien, Formularoptimierung, Fortschrittsanzeigen – können je nach Shop-System ohne externe Hilfe umgesetzt werden.

Wie lange dauert es, bis UX-Maßnahmen messbar wirken?

Checkout-Änderungen wie Gastbestellung oder transparente Versandkosten wirken sofort, sobald ausreichend Traffic durch den neuen Checkout läuft. Produktseitenoptimierungen brauchen mehr Zeit, weil die Wirkung auf Rücksendequote und Bewertungen sich über Wochen aufbaut. Automationen wie Warenkorb-Erinnerungen zeigen ihre Wirkung nach den ersten abgeschlossenen Durchläufen – das ist bei gutem Traffic innerhalb weniger Tage messbar.

Wer die UX seines Online-Shops systematisch mit ActiveCampaign-Automationen verknüpfen und dabei auf erfahrene Unterstützung zurückgreifen möchte, findet bei Advertal als ActiveCampaign-Agentur Unterstützung für Setup, Strategie und laufende Optimierung im DACH-Markt.

Tom Wenk, Gründer der Advertal GmbH

Kostenloses Erstgespräch

Du weißt jetzt, wie es geht. Sollen wir dir bei der Umsetzung helfen?

Zwanzig Minuten, ohne Verkaufsgespräch: Wir schauen gemeinsam auf dein Marketing – was schon trägt, was liegen geblieben ist und was sich automatisieren lässt. Du hast danach drei konkrete nächste Schritte. Ob du ActiveCampaign schon nutzt oder noch nach dem passenden Werkzeug suchst: Wir richten es so ein, dass es zu deinem Unternehmen passt – und zeigen deinem Team, wie es damit weiterarbeitet.

Jetzt kennenlernen

Kostenlos und unverbindlich · Offizieller ActiveCampaign-Partner · über 200 Unternehmen im Advertal Partner-Netzwerk