Prüfpunkt 3.3.1Stufe AFehler, Bestätigung und Anmeldung
Wie zeigt eine Website Formularfehler richtig an?
Eine Website zeigt Formularfehler richtig an, indem sie das betroffene Feld benennt und den Fehler in Worten beschreibt: „Bitte geben Sie Ihre E-Mail-Adresse ein.“ Ein roter Rahmen allein reicht nicht — blinde Besucher sehen ihn nicht, farbenblinde Besucher übersehen ihn. Das WCAG-Kriterium 3.3.1 verlangt, dass erkannte Eingabefehler automatisch entdeckt und dem Besucher in Textform mitgeteilt werden.
Ein roter Rahmen allein lässt Besucher raten
Stellen Sie sich vor, Ihr Kontaktformular kommt mit der Meldung „Bitte prüfen Sie Ihre Eingaben“ zurück — mehr steht da nicht. Ein sehender Besucher sucht nun nach roten Rahmen. Ein blinder Besucher hat auch diese Chance nicht: Sein Vorleseprogramm liest Texte vor, keine Farben. Er geht Feld für Feld erneut durch und rät, wo das Problem liegt. Viele geben an dieser Stelle auf — und Sie verlieren eine Anfrage oder eine Bestellung. Eine gute Fehlermeldung nennt drei Dinge: welches Feld betroffen ist, was daran fehlerhaft ist und im besten Fall, wie es richtig aussieht. Zusätzlich muss die Meldung technisch mit dem Feld verknüpft sein, damit Vorleseprogramme sie am Feld selbst ansagen.
So misst der Prüfservice die Fehlererkennung
Der Prüfservice testet Ihr Formular in einem echten Browser mit einem kontrollierten Versuch: Er sucht ein Formular mit Pflichtfeldern und sendet es bewusst leer ab. Dann beobachtet er die Reaktion. Werden die Pflichtfelder als fehlerhaft gekennzeichnet und ist die Fehlerbeschreibung technisch mit den Feldern verknüpft, gilt das Kriterium als bestanden — der Bericht vermerkt, wie viele Felder korrekt benannt wurden. Reine Suchleisten und Formulare ohne Pflichtfelder lässt die Messung mit Absicht aus, um auf Ihrer Website nichts Ungewolltes auszulösen; solche Fälle weist der Bericht offen als manuellen Prüfpunkt aus. Beim Gold-Standard prüft ein Mensch zusätzlich, ob die Fehlertexte verständlich formuliert sind.
Beispiele
Fehler ohne Ort und Text
<p class="rot">Bitte Eingaben prüfen.</p>
<input name="iban"><label for="iban">IBAN</label>
<input id="iban" name="iban" aria-invalid="true" aria-describedby="iban-fehler">
<p id="iban-fehler">IBAN: 20 Zeichen erwartet, 18 eingegeben.</p>Die Meldung nennt das Feld und den Fehler und ist mit dem Feld verbunden, damit das Vorleseprogramm sie beim Feld ansagt.
So gehen Sie es an
- Senden Sie Ihr Kontaktformular einmal bewusst leer ab und lesen Sie die Fehlermeldung mit den Augen eines Fremden.
- Formulieren Sie jede Fehlermeldung nach dem Muster: Feldname, Problem, Lösung — „E-Mail-Adresse: Bitte geben Sie eine Adresse mit @-Zeichen ein.“
- Bitten Sie Ihre Agentur, Fehlermeldungen technisch mit dem jeweiligen Feld zu verknüpfen, damit Vorleseprogramme sie ansagen.
- Verlassen Sie sich nie auf Farbe allein — jeder rote Rahmen braucht einen erklärenden Text daneben.
Weiter im Prüfbereich Barrierefreiheit
- Warum braucht jedes Formularfeld eine Beschriftung?Jedes Eingabefeld braucht eine dauerhaft sichtbare, technisch verknüpfte Beschriftung. So prüfen wir WCAG-Kriterium 3.3.2 automatisch.
- Wie hilft ein Formular bei falschen Eingaben weiter?Ein gutes Formular benennt den Fehler und schlägt die Korrektur vor, etwa das richtige Datumsformat. Das verlangt WCAG-Kriterium 3.3.3.
- Wie schützt eine Website Kunden vor teuren Eingabefehlern?Vor rechtlich oder finanziell bindenden Schritten braucht es Prüfen, Bestätigen oder Widerrufen. Das verlangt WCAG-Kriterium 3.3.4.
- Warum müssen Kunden ihre Angaben nur einmal eintragen?Bereits eingegebene Angaben müssen im selben Vorgang übernehmbar sein — etwa die Lieferadresse als Rechnungsadresse. Das verlangt WCAG-Kriterium 3.3.7.
Dieser Prüfpunkt gehört zum Prüfbereich Barrierefreiheit; dort stehen alle Prüfpunkte im Überblick. Was die Prüfung insgesamt leistet, zeigt die Leistungsseite; wie ein Ergebnis zustande kommt, erklärt das Prüfverfahren. Alle Prüfbereiche im Überblick: Wissensbasis.
Foto: Bench Accounting, CC0
.jpg){kind=link}