Bedienoberflächen
Teil von Bedienoberflächen gestalten mit Designsystem, Barrierefreiheit und Tests
Bedienoberflächen gestalten: Wie Sie Barrierefreiheit nach BITV prüfen
Barrierefreiheit von Bedienoberflächen nach BITV 2.0 prüfen: Prüfschritte, WCAG-2.2-Kriterien, Kontrastwerte, Screenreader-Tests und zuständige Anlaufstellen.
Das Wichtigste auf einen Blick
- Die BITV 2.0 bindet öffentliche Stellen des Bundes. Anlage 1 verweist auf die Norm EN 301 549 und damit auf die Erfolgskriterien der WCAG in Konformitätsstufe AA.
BITV-Prüfung in Zahlen
- 4,5 zu 1Kontrast für Text
- 3 zu 1Kontrast für großen Text
- 3 zu 1Kontrast für Symbole und Fokus
- 3Prüfstufen automatisiert, manuell, Screenreader
Rechtlicher Rahmen: BITV 2.0, EN 301 549 und WCAG 2.2
Die Barrierefreie-Informationstechnik-Verordnung 2.0 gilt für öffentliche Stellen des Bundes, also für Behörden, Gerichte und sonstige Einrichtungen der Bundesverwaltung. Anlage 1 verweist auf die harmonisierte Norm EN 301 549, die die Erfolgskriterien der WCAG in Stufe AA übernimmt. Maßgeblich ist derzeit WCAG 2.1. WCAG 2.2 sollte zusätzlich geprüft werden, weil sie Anforderungen an Zielgrößen und Anmeldeverfahren verschärft.
Für Länder und Kommunen gelten eigene Regelungen, etwa Landesgleichstellungsgesetze oder kommunale Vorgaben. Klären Sie zuerst, welche Norm für Ihre Stelle verbindlich ist.
Auf EU-Ebene verlangt die Richtlinie (EU) 2016/2102 barrierefreie Webangebote öffentlicher Stellen. Der European Accessibility Act, in Deutschland durch das Barrierefreiheitsstärkungsgesetz umgesetzt, greift seit dem 28. Juni 2025 auch für viele Produkte und Dienstleistungen privater Anbieter.
Fünf Prüfschritte für Bedienoberflächen
- Anwendungsbereich festlegenWelche Masken, Dialoge und Widgets sind öffentlich zugänglich, welche fallen unter Ausnahmen?
- Automatisiert vorprüfenKontrastwerte, Alternativtexte, Rollen, Formularbeschriftungen und Sprachauszeichnung messen.
- Manuell nachprüfenBedienung nur per Tastatur, Fokusreihenfolge, sichtbarer Fokus, Zoom auf 200 Prozent, Reflow bei 320 CSS-Pixeln.
- Mit Screenreader testenNVDA unter Windows, VoiceOver unter macOS und iOS, JAWS im Behördenumfeld. Fehlermeldungen und Statusmeldungen anhören.
- Dokumentierenjeden Befund dem Erfolgskriterium zuordnen, Fristen setzen, Nachprüfung terminieren.
Ordnen Sie Befunde nach Erfolgskriterien, etwa 1.4.3 für Kontrast, 2.1.1 für Tastaturbedienung und 4.1.2 für Name, Rolle und Wert. So bleibt nachvollziehbar, welche Anforderung erfüllt ist.
Fünf Prüfschritte für Bedienoberflächen
- Anwendungsbereich festlegen
- Automatisiert vorprüfen
- Manuell nachprüfen
- Mit Screenreader testen
- Befunde dokumentieren
Kontrastwerte und Zielgrößen
| Element | Mindestwert | Kriterium |
|---|---|---|
| Text unter 18 Punkt, fett unter 14 Punkt | 4,5 zu 1 | WCAG 1.4.3 |
| Großer Text ab 18 Punkt oder 14 Punkt fett | 3 zu 1 | WCAG 1.4.3 |
| Symbole, Rahmen, Fokusrahmen, Eingabefelder | 3 zu 1 | WCAG 1.4.11 |
| Zeigerziele | 24 mal 24 CSS-Pixel | WCAG 2.5.8 |
Der Kontrastwert allein genügt nicht. WCAG 2.2 verlangt in 2.4.11, dass eingeblendete Elemente den Fokus nicht verdecken. Nach 2.5.7 muss jede Ziehbewegung eine Alternative haben, etwa eine Schaltfläche zum Sortieren.
Tests mit Screenreadern und Tastatur
Prüfen Sie jede Ansicht ohne Maus. Die Tabulatortaste führt durch die Reihenfolge, Enter und Leertaste lösen Schaltflächen aus, Pfeiltasten steuern Registerkarten und Auswahllisten. Der Fokus muss sichtbar bleiben und darf nicht in versteckte Bereiche springen. Modale Dialoge fangen den Fokus und geben ihn beim Schließen zurück.
Für Screenreader-Tests eignen sich NVDA unter Windows und VoiceOver unter macOS. Achten Sie auf die Sprachauszeichnung, damit die Ausgabe deutsch klingt. Formularfehler müssen angesagt werden, Statusänderungen laufen über Live-Regionen. Testen Sie mindestens zwei Kombinationen aus Browser und Screenreader.
Werkzeuge für die Vorprüfung
Für die Vorprüfung genügen verbreitete Werkzeuge: axe DevTools, WAVE, Lighthouse und der Colour Contrast Analyser. Sie liefern Messwerte für Kontrast, Rollen und Beschriftungen. Ein etabliertes Verfahren für vollständige Prüfungen ist der BITV-Test mit dokumentierten Prüfschritten.
Dokumentation, Erklärung zur Barrierefreiheit und Anlaufstellen
Öffentliche Stellen des Bundes veröffentlichen eine Erklärung zur Barrierefreiheit. Das Muster gibt der Durchführungsbeschluss (EU) 2018/1523 vor. Die Erklärung benennt den Stand der Vereinbarkeit, nicht barrierefreie Inhalte, einen Feedbackweg und die zuständige Durchsetzungsstelle.
Die Bundesfachstelle Barrierefreiheit berät öffentliche Stellen des Bundes zur BITV und zum Barrierefreiheitsstärkungsgesetz. Bei Beschwerden über Bundesangebote greift ein Durchsetzungsverfahren.
Beauftragen Sie externe Prüfungen, halten Sie Leistungsumfang, Prüfverfahren und Abnahme schriftlich fest. Worauf es dabei ankommt, erläutert der Ratgeber zum Vertragsrecht der IHK München. Screenshots fremder Oberflächen dürfen Prüfberichte nur im Rahmen des Zitatrechts nach § 51 UrhG enthalten.
Häufige Fragen
Gilt die BITV 2.0 auch für Kommunen?
Nein. Die Verordnung bindet den Bund. Länder und Kommunen regeln die Barrierefreiheit über eigene Vorschriften, orientieren sich in der Praxis aber meist an BITV und WCAG.
Reicht ein automatisierter Test?
Nein. Werkzeuge wie axe oder Lighthouse finden nur einen Teil der Verstöße. Tastaturführung, Fokusverlauf, Verständlichkeit und Screenreader-Ausgabe erfordern manuelle Prüfungen.
Welcher Kontrastwert gilt für Schaltflächen?
Der Text im Beschriftungsfeld braucht 4,5 zu 1. Rahmen, Symbole und der Fokusrahmen benötigen mindestens 3 zu 1 nach WCAG 1.4.11.
Wie viele Screenreader muss ich testen?
Mindestens zwei Kombinationen, etwa NVDA mit Firefox unter Windows und VoiceOver mit Safari unter macOS. So decken Sie unterschiedliche Ausgabemuster ab.
Wo finde ich Beratung?
Die Bundesfachstelle Barrierefreiheit berät Bundesstellen; zum Barrierefreiheitsstärkungsgesetz informiert das Bundesministerium für Arbeit und Soziales.
