3.3.1 Fehlererkennung

1. Was ist das Ziel dieses Kriteriums?

Formulare sind wie der erste Eindruck beim Date – wenn etwas schiefgeht, sollte man wissen, was genau nicht passt. Aber stell dir vor, du füllst ein wichtiges Formular aus, klickst auf „Absenden" und... nichts passiert. Oder noch schlimmer: Etwas ist offensichtlich falsch, aber niemand sagt dir, was.

Menschen, die auf Screenreader angewiesen sind oder Farben nicht unterscheiden können, stehen bei rein visuellen Fehlermeldungen buchstäblich im Dunkeln. Das Ziel von Erfolgskriterium 3.3.1 ist daher klar: Wenn ein Fehler automatisch erkannt wird, muss klar in Text beschrieben werden, was falsch ist und wo das Problem liegt.

2. Was fordert das Erfolgskriterium genau?

Ganz konkret geht es um automatisch erkannte Eingabefehler – also Situationen, in denen das System merkt, dass etwas nicht stimmt, bevor die Daten verarbeitet werden.

Sobald ein Fehler erkannt wird, müssen zwei Dinge passieren:

  • Identifikation: Das fehlerhafte Feld muss eindeutig benannt werden
  • Beschreibung: Der Fehler muss in verständlichem Text erklärt werden

Was gilt als Eingabefehler?

  • Pflichtfelder, die leer gelassen wurden
  • Daten im falschen Format (z.B. „max.mustermann" statt „max@mustermann.de")
  • Werte außerhalb des erlaubten Bereichs (z.B. Geburtsjahr 2050)

Wichtig: Farben, Icons und visuelle Hervorhebungen dürfen gerne zusätzlich verwendet werden – aber der Text ist Pflicht. Ein rotes Feld allein reicht nicht aus.

3. Warum ist das wichtig für Barrierefreiheit?

Stell dir vor, du sitzt im Café, füllst ein Online-Formular aus und bekommst nur einen roten Rahmen um ein Feld – aber keine Erklärung, was falsch ist. Frustrierend, oder? Für Menschen mit Behinderungen kann das zur kompletten Blockade werden.

Textbasierte Fehlermeldungen schaffen Barrierefreiheit, weil sie:

  • Blinden und sehbehinderten Menschen ermöglichen, Fehler über Screenreader zu verstehen
  • Menschen mit Farbsehschwäche helfen, die reine Farbkodierung nicht wahrnehmen können
  • Menschen mit kognitiven Einschränkungen durch klare Sprache bei der Fehlerkorrektur unterstützen
  • Alle Nutzer in schwierigen Situationen entlasten (schlechte Beleuchtung, Stress, Zeitdruck)

Und nicht zuletzt: Klare Fehlermeldungen reduzieren Supportanfragen und Abbrüche – ein Gewinn für alle.

4. So setzt du das Kriterium erfolgreich um

Die Qualität der Fehlermeldungen entscheidet darüber, ob Nutzer erfolgreich sind oder frustriert abbrechen. Hier die bewährtesten Praktiken:

Gute Fehlermeldungen sind...

  • spezifisch: Statt „Ungültige Eingabe" besser „E-Mail-Adresse muss ein @-Zeichen enthalten"
  • verständlich: Verwende einfache Sprache und vermeide Fachjargon
  • hilfreich: Gib konkrete Hinweise zur Korrektur („Format: TT.MM.JJJJ")
  • auffindbar: Platziere sie nah am betroffenen Feld oder liste sie am Formularanfang auf

Technische Umsetzung:

  • Nutze aria-invalid="true" für fehlerhafte Felder
  • Verknüpfe Fehlermeldungen mit aria-describedby
  • Setze Fokus auf die erste Fehlermeldung oder das erste fehlerhafte Feld
  • Verwende Live-Regionen (aria-live) für dynamische Fehlermeldungen

Bewährte Muster:

<label for="email">E-Mail-Adresse*</label>

<input id="email" type="email" aria-invalid="true" 
              aria-describedby="email-error">

<div id="email-error" role="alert">
  Fehler: Bitte geben Sie eine gültige E-Mail-Adresse ein 
  (z.B. max@beispiel.de)
</div>

Tools und Hilfsmittel:

  • Verwende Validierungs-Bibliotheken mit eingebauter Barrierefreiheit
  • Teste mit Screenreadern (NVDA, JAWS, VoiceOver)
  • Prüfe die Verständlichkeit mit echten Nutzern

5. Warum dieses Erfolgskriterium für Unternehmen relevant ist

Auch bei Erfolgskriterium 3.3.1 gilt: Barrierefreiheit ist kein Selbstzweck – sondern bringt handfeste Vorteile für dein Business.

1. Zielgruppe erweitern Klare Fehlermeldungen helfen nicht nur Menschen mit Behinderungen. Sie reduzieren die Abbruchrate bei allen Nutzern und machen Formulare erfolgreicher. Gerade bei wichtigen Conversion-Punkten wie Bestellungen oder Anmeldungen zahlt sich das direkt aus.

2. Kundensupport entlasten Verständliche Fehlermeldungen reduzieren Supportanfragen erheblich. Statt „Warum funktioniert das Formular nicht?" bekommt der Nutzer sofort die nötige Information zur Selbsthilfe. Das spart Zeit und Kosten.

3. Conversion-Rate verbessern Nutzer, die Fehler schnell verstehen und korrigieren können, brechen seltener ab. Studien zeigen: Gute Fehlermeldungen können die Formular-Completion-Rate um bis zu 25% steigern.

Und nicht zuletzt: Rechtssicherheit und Fördermöglichkeiten. Viele öffentliche Projekte fordern digitale Barrierefreiheit bereits verpflichtend – wer vorbereitet ist, hat klare Vorteile bei Ausschreibungen und Förderanträgen.

6. Das Erfolgskriterium im Wortlaut der W3C

Success Criterion 3.3.1 Error Identification

(Level A)

If an input error is automatically detected, the item that is in error is identified and the error is described to the user in text.

← Zurück zur WCAG-Übersicht