So gestalten Sie Fehlermeldungen, die Frustration reduzieren
Wie man Fehlerzustände gestaltet, von denen sich Menschen erholen können: Platzierung, Timing, Formulierung, Beibehaltung von Eingaben, Zugänglichkeit und Bewegung, basierend auf Usability-Forschung.
Kernaussage
Eine gute Fehlermeldung ist sichtbar und wird neben dem Problem platziert. Sie ist im Klartext geschrieben, sagt, wie das Problem behoben werden kann, behält bei, was die Person bereits eingegeben hat, und gibt ihr niemals die Schuld. Zeigen Sie es an, wenn die Person mit einem Feld fertig ist oder es übermittelt hat, und nicht, während sie noch tippt, und stellen Sie sicher, dass Screenreader es ankündigen.
Die Richtlinien
Nielsen Norman Group fasst effektive Fehlermeldungen als gut sichtbar, konstruktiv und respektvoll gegenüber den Bemühungen des Benutzers zusammen. In der Praxis bedeutet das:
- Platzieren Sie die Nachricht neben dem Feld oder Element mit dem Problem.
- Verwenden Sie eine klare, spezifische Sprache: „Diese Zahl ist eine Ziffer kürzer“, nicht „Ungültige Eingabe“.
- Bieten Sie eine Lösung an: Welches Format wird erwartet, was sollte als Nächstes versucht werden.
- Behalten Sie, was die Leute eingegeben haben, damit sie es bearbeiten können, anstatt noch einmal von vorne zu beginnen.
- Machen Sie keine Vorwürfe: Vermeiden Sie Wörter wie ungültig, illegal oder falsch.
Timing
Einer der häufigsten Fehler ist es, einen Fehler anzuzeigen, bevor jemand fertig ist. NN/g bezeichnet vorzeitige Fehler als feindseliges Muster, etwa wenn man einen Test benotet, bevor der Schüler fertig ist. Validieren Sie ein Feld, wenn die Person es verlässt oder das Formular absendet, und aktualisieren Sie die Nachricht dann live, während sie sie korrigiert.
Fehler, bei denen es nicht um Formulare geht
Sagen Sie bei Systemfehlern wie einem fehlgeschlagenen Speichervorgang oder einem Verbindungsverlust, was passiert ist, was beibehalten wurde und was die Person tun kann: erneut versuchen, offline arbeiten oder den Support kontaktieren. Vermeiden Sie eigenständige Fehlercodes. Wenn Sie eines zur Unterstützung benötigen, zeigen Sie es zusammen mit einer menschlichen Erklärung.
Zugänglichkeit
Verlassen Sie sich nicht nur auf Rot: Fügen Sie ein Symbol und einen Text hinzu. Verbinden Sie die Nachricht mit ihrem Feld, damit Screenreader sie mit dem Feld lesen, und verschieben Sie den Fokus nach einer fehlgeschlagenen Übermittlung auf den ersten Fehler oder eine Fehlerzusammenfassung.
Bewegung in Fehlerzuständen
Ein kurzes Schütteln oder ein Farbwechsel kann die Aufmerksamkeit auf das Feld mit dem Problem lenken, aber halten Sie es kurz, wiederholen Sie es nicht bei jedem Tastendruck und ersetzen Sie die Bewegung durch einen Farb- oder Symbolwechsel, wenn die reduzierte Bewegung aktiviert ist. Die Botschaft selbst ist wichtiger als die Animation.
Wichtige Prinzipien
- Platzieren Sie Fehler neben dem Problem, im Klartext, mit einer Lösung
- Behalten Sie, was die Leute eingegeben haben
- Validieren Sie, nachdem ein Feld fertig ist, nicht während der Eingabe
- Verlassen Sie sich nie allein auf die Farbe; Verbinden Sie Nachrichten für Bildschirmleseprogramme
- Halten Sie Fehlerbewegungen kurz und respektieren Sie reduzierte Bewegungen
Häufige Fragen
Quellen
- Error-Message Guidelines — Nielsen Norman Group
- Indicators, Validations, and Notifications — Nielsen Norman Group