WCAG 2.1 - 1.3.5
Identify Input Purpose
Der Zweck jedes Eingabefelds, das Informationen über den Benutzer sammelt, kann programmgesteuert bestimmt werden, wenn:
Inhalt
Was steht in den Guidelines zum Success Criterium 1.3.5 - Identify Input Purpose?Was Bedeutet das Success Criterium 1.3.5 - Identify Input Purpose?Warum ist es so wichtig, das Success Criterium 1.3.5 - Identify Input Purpose zu beachten?Was hat das Success Criterium 1.3.5 - Identify Input Purpose mit dem BFSG zu tun?Lösungen für 1.3.5 - Identify Input Purpose anhand von CodebeispielenWie löse ich Verstöße gegen das Success Criterium 1.3.5 - Identify Input Purpose?Was steht in den Guidelines zum Success Criterium 1.3.5 - Identify Input Purpose?
Implementationshinweise
- Das Eingabefeld dient einem Zweck, der im Abschnitt Eingabewünsche für Benutzeroberflächenkomponenten identifiziert ist; und
- Der Inhalt wird mit Technologien umgesetzt, die die Identifizierung der erwarteten Bedeutung für Formulareingabedaten unterstützen.
Was Bedeutet das Success Criterium 1.3.5 - Identify Input Purpose?
Das Kriterium "Identify Input Purpose" fordert, dass bei Eingabefeldern auf Webseiten der jeweilige Zweck des Feldes programmatisch (also im Code) erkennbar gemacht wird. Das bedeutet: Wenn Sie z.B. ein Eingabefeld für den Vornamen oder die E-Mail-Adresse eines Nutzers anbieten, soll der Code dies so kennzeichnen, dass unterstützende Technologien diesen Zweck erkennen. Das betrifft typischerweise Formulare mit häufig genutzten Informationen (z.B. Kontaktformulare, Registrierungen oder Bestellprozesse).
Dazu werden speziell die sogenannten "autocomplete"-Attribute genutzt, beispielsweise <input autocomplete="given-name"> für das Feld "Vorname".
Das Prinzip: Jede Felder, für die die WCAG passende "Zwecke" vorschlägt (wie Name, E-Mail, Telefonnummer, Adresse etc.), müssen technisch entsprechend gekennzeichnet werden. Diese Information wird dann von Browsern oder Hilfsmitteln, wie Passwortmanagern und Screenreadern, genutzt.
Umsetzung in der Praxis
- Nutzen Sie für die gängigsten personenbezogenen Felder das "autocomplete"-Attribut mit den von der Spezifikation vorgesehenen Werten.
- Die Beschriftung des Eingabefelds im sichtbaren Bereich (Label) sollte zum gewählten Autocomplete-Wert passen.
Warum ist es so wichtig, das Success Criterium 1.3.5 - Identify Input Purpose zu beachten?
Viele Menschen mit Behinderung (z. B. blinde Menschen oder Menschen mit motorischen Beeinträchtigungen) sind beim Ausfüllen von Formularen auf Unterstützung angewiesen. Assistierende Technologien wie Screenreader oder Passwortmanager können Eingabefelder nur dann sinnvoll erkennen bzw. vorbefüllen, wenn sie den Zweck des Feldes kennen. Wird das Kriterium nicht erfüllt, sind Nutzer:innen gezwungen, jedes Feld manuell zu überprüfen und auszufüllen, was die Benutzung erheblich erschwert oder sogar verhindert.
Was hat das Success Criterium 1.3.5 - Identify Input Purpose mit dem BFSG zu tun?
Das Barrierefreiheitsstärkungsgesetz (BFSG) in Deutschland setzt die europäische Richtlinie zur Barrierefreiheit (EAA) um. Für Selbstbedienungsterminals und Web-Angebote, die vom BFSG betroffen sind, ist die Einhaltung der WCAG 2.1 auf Level AA verpflichtend. Da 1.3.5 ein Kriterium auf AA-Level ist, ist dessen Einhaltung zwingend erforderlich. Wer das Kriterium nicht erfüllt, riskiert, dass größere Personengruppen vom Zugang ausgeschlossen werden und damit einen klaren Verstoß gegen das BFSG sowie drohende Abmahnungen und Bußgelder.
Lösungen für 1.3.5 - Identify Input Purpose anhand von Codebeispielen
Falscher Code
<label for="name">Vorname</label>
<input id="name" name="name" type="text">Korrekter Code
<label for="given-name">Vorname</label>
<input id="given-name" name="given-name" type="text" autocomplete="given-name">Im schlechten Beispiel fehlt das "autocomplete"-Attribut. Im guten Beispiel ist das Feld durch "autocomplete=\"given-name\"" als Eingabe für den Vornamen gekennzeichnet, was unterstützenden Technologien hilft, das Feld korrekt zu interpretieren und ggf. automatisch auszufüllen.
Falscher Code
<label for="email">E-Mail</label>
<input id="email" name="email">Korrekter Code
<label for="email">E-Mail</label>
<input id="email" name="email" type="email" autocomplete="email">Im schlechten Beispiel fehlt der Feldzweck. Das gute Beispiel nutzt den HTML5-Typ "email" und gibt explizit "autocomplete=\"email\"" an. Das unterstützt u.a. Screenreader und Passwortmanager.
Wie löse ich Verstöße gegen das Success Criterium 1.3.5 - Identify Input Purpose?
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.