WCAG 2.1 - 3.3.3
Error Suggestion
Wenn ein Eingabefehler automatisch erkannt wird und Korrekturvorschläge bekannt sind, werden diese dem Benutzer bereitgestellt, es sei denn, dies würde die Sicherheit oder den Zweck des Inhalts gefährden.
Inhalt
Was Bedeutet das Success Criterium 3.3.3 - Error Suggestion?Warum ist es so wichtig, das Success Criterium 3.3.3 - Error Suggestion zu beachten?Was hat das Success Criterium 3.3.3 - Error Suggestion mit dem BFSG zu tun?Lösungen für 3.3.3 - Error Suggestion anhand von CodebeispielenWie löse ich Verstöße gegen das Success Criterium 3.3.3 - Error Suggestion?Was Bedeutet das Success Criterium 3.3.3 - Error Suggestion?
Wenn ein Nutzer auf deiner Website ein Eingabefeld falsch ausfüllt, muss die Website ihm nicht nur mitteilen, dass ein Fehler gemacht wurde, sondern auch möglichst deutlich erklären, wie dieser behoben werden kann. Fehler dürfen nicht einfach nur als "Fehler!" angezeigt werden – die Nutzer brauchen hilfreiche Hinweise, damit sie wissen, was genau falsch ist und welche Korrektur erwartet wird.
Das Ziel: Nutzer werden durch die Verbesserungsvorschläge unterstützt, sodass sie eigenständig Fehler korrigieren können. Dies betrifft insbesondere Formulare, z.B. Kontaktformulare, Login-Masken oder Bestellstrecken.
Warum ist es so wichtig, das Success Criterium 3.3.3 - Error Suggestion zu beachten?
Viele Menschen – zum Beispiel mit Lernbeeinträchtigungen, eingeschränktem Sehvermögen oder kognitiven Einschränkungen – können allgemeine Fehlermeldungen nicht ausreichend interpretieren. "Eingabefehler" oder einfach ein roter Rand um ein Feld transportieren nicht die nötige Information. Eine klare, verständliche Fehlerbeschreibung hilft allen Nutzern, besonders aber Menschen mit Barrieren, und senkt die Frustration deutlich.
Was hat das Success Criterium 3.3.3 - Error Suggestion mit dem BFSG zu tun?
Nach dem Barrierefreiheitsstärkungsgesetz (BFSG) sind digitale Angebote öffentlicher wie auch privater Unternehmen verpflichtet, den Web Content Accessibility Guidelines (WCAG) zu entsprechen. SC 3.3.3 ist eine der konkreten Anforderungen: Werden Fehlerhinweise nicht ausreichend beschrieben, gilt ein Formular als nicht barrierefrei – und damit ist diese Website nicht BFSG-konform. Gerade im Kontext rechtlich relevanter Formulare (z.B. Anträge, Bestellungen) ist die Umsetzung von 3.3.3 essenziell.
Lösungen für 3.3.3 - Error Suggestion anhand von Codebeispielen
Falscher Code
<form>
<label for="email">E-Mail:</label>
<input id="email" name="email" type="text">
<span class="error">Fehler!</span>
<button type="submit">Absenden</button>
</form>Korrekter Code
<form>
<label for="email">E-Mail:</label>
<input id="email" name="email" type="text">
<span class="error">Bitte geben Sie eine gültige E-Mail-Adresse ein (z. B. name@domain.de).</span>
<button type="submit">Absenden</button>
</form>Im schlechten Beispiel wird nur ein allgemeiner Fehler angezeigt, ohne konkrete Hilfestellung. Im guten Beispiel wird klar gemacht, **welcher** Fehler vorliegt (ungültige E-Mail-Adresse) und **wie** der Nutzer ihn behebt.
Falscher Code
<form>
<label for="password">Passwort:</label>
<input id="password" name="password" type="password">
<span class="error">Ungültig!</span>
<button type="submit">Einloggen</button>
</form>Korrekter Code
<form>
<label for="password">Passwort:</label>
<input id="password" name="password" type="password">
<span class="error">Ihr Passwort muss mindestens 8 Zeichen lang sein.</span>
<button type="submit">Einloggen</button>
</form>Das schlechte Beispiel nennt nicht den Grund, warum das Passwort ungültig ist. Das gute Beispiel erklärt die Anforderung an das Passwort deutlich. Das unterstützt alle Nutzer und macht den Fehler behebbar.
Wie löse ich Verstöße gegen das Success Criterium 3.3.3 - Error Suggestion?
Unser Accessibility Audit bietet Ihnen die Möglichkeit, mittels unseres AI-basierten Barrierefreiheits-Assistenten, vollautomatisch konkrete Lösungsvorschläge für Ihre Seite zu erstellen. Dafür scannen wir Ihre Website und ihren Quellcode, finden Problemstellen und zeigen Ihnen anhand Ihres eigenen Websitecode fertige Lösungen zum Kopieren und Einfügen. Starten Sie jetzt den Accessibility Audit kostenlos.