Barrierefreie Formulare – Eingabe für alle zugänglich gestalten
Formulare gehören zu den interaktivsten Elementen im Web – und gleichzeitig zu den größten Barrieren für viele Nutzer:innen mit Einschränkungen. Barrierefreie Formulare müssen nach WCAG-Richtlinien so gestaltet sein, dass sie tastaturbedienbar, screenreader-kompatibel und fehlerresistent sind.
WCAG-Anforderungen für Formulare
| Kriterium | Erklärung |
|---|---|
| Beschriftung (Labeling) | Jedes Eingabefeld braucht ein klar zugeordnetes <label> |
| Fokusreihenfolge | Logisch & linear – wie bei natürlichem Lesen |
| Fehlermeldungen | Müssen programmatisch erkennbar & verständlich sein |
| Validierung | Unterstützend, nicht behindernd – mit ARIA-Feedback |
| Tastaturbedienbarkeit | Alle Felder & Buttons müssen ohne Maus nutzbar sein |
Best Practices
- <label for=""> und id="" korrekt zuordnen
- Platzhalter (placeholder) nie als Ersatz für Labels verwenden
- Pflichtfelder kennzeichnen – mit Sternchen UND Beschreibung (nicht nur visuell)
- Fehlermeldungen sowohl visuell als auch mit aria-live zugänglich machen
- Gruppierung bei Radios/Checkboxen mit <fieldset> + <legend>
- Tab-Reihenfolge mit tabindex nicht manuell manipulieren
- Formulare mit echten Screenreadern testen (z. B. NVDA, VoiceOver)
Mehr zu unseren Leistungen im Bereich Digitale Barrierefreiheit erfahren Sie hier.