Checkout optimieren: Schritte, Felder, Zahlarten, Gastkauf

Der Checkout ist die Stelle, an der ein Besucher schon kaufen will und du ihn trotzdem noch verlieren kannst. Wo genau er abspringt, findest du mit dem Trichter heraus – das steht im Artikel zu den Warenkorbabbrüchen und ihren Ursachen. Dieser Artikel setzt danach an: Wie optimierst du den Checkout so, dass Schritte, Felder, Zahlungsarten und Gastbestellung so wenig Widerstand wie möglich erzeugen? Du bekommst eine Anleitung von Schritt zu Schritt und eine Prüfliste für den Test am eigenen Handy.

Was ein guter Checkout leisten muss

Drei Dinge, in dieser Reihenfolge:

1. Er verlangt nur, was für Lieferung und Bezahlung nötig ist.
2. Er zeigt zu jedem Zeitpunkt, was die Bestellung kostet und wann sie ankommt.
3. Er lässt sich mit einem Daumen auf einem mittelgroßen Handy in wenigen Minuten abschließen.

Alles andere – Design, Siegel, Zusatzverkäufe – ist zweitrangig. Wenn einer der drei Punkte nicht erfüllt ist, hilft der Rest nicht.

Der Ablauf: ein Schritt oder mehrere?

Beide Varianten funktionieren, wenn sie sauber umgesetzt sind. Der einseitige Checkout spart Seitenwechsel, wird auf dem Handy aber schnell zu einer langen Rolle. Der mehrstufige Checkout ordnet Kontakt, Versand und Zahlung in verdauliche Portionen und zeigt Fortschritt.

Bei den meisten Shopsystemen ist der Ablauf vorgegeben; Shopify etwa führt durch Kontakt, Versand und Zahlung. Wichtiger als die Anzahl der Schritte ist, dass jeder Schritt sauber funktioniert:

• Fortschrittsanzeige oben: Der Besucher sieht, wie viel noch kommt.
• Die Zusammenfassung des Warenkorbs ist auf jedem Schritt erreichbar, ohne den Checkout zu verlassen.
• Die Zurück-Navigation behält alle Eingaben.
• Express-Zahlarten (Apple Pay, Google Pay, PayPal, Shop Pay) stehen ganz oben, bevor das erste Formular beginnt. Wer sie nutzt, erledigt Adresse und Zahlung in einem Zug.

Schritt 1: Kontakt und Kundenkonto

Der erste Schritt fragt nach der E-Mail-Adresse. Sonst nichts. Kein Passwort, keine Registrierung.

Gastbestellung ist Pflicht. Ein erzwungenes Kundenkonto ist die häufigste selbst gebaute Hürde. Wer zum ersten Mal bei dir kauft, kennt dich nicht und will kein Passwort verwalten. Biete das Konto nach dem Kauf an, auf der Bestätigungsseite: „Passwort setzen, um die Bestellung zu verfolgen“. Dort ist die Hemmschwelle gering, weil die Daten schon eingegeben sind.

Zwei Details, die oft übersehen werden:

• Bestandskunden brauchen einen sichtbaren Login-Link, damit sie ihre gespeicherte Adresse nutzen können – als Angebot, nicht als Schranke.
• Die Newsletter-Einwilligung gehört als eigene, nicht vorangekreuzte Option hierher, wenn du sie überhaupt im Checkout abfragst. Wie du sie rechtssicher gestaltest, klärst du mit deinem Datenschutzbeauftragten oder Anwalt.

In Shopify legst du fest, ob Kunden sich anmelden müssen oder als Gast bestellen können, und ob als Kontakt E-Mail oder Telefonnummer abgefragt wird. Die Optionen sind in den Checkout-Einstellungen der Shopify-Hilfe beschrieben.

Schritt 2: Adresse und Felder

Jedes Feld kostet Zeit und erzeugt Fehler. Geh dein Adressformular einmal Feld für Feld durch und stell die Frage: Braucht der Paketdienst das wirklich?

Technisch zählt, wie sich die Felder verhalten. Die offiziellen Empfehlungen dazu stehen bei web.dev unter Best Practices für Zahlungs- und Adressformulare. Die wichtigsten Punkte:

• Autofill zulassen. Jedes Feld hat ein passendes autocomplete-Attribut, damit Browser und Handy die gespeicherte Adresse einsetzen. Das spart die meisten Tippfehler.
• Passende Tastatur. Für PLZ, Hausnummer und Telefonnummer öffnet sich auf dem Handy die Zifferntastatur (inputmode="numeric"), für die E-Mail die Tastatur mit @-Zeichen.
• Fehler am Feld, sofort. Eine falsche PLZ wird beim Verlassen des Feldes markiert, nicht erst nach dem Klick auf „Weiter“ als Liste oben auf der Seite.
• Eingaben bleiben erhalten. Nach einem Fehler oder einem Zurück ist nichts gelöscht.
• Beschriftungen bleiben sichtbar. Ein Platzhalter, der beim Tippen verschwindet, ist keine Beschriftung. Wer unterbrochen wird, weiß sonst nicht mehr, was in das Feld gehört.
• Adressvorschläge, wenn dein System oder eine App sie bietet, verkürzen die Eingabe auf dem Handy erheblich.

Bei einem gehosteten Checkout wie bei Shopify ist das meiste davon bereits umgesetzt. Bei einem selbst gebauten oder stark angepassten Checkout ist es der erste Prüfpunkt.

Schritt 3: Versand

Der Versandschritt entscheidet oft über den Abbruch, weil hier zum ersten Mal der Endpreis steht. Wenn die Versandkosten hier überraschen, war der Fehler schon auf der Produktseite; wie du sie früh und klar zeigst, steht im Artikel zu Versandkosten und Lieferzeit.

Im Checkout selbst:

• Lieferzeit als Zeitraum in Werktagen oder als voraussichtliches Datum, nicht „schnell“ oder „in Kürze“.
• Die günstigste oder am häufigsten gewählte Option ist vorausgewählt.
• Zwei bis drei Optionen reichen: Standard, Express, eventuell Abholung oder Packstation. Zehn Optionen sind eine Entscheidung, die niemand treffen will.
• Kostenloser Versand ab Schwelle: den Restbetrag anzeigen, aber nicht als aggressiven Hinweis, der den Besucher aus dem Checkout zurückschickt.

Schritt 4: Zahlung

Fehlende Zahlungsarten führen zum stillen Abbruch: Der Besucher sucht seine gewohnte Zahlart, findet sie nicht und geht. Welche Zahlarten du für Zielgruppe und Land brauchst, behandelt der Artikel Zahlungsarten im Online-Shop. Für die Gestaltung des Schritts gilt:

• Die meistgenutzte Zahlart steht oben und ist vorausgewählt.
• Logos statt reiner Textliste; die Auswahl ist auf dem Handy mit dem Daumen treffbar.
• Kartenfelder folgen den web.dev-Empfehlungen: ein Feld für die Kartennummer, Zifferntastatur, Kartentyp wird erkannt.
• Bei Weiterleitung zu einem Anbieter (PayPal, Klarna, Bank) steht vorher ein Satz, was passiert: „Du wirst zu PayPal weitergeleitet und kommst danach zurück.“
• Wird eine Zahlung abgelehnt, sagt die Fehlermeldung, was zu tun ist: andere Karte, andere Zahlart. „Fehler 402“ ist keine Fehlermeldung.

Schritt 5: Prüfen und bestellen

Die letzte Seite zeigt alles noch einmal: Artikel mit Bild, Menge, Einzelpreis, Versandkosten, Steuern, Gesamtsumme, Lieferadresse, Zahlart, Lieferzeit. Jede Zeile lässt sich mit einem Klick ändern, ohne von vorn zu beginnen.

Hier darf keine neue Zahl auftauchen. Wenn hier zum ersten Mal ein Zuschlag, eine Gebühr für die Zahlart oder ein Mindermengenaufschlag erscheint, verlierst du den Besucher auf der letzten Stufe – das ist der teuerste Abbruch von allen.

Die Beschriftung des Bestellbuttons ist in Deutschland gesetzlich geregelt und muss die Zahlungspflicht eindeutig ausdrücken. Welcher Wortlaut für deinen Shop passt, klärst du mit deinem Anwalt; dein Shopsystem liefert in der Regel eine gültige Voreinstellung.

Was im Checkout nichts zu suchen hat

• Die normale Navigation. Hauptmenü, Suchfeld und Footer-Links führen weg. Ein reduzierter Kopf mit Logo und Kontaktweg reicht.
• Zusatzverkäufe. Zubehör gehört auf die Produktseite oder in den Warenkorb, nicht zwischen Adresse und Zahlung.
• Pop-ups. Newsletter-Layer, Rabatt-Räder oder Chat-Aufforderungen, die sich öffnen, während jemand seine Kartennummer eintippt.
• Ein dominantes Gutscheinfeld. Es lädt dazu ein, den Checkout zu verlassen und nach Codes zu suchen. Vorhanden ja, aber eingeklappt.
• Eine Pflicht-Telefonnummer ohne Grund.
• Eine Registrierung vor dem Kauf.

Vertrauen: was wirklich wirkt

Siegel sind nicht falsch, aber sie beantworten keine Fragen. Im Checkout will der Besucher wissen, wer liefert, wann die Ware kommt und was passiert, wenn sie nicht passt. Also:

• Kontaktweg im Kopf des Checkouts: Telefonnummer oder E-Mail, nicht nur ein Kontaktformular.
• Ein Satz zur Rückgabe neben dem Bestellbutton: Frist und Ablauf, ohne Kleingedrucktes.
• Lieferzeit noch einmal in der Zusammenfassung.
• Eine sichere Verbindung ohne Browser-Warnung – heute Standard, muss aber gerade bei eingebetteten Zahlungsformularen sauber funktionieren.

Shopify und Lightspeed: was du selbst ändern kannst

Shopify: Der Checkout ist gehostet, der Ablauf fest. In den Checkout-Einstellungen steuerst du, ob Kundenkonten optional oder nötig sind, welche Formularfelder (Firma, Adresszeile 2, Telefonnummer) Pflicht, optional oder ausgeblendet sind, ob Trinkgeld angeboten wird und wie die Marketing-Einwilligung abgefragt wird. Farben, Schrift und Logo passt du im Checkout-Editor an. Express-Zahlarten hängen an den aktivierten Zahlungsanbietern. Tiefere Eingriffe in Ablauf und Felder sind Shopify Plus vorbehalten; was ohne Plus geht, zeigt der Artikel Shopify Checkout anpassen.

Lightspeed eCom (C-Series): Kundenkonto, Zahlungsanbieter und Versandmethoden konfigurierst du im Backoffice. Welche Felder sich abschalten lassen und wie der Checkout auf dem Handy aussieht, hängt stark vom Theme ab. Teste den Checkout nach jedem Theme-Update erneut.

Prüfliste: der Selbsttest am Handy

Mach den Test im privaten Fenster, mit einem echten Produkt, auf einem mittelgroßen Handy über Mobilfunk. Ein Test am Desktop im Büro sagt dir wenig.

• Express-Zahlarten erscheinen vor dem ersten Formular
• Gastbestellung ist möglich und ohne Suchen erkennbar
• Nur E-Mail im ersten Schritt, kein Passwort
• Autofill füllt Name und Adresse korrekt aus
• Bei PLZ und Telefon öffnet sich die Zifferntastatur
• Fehler erscheinen am Feld, Eingaben bleiben erhalten
• Lieferzeit steht in Werktagen oder als Datum
• Versandoption vorausgewählt, höchstens drei Optionen
• Gewohnte Zahlarten der Zielgruppe vorhanden, häufigste oben
• Ablehnung einer Zahlung erzeugt eine verständliche Meldung
• Zusammenfassung ohne neue Kosten
• Jede Angabe aus der Zusammenfassung heraus änderbar
• Kontaktweg sichtbar
• Keine Navigation, keine Pop-ups, keine Zusatzverkäufe
• Gutscheinfeld eingeklappt
• Weiter- und Bestellbutton ohne Scrollen erreichbar
• Bestätigungsseite lädt, purchase wird bei jeder Zahlart gesendet
• Bestätigungsmail kommt innerhalb einer Minute

Checkout optimieren heißt messen, nicht raten

Jede Änderung am Checkout wird mit demselben Trichter geprüft wie vorher: begin_checkout, add_shipping_info, add_payment_info, purchase, aufgeschlüsselt nach Gerätekategorie. Wie du diesen Trichter in GA4 baust, steht im Artikel zum Kauf-Trichter in GA4. Lass eine Änderung mindestens zwei bis vier Wochen laufen und ändere in dieser Zeit nichts anderes am Checkout, sonst kannst du die Wirkung nicht zuordnen. Ob dein Shop genug Bestellungen für einen echten A/B-Test hat oder ein Vorher-Nachher-Vergleich die ehrlichere Methode ist, klärt der Artikel dazu.

Wenn du mehrere Baustellen findest, nimm die Stufe mit dem größten Verlust zuerst. Bei vielen Shops ist das entweder der Einstieg (Kontozwang, fehlende Express-Zahlung) oder der Zahlungsschritt (fehlende Zahlart). In ecomando siehst du die Trichterstufen im Wochenbericht nebeneinander, sodass du die Wirkung einer Änderung ohne eigene Auswertung verfolgen kannst.