Synonyme: Erforderliche Formularfelder, Pflichteingabe, Required
Siehe auch: Fehlermeldung, Beschriftung, Elementstatus
Eine Pflichtfeldkennzeichnung ist ein visueller Indikator für Formularfelder, die ausgefüllt werden müssen. So kann z. B. mit einem Stern (*) beim Formularfeld darauf hingewiesen werden, dass ein Feld ausgefüllt werden muss.
Darstellung
Permalink zu "Darstellung"| Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
|---|---|---|---|---|
| 198 | Darstellung | Pflichtfelder müssen visuell wahrnehmbar sein. Hinweis 1: Anstelle der Pflichtfelder können auch die optionalen Felder gekennzeichnet werden. Hinweis 2: Wenn aus dem Kontext die Pflichtfelder auch ohne Kennzeichnung erkennbar sind (z. B. auf einer Loginseite mit zwei Eingabefeldern für Username und Passwort), dann kann die Pflichtfeldkennzeichnung unterbleiben. Hinweis 3: Pflichtfelder sollen in der Anwendung konsistent gekennzeichnet sein. Hinweis 4: Bei Gruppen von Radiobuttons und Checkboxen soll die Pflichtfeldkennzeichnung bei der Beschriftung der Gruppe stehen, sofern ein beliebiges Element der Gruppe ausgewählt werden muss. | Muss | EN 301 549: 9.3.3.2, 11.3.3.2 |
| 199 | Kontrast | Eine Pflichtfeldkennzeichnung in grafischer Form muss zum Hintergrund ein Kontrastverhältnis von mindestens 3:1 aufweisen. Eine Pflichtfeldkennzeichnung in Textform muss zum Hintergrund ein Kontrastverhältnis von mindestens 4,5:1 aufweisen. | Muss | EN 301 549: 9.1.4.3, 11.1.4.3, 9.1.4.11, 11.1.4.11 |
| 200 | Farbe | Pflichtfelder dürfen nicht ausschließlich über Farbe (z. B. eine abweichende Rahmenfarbe) gekennzeichnet sein. Hinweis: Farbe kann als zusätzliches Mittel der Pflichtfeldkennzeichnung verwendet werden. | Muss | EN 301 549: 9.1.4.1, 11.1.4.1 |
Programmierung/Schnittstellen
Permalink zu "Programmierung/Schnittstellen"| Nr. | Eigenschaft | Beschreibung | Klassifizierung | Referenz |
|---|---|---|---|---|
| 201 | Status | Der Status Pflichtfeld muss an die Accessibility API übermittelt werden (siehe Accessibility API). Hinweis 1: Die programmatische Pflichtfeldkennzeichnung soll über ein dafür vorgesehenes Attribut der Programmiersprache oder über den textlichen Zusatz im Accessible Name des Formularfeldes (z. B. den Stern) erfolgen. Die redundante programmatische Auszeichnung der Pflichtfelder per Attribut und Zusatz im Accessible Name Beschriftung soll vermieden werden. Hinweis 2: Ist das Ausfüllen einer Formularfeldgruppe als verpflichtend gekennzeichnet, ohne dass jedes Feld der Gruppe ausgefüllt werden muss, soll die programmatische Pflichtfeldkennzeichnung nur bei der Gruppe und nicht bei jedem Feld erfolgen. In diesem Fall ist darauf zu achten, dass die Pflichtfeldkennzeichnung der Gruppe korrekt an die Accessibility API übermittelt. | Muss | EN 301 549: 9.1.3.1, 11.1.3.1, 9.3.3.2, 11.3.3.2, 9.4.1.2, 11.4.1.2 |
Praxistipp Pflichtfeldkennzeichnung
Permalink zu "Praxistipp Pflichtfeldkennzeichnung"Pflichtfelder können mit einem entsprechenden textlichen Zusatz, wie z. B. „Pflichtfeld“ oder „erforderlich“ gekennzeichnet werden. Wenn die Mehrzahl der Felder Pflichtfelder sind, können alternativ auch die Felder, die nicht ausgefüllt werden müssen, gekennzeichnet werden, z. B. mit „optional“.
Die Pflichtfelder können auch mit einem Symbol gekennzeichnet werden. Etabliert hat sich dafür der Stern („*“), bei dem zumindest bei Fachanwendungen davon ausgegangen werden kann, dass er allen Nutzenden bekannt ist. Wird ein anderes Zeichen verwendet, so sollte dessen Bedeutung am Formularbeginn erläutert werden.
Praxistipp programmatische Kennzeichnung von Pflichtfeldern in Web-Anwendungen
Permalink zu "Praxistipp programmatische Kennzeichnung von Pflichtfeldern in Web-Anwendungen"Screenreader-Ausgabe
Permalink zu "Screenreader-Ausgabe"- JAWS: erforderlich ungültiger Eintrag | erforderlich [nach der Rolle und vor dem Wert]
- NVDA: erforderlich ungültiger Eintrag | erforderlich [nach der Rolle und vor dem Wert]
- Windows Sprachausgabe: erforderlich ungültig | erforderlich [nach dem Wert]
Hinweis: Ein nicht-ausgefülltes Pflichtfeld, welches mit required ausgezeichnet wurde, befindet sich aufgrund der HTML-Spezifikation im Status fehlerhaft und wird deshalb von den Screenreadern als „ungültiger Eintrag“ bzw. „ungültig“ ausgegeben. Das Problem tritt bei Verwendung von aria-required nicht auf.
Pflichtfelder können mit dem required-Attribut ausgezeichnet werden.
- Formularfelder, die mit
requiredausgezeichnet wurden, werden automatisch durch den Browser validiert und befinden sich im fehlerhaften Zustand, wenn sie nicht ausgefüllt wurden. - Formularfelder, die mit
requiredausgezeichnet wurden, sind visuell nicht automatisch als Pflichtfelder erkennbar. Sie besitzen allerdings einen Tooltip (z. B. „Bitte füllen Sie dieses Feld aus“), der jedoch für Tastaturnutzende und mit dem Screenreader nicht wahrnehmbar ist, da er nur beim Mouseover eingeblendet wird. - Ein Formular mit nicht ausgefüllten Pflichtfeldern kann standardmäßig nicht abgesendet werden. Stattdessen wird der Fokus in das erste fehlerhafte Feld gesetzt und der Tooltip als Fehlermeldung eingeblendet und vom Screenreader als Warnmeldung ausgegeben (analog zu
role=alert). Diese Fehlermeldungen sind aus folgenden Gründen nicht barrierefrei:- Beim Verlassen des Feldes wird die Fehlermeldung automatisch ausgeblendet und kann nicht erneut eingeblendet werden.
- Bei vielen Browsern werden die Fehlermeldungen nach wenigen Sekunden automatisch ausgeblendet, selbst wenn der Fokus im Feld verbleibt (z. B. bei Chrome und Edge).
- Die Fehlermeldung wird nur beim ersten fehlerhaften Feld angezeigt. Weitere nicht ausgefüllte Pflichtfelder sind nicht als fehlerhaft zu erkennen.
Deshalb sollte bei Verwendung von required Folgendes beachtet werden:
- Die Pflichtfelder müssen auch visuell als solche gekennzeichnet werden.
- Die visuelle Pflichtfeldkennzeichnung sollte so ausgezeichnet werden, dass sie nicht vom Screenreader ausgegeben wird, um die redundante Ausgabe zu vermeiden.
- Die Anwendung sollte eigene Fehlermeldungen bei allen nicht ausgefüllten Pflichtfeldern dauerhaft anzeigen.
Hinweis: Im Praxistipp zu Radiobuttons und Checkboxen sind Besonderheiten bezüglich deren Auszeichnung als Pflichtfelder erläutert.
Weitere Informationen 4.10.5.3.4 The required attribute - HTML Standard (whatwg.org)
Pflichtfelder können mit dem Attribut aria-required=true ausgezeichnet werden.
- Formularfelder, die mit
aria-required=trueausgezeichnet wurden, werden nicht automatisch durch den Browser validiert und befinden sich nicht im fehlerhaften Zustand, wenn sie nicht ausgefüllt wurden. Der fehlerhafte Zustand kann mitaria-invalid=trueübermittelt werden. - Formularfelder, die mit
aria-required=trueausgezeichnet wurden, sind visuell nicht automatisch als Pflichtfelder erkennbar.
Weitere Informationen: aria-required property - Accessible Rich Internet Applications (WAI-ARIA) 1.2 (w3.org) (Externer Link)