Im Checkout ist die Kaufabsicht schon da. Der Besucher hat sich entschieden, das Produkt liegt im Korb, jetzt soll nur noch der Abschluss folgen. Genau hier kostet jede Hürde bares Geld, denn ein Abbruch an dieser Stelle ist ein verlorener Kunde, der eigentlich kaufen wollte.
Wer mit der Maus klickt und gut sieht, merkt von vielen Barrieren nichts. Wer per Tastatur navigiert, einen Screenreader nutzt oder die Seite stark vergrößert, stolpert dagegen oft erst auf den letzten Metern. Seit das BFSG Onlineshops verpflichtet, gehört diese Strecke auf den Prüfstand. Fünf Stellen machen den Unterschied, und keine davon verlangt, dass Du selbst Hand an den Code legst.
Warum der Checkout die kritischste Strecke ist
Eine Produktseite wird gelesen, ein Checkout wird bedient. Der Besucher muss Mengen ändern, eine Versandart wählen, eine Zahlweise bestätigen und am Ende sicher sein, dass die Bestellung angekommen ist. Jeder dieser Schritte ist eine eigene kleine Formularstrecke, und jede kann scheitern.
Das Tückische daran liegt im Zeitpunkt. Bricht jemand auf der Startseite ab, war das Interesse vielleicht ohnehin gering. Bricht jemand im Checkout ab, verlierst Du einen Menschen, der schon zahlen wollte. Dieselben Maßnahmen, die diese Strecke zugänglich machen, holen also genau die erreichbaren Kunden, die sonst abspringen.
Der Warenkorb muss bedienbar bleiben
Der Warenkorb ist die erste Station, und er steckt voller kleiner Bedienelemente. Menge erhöhen, Menge verringern, Artikel entfernen, Gutschein einlösen. Wer keine Maus benutzt, muss jedes dieser Elemente mit der Tabulatortaste erreichen und mit der Tastatur auslösen können.
Ein häufiger Stolperstein sind Mengen, die sich nur über winzige Plus- und Minus-Symbole ändern lassen. Für die Tastatur sind solche Symbole oft unsichtbar, für den Finger am Smartphone zu klein. Ein gutes Beispiel bietet daneben ein einfaches Eingabefeld, in das man die Stückzahl direkt schreibt.
Prüfen kannst Du das in zwei Minuten. Leg ein Produkt in den Korb, dann navigiere ausschließlich mit der Tabulatortaste durch die Seite und schau, ob Du jede Menge ändern und jeden Artikel entfernen kannst, ohne einmal zur Maus zu greifen.
Rückmeldung beim Hinzufügen, die jeder mitbekommt
Du klickst „In den Warenkorb", und oben rechts springt die Zahl am Korb-Symbol von zwei auf drei. Fürs Auge ist klar, dass etwas passiert ist. Eine Vorlese-Software sagt davon nichts an, wenn die Änderung nur still im Hintergrund stattfindet. Der Nutzer klickt dann ein zweites und drittes Mal, weil er keine Bestätigung hört.
Ein zugänglicher Shop meldet jede Aktion hörbar zurück. „Produkt wurde dem Warenkorb hinzugefügt" wird angesagt, ohne dass der Nutzer dafür irgendwohin springen muss. Dieselbe Klarheit hilft übrigens allen, denn auch sehende Menschen übersehen eine stille Änderung am oberen Bildschirmrand leicht.
Am verlässlichsten zeigt sich das im Schnelltest mit eingeschaltetem Screenreader. Wenn die Vorlese-Software nach dem Klick still bleibt, fehlt die Rückmeldung, und der Kunde tappt im Dunkeln.
Versand- und Zahlauswahl ohne Maus
Versandart und Zahlweise sind klassische Auswahllisten, und Auswahllisten sind ein beliebter Ort für hübsch gestaltete Stolpersteine. Oft werden die echten Auswahlknöpfe versteckt und durch aufwendig gestylte Kacheln ersetzt, die schick aussehen, sich aber mit der Tastatur nicht ansteuern lassen.
Woran erkennst Du eine saubere Auswahl? Sie lässt sich mit der Tabulatortaste erreichen, mit den Pfeiltasten durchblättern und mit der Leertaste bestätigen. Jede Option trägt eine sichtbare Beschriftung, und die aktive Wahl ist deutlich markiert, nicht nur durch eine zarte Farbe. Das gilt für Versandoptionen genauso wie für Zahlarten.
Achte hier auch auf Zusatzkosten. Wenn der Versandpreis erst nach der Auswahl irgendwo erscheint, sollte diese Änderung hörbar angesagt werden, damit niemand am Ende von der Summe überrascht wird.
Fehler, die den Weg zurück zeigen
Im Checkout passieren Fehler. Eine Postleitzahl fehlt, die Kartennummer hat einen Dreher, das Gutschein-Feld bleibt leer. Entscheidend ist, was dann geschieht. Ein roter Rahmen allein reicht nicht, denn Farbe sieht nicht jeder, und ein Screenreader meldet eine Einfärbung nicht von selbst.
Ein guter Fehlerweg benennt das Problem in Worten, sagt es hörbar an und setzt den Fokus auf das erste betroffene Feld. So weiß der Nutzer sofort, wo er weitermachen muss, statt das ganze Formular noch einmal abzusuchen. Die Sprache bleibt dabei konkret. „Bitte gib eine gültige Postleitzahl ein" hilft mehr als ein blasses „Ungültige Eingabe".
Diese Logik kennst Du aus jedem guten Kontaktformular. Wie sie im Detail funktioniert, beschreibt der Beitrag zu barrierefreien Formularen, denn der Checkout ist am Ende nichts anderes als ein langes, mehrstufiges Formular.
Gast-Bestellung statt Pflicht-Konto
Ein erzwungenes Kundenkonto ist eine Barriere ganz eigener Art. Es verlangt ein weiteres Passwort, eine Mail-Bestätigung und manchmal ein Captcha, das gerade Menschen mit Behinderung gezielt aussperrt. Wer schnell kaufen will, springt an dieser Wand oft einfach ab.
Eine sichtbare Gast-Bestellung nimmt den ganzen Block heraus. Der Kunde gibt nur ein, was die Lieferung wirklich braucht, und ist durch. Falls vor dem Bestellknopf doch ein Schutzmechanismus sitzt, achte darauf, dass es ein zugängliches Captcha vor dem Bestellknopf ist und keine reine Bilderrätsel-Hürde.
Die Gast-Option zahlt sich auch ohne Barrierefreiheit aus, weil jeder zusätzliche Pflichtschritt vor dem Kauf Kunden kostet. Zugänglichkeit und Verkaufszahlen ziehen hier in dieselbe Richtung.
Ein Fokus, der den Flow führt
Durch den ganzen Checkout zieht sich eine einfache Frage. Wo stehe ich gerade? Wer per Tastatur arbeitet, braucht eine sichtbare Markierung um das Element, das er aktuell bedient, einen klaren Rahmen um das Feld oder den Knopf. Fehlt diese Markierung, tappt der Nutzer durch eine unsichtbare Reihenfolge.
Die Reihenfolge selbst muss der Leserichtung folgen. Der Fokus wandert von oben nach unten durch die Felder, nicht in Sprüngen quer über die Seite. Öffnet sich ein Bezahlfenster, gehört der Fokus hinein und nach dem Schließen zurück an die Stelle, an der man war. Diese Geländer-Funktion entscheidet, ob der Flow trägt oder ins Leere führt.
Den ganzen Hintergrund dazu liefern die Grundlagen der Barrierefreiheit. Für den Checkout reicht die Beobachtung, dass ein sichtbarer Fokus die gesamte Strecke zusammenhält.
Fazit
Der Checkout ist die Stelle, an der sich Zugänglichkeit am direktesten in Umsatz übersetzt. Wer hier ausgesperrt wird, war zahlungsbereit und ist trotzdem weg. Genau deshalb lohnt der Blick auf diese fünf Stellen mehr als auf jede andere Strecke im Shop.
Du musst dafür nichts programmieren. Es reicht, einmal mit der Tabulatortaste und einmal mit eingeschaltetem Screenreader durch Deinen Bestellprozess zu gehen und jede Hürde zu notieren. Diese Liste ist eine handfeste, gut umsetzbare Anforderung an Deine Agentur, und das BFSG verlangt sie ohnehin.