Forms
Checkliste
Barrierefreie Formulare
Bitte beachten Sie, dass die folgende Auflistung auf dem Dokument „Checkliste für barrierefreie Dokumente“ aufbaut.
Ein Formular ist barrierefrei, wenn:
- das Formular so benannt ist, dass der Inhalt klar ersichtlich ist.
- jedes Feld des Formulars eine Formularbeschriftung enthält, die (auch ohne den Kontext zu kennen) klar vermittelt, welche Informationen dort gefordert sind.
- jedes Feld einen Alternativtext enthält. Die Alternativtexte geben Informationen zum Ausfüllen des Feldes (bei Pflichtfeldern beispielsweise „Bitte ausfüllen“)
- Pflichtfelder besonders gekennzeichnet sind und dieses Kennzeichen zu Beginn des Formulars erläutert wurde.
- die Wichtigkeit der Felder von oben nach unten abnimmt.
- das Formular über die Tastatur zu bedienen ist.
- die Beschriftungen seitenübergreifend konsistent sind.
- jederzeit zu erkennen ist, an welcher Stelle des Formulars man sich befindet (Lesezeichen).
- zusätzlich zum Text allgemeinverständliche Symbole verwendet wurden.
- nach Absenden des Formulars Fehler deutlich gekennzeichnet werden (noch besser: Erklärung der Korrekturen für Fehlereingaben angezeigt werden).
- die Eingaben vor dem Abschicken nochmal überprüft werden können.
- das Formular auch nach dem Abschicken noch gelöscht (zurückgezogen) werden kann.
Info
Diese Übersicht ist nur eine visuelle Darstellung aller Form-Elemente. "Alle auf einen Blick"
Codebeispiele mit Detailinformationen befinden sich auf Seiten der einzelnen Elemente.
Input
Infotext
Sorry, that username's taken. Try another?
Infotext
Sorry, that username's taken. Try another?Textarea
Sie haben noch 200 Zeichen übrig
Sie haben noch 200 Zeichen übrig
Sorry, that username's taken. Try another?Select
Example invalid custom select feedback
Example invalid custom select feedback
Checkboxes
Checkboxes List (Fieldset)
Radios
Gib Lorem Ipsum ein
Radio List (Fieldset)
Radio Boxed (Fieldset) - deprecated
Radio Boxed ist Obsolet (deprecated)
Diese Komponente soll nicht eingesetzt werden, die wird aus den zukünftigen Version entfern!
Toggle
Auswahl erforderlich
Toggle List (Fieldset)
Container
Ohne Fehlermeldungen
Mit Fehlermeldung
Eine Fehlermeldung
Eine Fehlermeldung