„Es ist ein Fehler aufgetreten.“
Diesen Satz hat wahrscheinlich jeder schon einmal beim Online-Einkauf gesehen. Das Problem: Er sagt eigentlich überhaupt nichts.
Welcher Fehler?
Wo ist er?
Was muss geändert werden?
Und wurde die Bestellung vielleicht trotzdem abgeschickt?
Gerade im Checkout sind schlechte Fehlermeldungen besonders ärgerlich. Der Kunde hat bereits ein Produkt ausgewählt, seine Adresse eingetragen und vielleicht sogar eine Zahlungsart gewählt. Wenn er an dieser Stelle nicht versteht, warum es nicht weitergeht, ist der Abbruch nicht weit entfernt.
Für Menschen, die einen Screenreader, eine Tastatur oder eine starke Bildschirmvergrößerung verwenden, kann eine schlechte Fehlermeldung sogar dazu führen, dass der Bestellvorgang überhaupt nicht abgeschlossen werden kann.
Dabei sind verständliche Fehlermeldungen gar nicht so kompliziert. Meist geht es um eine einfache Frage:
Kann der Kunde sofort erkennen, was falsch ist und wie er es korrigieren kann?
Warum Fehlermeldungen im Checkout so wichtig sind
Fehler gehören zu Formularen dazu.
Jemand vergisst die Hausnummer. Eine E-Mail-Adresse enthält einen Tippfehler. Die Postleitzahl passt nicht zum gewählten Land. Eine Zahlungsart wurde noch nicht ausgewählt.
Das ist völlig normal.
Ein guter Checkout versucht deshalb nicht, Fehler vollständig zu verhindern. Er hilft dem Nutzer dabei, sie schnell zu erkennen und zu korrigieren.
Eine schlechte Fehlermeldung erzeugt dagegen zusätzliche Arbeit.
Der Kunde muss herausfinden:
- welches Feld betroffen ist,
- warum seine Eingabe nicht akzeptiert wurde,
- welches Format erwartet wird,
- ob bereits eingegebene Daten erhalten geblieben sind,
- wie es anschließend weitergeht.
Je länger ein Formular ist, desto problematischer wird das.
1. Nicht nur „Fehler“ schreiben
Die wahrscheinlich wichtigste Regel lautet:
Eine Fehlermeldung sollte erklären, was falsch ist.
Schlecht:
Fehler.
Etwas besser:
Ungültige Eingabe.
Deutlich besser:
Bitte geben Sie eine gültige E-Mail-Adresse ein.
Oder:
Bitte geben Sie Ihre Hausnummer ein.
Oder:
Bitte wählen Sie eine Zahlungsart aus.
Der Nutzer muss nicht wissen, dass intern ein „Validation Error“ aufgetreten ist. Er muss wissen, was er tun soll.
2. Die betroffene Eingabe eindeutig nennen
Bei einem Checkout mit zehn oder fünfzehn Feldern reicht eine Meldung wie:
Dieses Feld ist erforderlich.
nicht immer aus.
Welches Feld?
Wenn die Meldung direkt unter dem Feld steht, kann der Zusammenhang visuell offensichtlich sein. Für Screenreader oder bei starker Vergrößerung ist das aber nicht zwangsläufig genauso eindeutig.
Besser:
Bitte geben Sie Ihre Postleitzahl ein.
statt:
Pflichtfeld.
Oder:
Bitte geben Sie eine gültige Telefonnummer ein.
statt:
Eingabe ungültig.
Je konkreter die Meldung ist, desto weniger muss der Kunde suchen.
3. Fehler direkt beim Feld anzeigen
Eine Fehlermeldung sollte möglichst nah an dem Feld stehen, das korrigiert werden muss.
Beispiel:
E-Mail-Adresse
[max@beispiel]
Bitte geben Sie eine vollständige E-Mail-Adresse ein, zum Beispiel max@beispiel.de.
So erkennt der Nutzer sofort den Zusammenhang.
Problematisch ist dagegen eine Meldung ganz oben auf der Seite:
Ungültige Eingaben vorhanden.
Der Kunde muss anschließend den gesamten Checkout durchsuchen.
Bei sehr langen Formularen kann zusätzlich eine Fehlerübersicht sinnvoll sein. Die eigentliche Erklärung beim jeweiligen Feld sollte trotzdem nicht fehlen.
4. Farbe allein reicht nicht
Ein klassischer Checkout-Fehler sieht so aus:
Das Formularfeld bekommt einen roten Rahmen.
Sonst passiert nichts.
Für jemanden, der Rot schlecht wahrnehmen kann oder einen Screenreader verwendet, ist damit kaum etwas gewonnen.
Farbe darf gerne zusätzlich eingesetzt werden. Sie kann Fehler schneller sichtbar machen.
Aber es braucht auch eine textliche Erklärung.
Gut wäre beispielsweise:
🔴 Bitte geben Sie Ihre Postleitzahl ein.
Dabei ist nicht das rote Symbol entscheidend, sondern der verständliche Text.
5. Fehlermeldung und Feld technisch miteinander verbinden
Visuell kann eine Meldung direkt unter dem Feld stehen. Hilfstechnologien müssen diesen Zusammenhang ebenfalls erkennen können.
Wenn ein Screenreader in das fehlerhafte Feld springt, sollte möglichst auch die dazugehörige Fehlermeldung verfügbar sein.
Der Nutzer sollte nicht erst weiter durch die Seite navigieren müssen, um herauszufinden, warum das Feld nicht akzeptiert wurde.
Gerade bei individuell programmierten Checkout-Formularen lohnt sich deshalb eine technische Prüfung.
Optisch nebeneinander bedeutet nicht automatisch technisch miteinander verbunden.
6. Fehler nicht erst ganz am Ende erklären
Stell dir einen Checkout mit 15 Feldern vor.
Der Kunde füllt alles aus, klickt auf den Bestellbutton und erhält:
Bitte korrigieren Sie Ihre Angaben.
Jetzt beginnt die Suche.
Besser ist es, Fehler an sinnvollen Stellen anzuzeigen.
Das bedeutet nicht, dass nach jedem einzelnen Tastendruck eine Warnung erscheinen sollte.
Aber spätestens beim Verlassen eines offensichtlich falsch ausgefüllten Feldes oder beim Versuch, den nächsten Schritt zu öffnen, kann eine Rückmeldung sinnvoll sein.
7. Fehlermeldungen nicht während des Tippens nerven lassen
Das Gegenteil ist ebenfalls problematisch.
Der Nutzer möchte seine Postleitzahl eingeben.
Er tippt:
6
Sofort:
Postleitzahl ungültig.
Er tippt:
65
Noch immer:
Postleitzahl ungültig.
Natürlich ist sie ungültig. Der Nutzer ist noch gar nicht fertig.
Solche permanenten Fehlermeldungen erzeugen unnötigen Stress und können bei Screenreadern besonders störend sein.
Eine Prüfung sollte deshalb zu einem sinnvollen Zeitpunkt erfolgen.
Zum Beispiel:
- nach Verlassen des Feldes,
- beim Wechsel zum nächsten Schritt,
- beim Absenden des Formulars.
8. Fehler vermeiden, bevor sie entstehen
Die beste Fehlermeldung ist manchmal die, die gar nicht benötigt wird.
Wenn ein Feld ein bestimmtes Format verlangt, sollte dieses vorher erklärt werden.
Beispiel:
Geburtsdatum
Format: TT.MM.JJJJ
Dann weiß der Nutzer bereits vor der Eingabe, was erwartet wird.
Das Gleiche gilt für:
- Gutscheincodes,
- Telefonnummern,
- Kundennummern,
- Kreditkarteninformationen,
- Postleitzahlen,
- Passwortanforderungen.
Eine klare Anleitung verhindert mehr Fehler als eine komplizierte Fehlermeldung später erklären kann.
9. Beispiele für die richtige Eingabe geben
Manche Formate sind nicht sofort verständlich.
Schlecht:
Telefonnummer ungültig.
Besser:
Bitte geben Sie eine gültige Telefonnummer ein.
Noch hilfreicher:
Bitte geben Sie eine Telefonnummer ein, zum Beispiel 06142 123456.
Natürlich sollte ein Formular gleichzeitig übliche Schreibweisen akzeptieren und nicht unnötig streng sein.
Ein Kunde sollte nicht scheitern, nur weil er Leerzeichen oder Bindestriche verwendet.
10. Keine technischen Fehlermeldungen anzeigen
In einem echten Shop sieht man gelegentlich Meldungen wie:
Error 422
Invalid field value
Payment authentication failed
JSON request error
Für Entwickler mögen diese Informationen hilfreich sein.
Für Kunden normalerweise nicht.
Eine technische Fehlermeldung sollte in verständliche Sprache übersetzt werden.
Statt:
Payment authentication failed.
besser:
Die Zahlung konnte nicht bestätigt werden. Bitte versuchen Sie es erneut oder wählen Sie eine andere Zahlungsart.
Technische Details können intern protokolliert werden.
Der Kunde braucht eine Lösung, keinen Debug-Bericht.
11. Eine Fehlerübersicht bei mehreren Problemen anbieten
Bei längeren Checkout-Formularen können mehrere Fehler gleichzeitig auftreten.
Zum Beispiel:
- E-Mail-Adresse fehlt,
- Hausnummer fehlt,
- Zahlungsart fehlt.
Dann kann am Anfang des Formularbereichs eine Übersicht erscheinen:
Bitte korrigieren Sie drei Angaben:
- E-Mail-Adresse eingeben
- Hausnummer ergänzen
- Zahlungsart auswählen
Idealerweise führen diese Punkte direkt zum jeweiligen Feld.
Damit kann der Nutzer die Probleme nacheinander abarbeiten.
12. Fehleranzahl nennen
Eine Information wie:
„Bitte korrigieren Sie 3 Fehler.“
ist hilfreicher als:
„Ihre Angaben sind unvollständig.“
Der Nutzer weiß dann sofort, wie viel noch zu tun ist.
Besonders bei langen Formularen schafft das Orientierung.
Nach jeder Korrektur kann die Übersicht entsprechend aktualisiert werden.
13. Fokus nach dem Absenden sinnvoll setzen
Hier versteckt sich einer der wichtigsten Punkte.
Der Kunde drückt:
„Weiter zur Zahlung“
Das Formular enthält einen Fehler.
Was passiert mit dem Tastaturfokus?
Schlecht wäre:
Der Fokus bleibt auf dem Button, während irgendwo 800 Pixel weiter oben eine Fehlermeldung erscheint.
Der Tastaturnutzer bemerkt möglicherweise überhaupt nichts.
Sinnvoll kann es sein, den Fokus:
- auf die Fehlerübersicht oder
- auf das erste fehlerhafte Feld
zu setzen.
Welche Variante besser passt, hängt vom Aufbau des Checkouts ab.
Wichtig ist, dass der Fehler nicht irgendwo unsichtbar bleibt.
14. Bereits eingegebene Daten nicht löschen
Kaum etwas ist frustrierender als dieses Szenario:
Name eingetragen.
Adresse eingetragen.
Telefonnummer eingetragen.
Lieferhinweis geschrieben.
Bestellung abgeschickt.
Ein Fehler.
Und plötzlich sind alle Felder leer.
Normale Eingaben sollten bei einer Fehlermeldung möglichst erhalten bleiben.
Bei bestimmten sensiblen Zahlungsinformationen können Sicherheitsgründe dagegen sprechen. Das ist ein anderer Fall.
Eine fehlende Hausnummer sollte jedenfalls nicht dazu führen, dass der Kunde seine komplette Adresse neu schreiben muss.
15. Den falschen Wert nicht einfach entfernen
Auch das kommt vor.
Der Kunde gibt eine vermeintlich falsche Postleitzahl ein.
Das System leert das Feld.
Jetzt weiß der Nutzer vielleicht nicht mehr, was er ursprünglich eingegeben hatte.
Besser ist es, den Wert stehen zu lassen und zu erklären, was daran nicht akzeptiert wird.
Dann kann die Eingabe gezielt korrigiert werden.
16. Pflichtfelder konkret benennen
Wenn ein Pflichtfeld leer bleibt, sollte die Meldung eindeutig sein.
Schlecht:
Feld erforderlich.
Besser:
Bitte geben Sie Ihren Nachnamen ein.
Oder:
Bitte wählen Sie ein Lieferland aus.
Das klingt nach einer Kleinigkeit, macht den Checkout aber wesentlich verständlicher.
17. Optionale Felder nicht wie Fehler behandeln
Ein Checkout sollte klar unterscheiden zwischen:
Pflichtfeld
und:
optional
Wenn beispielsweise die Telefonnummer freiwillig ist, darf ein leeres Telefonnummernfeld natürlich keine Fehlermeldung erzeugen.
Auch optionale Adresszusätze, Firmenname oder Bestellnotizen sollten entsprechend gekennzeichnet werden.
Je klarer das vor der Eingabe ist, desto weniger Unsicherheit entsteht.
18. E-Mail-Fehler verständlich formulieren
E-Mail-Adressen verursachen häufig Validierungsfehler.
Eine gute Meldung lautet:
Bitte prüfen Sie Ihre E-Mail-Adresse. Es fehlt möglicherweise der Teil nach dem @-Zeichen.
Oder allgemein:
Bitte geben Sie eine vollständige E-Mail-Adresse ein, zum Beispiel name@beispiel.de.
Nicht:
Invalid email.
Der Nutzer sollte direkt erkennen können, was erwartet wird.
19. Adressfehler vorsichtig behandeln
Adressprüfungen sind praktisch, können aber schnell zu Problemen führen.
Vielleicht kennt das System:
Musterstraße 12a
nicht.
Das bedeutet nicht automatisch, dass die Adresse falsch ist.
Eine gute Rückmeldung könnte lauten:
Wir konnten diese Adresse nicht eindeutig bestätigen. Bitte überprüfen Sie die Angaben oder verwenden Sie die eingegebene Adresse trotzdem.
Der Kunde sollte nicht in einer Schleife landen, nur weil die Datenbank seine Adresse nicht kennt.
20. Postleitzahlen nicht unnötig streng prüfen
Nicht jedes Land verwendet dasselbe Postleitzahlenformat.
Wer international verkauft, sollte deshalb vorsichtig mit starren Regeln umgehen.
Eine verständliche Fehlermeldung könnte beispielsweise lauten:
Bitte prüfen Sie die Postleitzahl für das ausgewählte Lieferland.
Noch besser ist natürlich, wenn die Prüfung tatsächlich zum jeweiligen Land passt.
21. Fehlende Versandart erklären
Manchmal wird keine Versandart ausgewählt.
Dann reicht:
Bitte wählen Sie eine Versandart.
Falls keine Versandart verfügbar ist, liegt möglicherweise ein anderes Problem vor.
Dann sollte die Meldung das erklären:
Für diese Lieferadresse ist derzeit keine Versandart verfügbar. Bitte überprüfen Sie Ihre Adresse oder kontaktieren Sie unseren Kundenservice.
Das ist etwas völlig anderes als eine vergessen gegangene Auswahl.
22. Zahlungsfehler besonders sorgfältig formulieren
Bei Zahlungsfehlern sind Kunden verständlicherweise sensibel.
Eine Meldung wie:
Zahlung fehlgeschlagen.
lässt viele Fragen offen.
Besser:
Die Zahlung konnte nicht abgeschlossen werden. Ihre Bestellung wurde noch nicht bezahlt. Bitte versuchen Sie es erneut oder wählen Sie eine andere Zahlungsart.
Falls bekannt, kann die Meldung konkreter werden:
Die Kreditkartenzahlung wurde nicht bestätigt. Bitte prüfen Sie Ihre Kartendaten oder verwenden Sie eine andere Zahlungsart.
Wichtig ist vor allem Klarheit darüber, ob Geld abgebucht und ob die Bestellung angelegt wurde.
23. Keine Schuldzuweisungen formulieren
Fehlermeldungen sollten sachlich bleiben.
Ungünstig:
Sie haben eine falsche Adresse eingegeben.
Besser:
Bitte überprüfen Sie die eingegebene Adresse.
Oder:
Die Adresse konnte nicht eindeutig bestätigt werden.
Das ist nicht nur freundlicher. Es ist häufig auch genauer, denn vielleicht liegt das Problem tatsächlich beim System.
24. Klar sagen, ob die Bestellung angekommen ist
Besonders kritisch sind Fehler nach dem Klick auf den Bestellbutton.
Die Seite lädt.
Dann erscheint:
Etwas ist schiefgelaufen.
Jetzt fragt sich der Kunde:
Wurde bestellt oder nicht?
Eine gute Meldung muss hier Klarheit schaffen.
Zum Beispiel:
Die Bestellung konnte nicht abgeschlossen werden. Es wurde keine Bestellung übermittelt.
Oder:
Ihre Bestellung wurde gespeichert, die Zahlung ist jedoch noch nicht abgeschlossen.
Diese Information verhindert Doppelbestellungen und unnötige Unsicherheit.
25. Fehler bei Gutscheincodes verständlich unterscheiden
Nicht jeder ungültige Gutschein ist gleich.
Mögliche Gründe:
- Code existiert nicht,
- Code ist abgelaufen,
- Mindestbestellwert nicht erreicht,
- nur für bestimmte Produkte gültig,
- bereits verwendet.
Statt:
Gutschein ungültig.
kann man je nach Fall konkreter werden:
Dieser Gutschein ist abgelaufen.
Oder:
Für diesen Gutschein ist ein Mindestbestellwert von 50 Euro erforderlich.
Damit weiß der Kunde sofort, was los ist.
26. Fehlermeldungen dürfen nicht sofort verschwinden
Eine kleine rote Meldung erscheint zwei Sekunden und verschwindet wieder.
Für viele Nutzer ist das zu kurz.
Besonders problematisch ist es für:
- Menschen mit Leseschwierigkeiten,
- Nutzer einer Bildschirmvergrößerung,
- Screenreader-Nutzer,
- Menschen mit kognitiven Einschränkungen.
Eine Fehlermeldung sollte normalerweise so lange sichtbar bleiben, bis sie behoben wurde oder der Nutzer sie bewusst schließt.
27. Fehlermeldungen nicht durch Popups verdecken
Im Checkout konkurrieren viele Elemente um Platz:
- Cookie-Banner,
- Chat-Widget,
- Rabatt-Popup,
- Zahlungsdialog,
- Sticky Bestellübersicht.
Eine Fehlermeldung darf nicht hinter einem dieser Elemente verschwinden.
Teste das besonders auf Smartphones.
Ein Hinweis direkt unter einem Feld bringt wenig, wenn die Bildschirmtastatur oder ein festes Banner genau darüberliegt.
28. Fehlermeldungen bei Vergrößerung testen
Vergrößere den Checkout im Browser deutlich.
Prüfe anschließend:
- Wird der Fehlertext vollständig angezeigt?
- Überlappt er andere Felder?
- Wird das Formular unnötig breit?
- Ist das betroffene Feld noch sichtbar?
- Kann man ohne horizontales Hin- und Herscrollen korrigieren?
Gerade lange Meldungen können bei schlechten Layouts schnell abgeschnitten werden.
29. Mobile Fehlermeldungen separat testen
Auf dem Desktop kann eine Meldung neben dem Feld stehen.
Auf dem Smartphone passt sie dort vielleicht gar nicht mehr hin.
Mobile Layouts sollten deshalb separat geprüft werden.
Meist ist eine Darstellung direkt unter dem entsprechenden Feld besonders robust.
Auch Fehlerübersichten sollten auf kleinen Bildschirmen nicht zu einem riesigen unübersichtlichen Block werden.
30. Screenreader müssen neue Fehlermeldungen bemerken
Bei modernen Checkouts erscheint eine Fehlermeldung häufig dynamisch, ohne dass die Seite neu geladen wird.
Sehende Nutzer erkennen den roten Hinweis sofort.
Ein Screenreader muss jedoch technisch darüber informiert werden, dass sich etwas verändert hat.
Sonst passiert folgendes:
Der Nutzer aktiviert „Weiter“.
Nichts scheint zu passieren.
Er drückt erneut.
Wieder nichts.
Die Fehlermeldung steht längst auf dem Bildschirm, wurde aber nicht angekündigt.
Dynamische Fehlermeldungen sollten deshalb so umgesetzt werden, dass Hilfstechnologien sie wahrnehmen können.
31. Nicht jede Meldung aggressiv vorlesen lassen
Dabei ist allerdings auch Zurückhaltung wichtig.
Wenn bei jedem Tastendruck sofort eine Statusmeldung vorgelesen wird, wird der Checkout schnell anstrengend.
Priorität sollten Meldungen haben, die für die Fortsetzung notwendig sind.
Zum Beispiel:
Bitte geben Sie Ihre E-Mail-Adresse ein.
Weniger wichtig wäre eine permanente Ansage bei jeder kleinen optischen Änderung.
Barrierefreiheit bedeutet nicht, möglichst viele Meldungen auszugeben. Es geht um die richtigen Informationen zum richtigen Zeitpunkt.
32. Korrektur bestätigen
Nach der Korrektur kann eine kurze positive Rückmeldung sinnvoll sein.
Beispiel:
E-Mail-Adresse wurde akzeptiert.
Das muss nicht bei jedem normalen Formularfeld passieren.
Bei komplizierteren Prüfungen kann es aber helfen.
Zum Beispiel:
Gutscheincode erfolgreich angewendet.
Oder:
Lieferadresse wurde aktualisiert.
33. Erfolgsmeldungen genauso verständlich machen
Nicht nur Fehler brauchen gute Texte.
Nach einer erfolgreichen Aktion sollte klar sein, was passiert ist.
Beispiele:
Gutschein wurde angewendet. Sie sparen 10 Euro.
Lieferadresse wurde geändert.
Zahlungsart PayPal wurde ausgewählt.
Ihre Bestellung wurde erfolgreich übermittelt.
Der Nutzer erhält damit Sicherheit, dass seine Aktion tatsächlich funktioniert hat.
34. Formulierungen möglichst einfach halten
Fehlermeldungen sind kein guter Ort für komplizierte Sprache.
Statt:
Die von Ihnen übermittelten Daten entsprechen nicht den erforderlichen Validierungsparametern.
besser:
Bitte überprüfen Sie Ihre Eingaben.
Noch besser, wenn bekannt:
Bitte geben Sie eine fünfstellige Postleitzahl ein.
Kurze, konkrete Sätze funktionieren meistens am besten.
35. Fehler direkt lösen helfen
Eine gute Fehlermeldung nennt nicht nur das Problem, sondern möglichst auch die Lösung.
Schlecht:
Passwort ungültig.
Besser:
Das Passwort muss mindestens acht Zeichen enthalten.
Oder:
Bitte verwenden Sie mindestens acht Zeichen, darunter eine Zahl.
Der Kunde sollte möglichst nicht zusätzlich eine Hilfeseite durchsuchen müssen.
36. Links innerhalb von Fehlermeldungen eindeutig benennen
Manchmal kann ein Link notwendig sein.
Beispiel:
Ihre Sitzung ist abgelaufen. Bitte melden Sie sich erneut an.
Dann sollte der Link beispielsweise heißen:
„Erneut anmelden“
und nicht:
„Hier klicken“
Der Link muss natürlich auch mit Tastatur erreichbar sein.
37. Nach einem Fehler nicht die komplette Seite neu aufbauen
Manche Checkout-Systeme laden nach einem Fehler praktisch die ganze Seite neu und verändern dabei die Struktur.
Das kann dazu führen, dass:
- Fokus verloren geht,
- geöffnete Bereiche wieder geschlossen werden,
- eingegebene Daten verschwinden,
- Scrollposition zurückgesetzt wird.
Wenn ein Neuladen notwendig ist, sollte der Nutzer danach trotzdem schnell erkennen, was passiert ist und wo korrigiert werden muss.
38. Fehler verschiedener Plugins vereinheitlichen
Besonders bei WooCommerce entstehen Checkout-Seiten häufig aus mehreren Komponenten.
Das Shop-System schreibt:
Bitte Rechnungsadresse eingeben.
Das Zahlungsplugin schreibt:
ERROR_CARD_INVALID.
Das Newsletter-Plugin schreibt:
Required field.
Das sieht nicht nur uneinheitlich aus, sondern erschwert auch die Nutzung.
Fehlermeldungen sollten möglichst einem gemeinsamen Muster folgen:
Was ist falsch?
Wo liegt der Fehler?
Was muss der Nutzer tun?
Damit wirkt der gesamte Checkout wesentlich ruhiger und verständlicher.
39. Auch externe Zahlungsanbieter testen
Die eigene Checkout-Seite kann hervorragend umgesetzt sein.
Dann öffnet sich ein Zahlungsfenster eines externen Anbieters und plötzlich ändern sich Sprache und Bedienung komplett.
Teste auch dort absichtlich Fehler.
Zum Beispiel:
- Sicherheitscode fehlt,
- Karte abgelaufen,
- Authentifizierung abgebrochen,
- Anmeldung fehlgeschlagen.
Danach sollte klar sein, wie der Kunde wieder zum Shop zurückkommt und was mit seiner Bestellung passiert ist.
40. Fehlerfälle gehören in jeden Shop-Test
Beim Testen wird häufig nur der Idealfall ausprobiert.
Produkt auswählen.
Adresse korrekt eingeben.
Bezahlen.
Fertig.
Damit prüft man aber nur einen Teil des Checkouts.
Ein guter Test enthält bewusst Fehler:
- Pflichtfeld leer lassen.
- Falsche E-Mail-Adresse eingeben.
- Postleitzahl falsch schreiben.
- Keine Versandart auswählen.
- Keine Zahlungsart auswählen.
- Ungültigen Gutschein verwenden.
- Zahlung abbrechen.
- Sitzung gegebenenfalls auslaufen lassen.
Gerade diese Tests zeigen, wie gut ein Shop wirklich funktioniert.
Schlechte und bessere Fehlermeldungen im Vergleich
E-Mail-Adresse
Schlecht:
Ungültige Eingabe.
Besser:
Bitte geben Sie eine gültige E-Mail-Adresse ein, zum Beispiel name@beispiel.de.
Pflichtfeld
Schlecht:
Dieses Feld ist erforderlich.
Besser:
Bitte geben Sie Ihren Nachnamen ein.
Postleitzahl
Schlecht:
Fehler bei PLZ.
Besser:
Bitte prüfen Sie die Postleitzahl für das ausgewählte Lieferland.
Gutschein
Schlecht:
Code ungültig.
Besser:
Dieser Gutschein ist abgelaufen und kann nicht mehr verwendet werden.
Versand
Schlecht:
Keine Methode.
Besser:
Bitte wählen Sie eine Versandart aus.
Zahlung
Schlecht:
Payment Error 104.
Besser:
Die Zahlung konnte nicht abgeschlossen werden. Bitte prüfen Sie Ihre Zahlungsdaten oder wählen Sie eine andere Zahlungsart.
Bestellung
Schlecht:
Etwas ist schiefgelaufen.
Besser:
Die Bestellung wurde nicht übermittelt. Bitte überprüfen Sie die markierten Angaben und versuchen Sie es erneut.
Praktische Checkliste für Fehlermeldungen im Checkout
Prüfe bei deinem Checkout:
- Wird eindeutig gesagt, dass ein Fehler vorliegt?
- Wird das betroffene Feld genannt?
- Steht die Meldung direkt beim Feld?
- Wird der Fehler als Text beschrieben?
- Wird nicht nur Farbe verwendet?
- Ist die Meldung technisch dem Feld zugeordnet?
- Wird erklärt, wie der Fehler behoben werden kann?
- Bleiben bereits eingegebene Daten erhalten?
- Bleibt der fehlerhafte Wert zur Korrektur sichtbar?
- Werden mehrere Fehler übersichtlich zusammengefasst?
- Wird der Fokus sinnvoll zum Fehler geführt?
- Werden neue Fehlermeldungen von Screenreadern wahrgenommen?
- Bleiben Meldungen lange genug sichtbar?
- Funktioniert die Darstellung bei Vergrößerung?
- Funktioniert sie auf dem Smartphone?
- Sind Zahlungsfehler verständlich?
- Ist klar, ob die Bestellung übermittelt wurde?
- Werden technische Fehlercodes vor dem Kunden verborgen?
- Sind die Formulierungen kurz und verständlich?
Welche Probleme sollte man zuerst beheben?
Wenn ein bestehender Shop viele unterschiedliche Fehlermeldungen besitzt, muss nicht alles gleichzeitig überarbeitet werden.
Priorität 1: Fehler, die Bestellungen verhindern
Zuerst:
- Fehlermeldung wird überhaupt nicht angezeigt
- Screenreader bekommt den Fehler nicht mit
- Kunde weiß nicht, welches Feld betroffen ist
- Zahlungsfehler ist unverständlich
- Fokus landet nach einem Fehler an der falschen Stelle
- eingegebene Daten gehen verloren
Priorität 2: Verständlichkeit
Danach:
- technische Formulierungen ersetzen
- konkrete Lösung nennen
- Pflichtfelder genauer beschreiben
- mehrere Fehler zusammenfassen
- Fehler nicht nur farblich darstellen
Priorität 3: Komfort
Anschließend:
- Beispiele für Eingaben ergänzen
- Erfolgsmeldungen verbessern
- mobile Darstellung optimieren
- Formulierungen über verschiedene Plugins vereinheitlichen
Ein einfacher Fünf-Minuten-Test
Öffne deinen Checkout und mache absichtlich alles falsch.
Das klingt vielleicht seltsam, ist aber ein hervorragender Test.
Lass den Nachnamen leer.
Schreibe:
test@
als E-Mail-Adresse.
Lass die Postleitzahl weg.
Wähle keine Zahlungsart.
Aktiviere den Bestellbutton.
Dann beobachte:
Verstehe ich sofort, was falsch ist?
Sehe ich alle Fehler?
Kann ich sie mit Tastatur korrigieren?
Sind meine bisherigen Angaben noch vorhanden?
Weiß ich anschließend, wie es weitergeht?
Wenn du bei einer dieser Fragen überlegen musst, können wahrscheinlich auch Kunden Schwierigkeiten bekommen.
Fazit: Gute Fehlermeldungen erklären nicht den Fehlercode, sondern die Lösung
Ein Checkout funktioniert nicht nur dann gut, wenn alles richtig eingegeben wurde.
Er zeigt seine Qualität vor allem in dem Moment, in dem etwas schiefgeht.
Eine gute Fehlermeldung sagt deshalb nicht einfach:
„Fehler.“
Sie sagt:
Was ist falsch?
Wo ist es falsch?
Wie kann ich es korrigieren?
Genau diese drei Fragen sollten Shopbetreiber bei jeder Fehlermeldung stellen.
Oft braucht es dafür keine aufwendige neue Technik. Schon bessere Texte, eine klare Zuordnung zum Formularfeld und eine sinnvolle Fokussteuerung können einen großen Unterschied machen.
Und wie bei vielen Themen der Barrierefreiheit profitieren davon nicht nur Menschen mit Behinderungen.
Niemand möchte zehn Minuten lang herausfinden, warum ein Checkout die eigene Adresse nicht akzeptiert.
Verständliche Fehlermeldungen sparen Zeit, reduzieren Frust und bringen den Kunden schneller zu dem Punkt, den sowohl er als auch der Shopbetreiber erreichen möchten:
einer erfolgreich abgeschlossenen Bestellung.
Hinweis: Dieser Beitrag bietet eine allgemeine Orientierung und ersetzt keine individuelle Rechtsberatung oder vollständige Barrierefreiheitsprüfung.