BFSG Checkliste: Ist Ihre Website barrierefrei?
Das Barrierefreiheitsstärkungsgesetz (BFSG) ist seit dem 28. Juni 2025 in Kraft. Online-Shops und viele digitale Dienstleistungen müssen nun barrierefrei sein. Mit dieser Checkliste prüfst du, ob deine Website die wichtigsten Anforderungen erfüllt.
Wer ist vom BFSG betroffen?
Definitiv betroffen:
- Online-Shops (E-Commerce)
- Banking und Finanzdienstleistungen
- E-Books und E-Reader
- Ticketbuchungssysteme
Nicht betroffen (Ausnahme):
- Kleinstunternehmen: Unter 10 Mitarbeiter UND unter 2 Mio. Euro Umsatz
- Aber: Die Ausnahme gilt NICHT, wenn du digitale Dienstleistungen anbietest!
Unklar/Grauzone:
- Unternehmenswebsites ohne Transaktionen
- Dienstleister-Websites mit Kontaktformular
Empfehlung: Auch wenn du nicht sicher betroffen bist – Barrierefreiheit verbessert SEO und Usability für alle.
Die BFSG Checkliste
1. Wahrnehmbarkeit
Inhalte müssen für alle wahrnehmbar sein – auch für Menschen mit Sehbehinderung.
Texte und Kontraste
- [ ] Farbkontrast mindestens 4,5:1 für normalen Text
- [ ] Farbkontrast mindestens 3:1 für großen Text (ab 18pt oder 14pt fett)
- [ ] Farbkontrast mindestens 3:1 für UI-Elemente und Grafiken
- [ ] Informationen nicht nur durch Farbe vermittelt (z.B. Rot für Fehler + Icon/Text)
Testen mit:WebAIM Contrast Checker
Bilder und Medien
- [ ] Alt-Texte für alle informativen Bilder
- [ ] Alt-Text leer (alt="") für dekorative Bilder
- [ ] Videos mit Untertiteln (wenn Sprache enthalten)
- [ ] Audiodeskription für wichtige visuelle Inhalte in Videos
- [ ] Transkripte für Podcasts und Audio-Inhalte
Struktur
- [ ] Dokumentsprache definiert (
<html lang="de">) - [ ] Seitentitel aussagekräftig (
<title>) - [ ] Eine H1 pro Seite mit dem Hauptthema
- [ ] Überschriften-Hierarchie logisch (H1 → H2 → H3, keine Sprünge)
- [ ] Listen als Listen markiert (
<ul>,<ol>) - [ ] Tabellen mit Kopfzeilen (
<th>) und Scope-Attribut
2. Bedienbarkeit
Die Website muss mit verschiedenen Eingabemethoden nutzbar sein.
Tastaturnavigation
- [ ] Alle Funktionen per Tastatur erreichbar
- [ ] Fokus-Reihenfolge logisch (Tab-Reihenfolge folgt visuellem Layout)
- [ ] Fokus-Indikator sichtbar (Outline bei fokussierten Elementen)
- [ ] Keine Tastaturfallen (man kommt mit Tab auch wieder raus)
- [ ] Skip-Link vorhanden ("Zum Inhalt springen")
Testen: Tab durch die ganze Seite drücken. Kommst du überall hin?
Links und Buttons
- [ ] Linktexte aussagekräftig (nicht "hier klicken", sondern "Zum Kontaktformular")
- [ ] Links von umliegendem Text unterscheidbar (nicht nur Farbe)
- [ ] Buttons als Buttons erkennbar
- [ ] Touch-Ziele mindestens 44x44 Pixel
Zeit und Bewegung
- [ ] Keine automatischen Zeitlimits (oder verlängerbar)
- [ ] Bewegte Inhalte pausierbar (Slider, Animationen)
- [ ] Keine Inhalte, die mehr als 3x pro Sekunde blinken
3. Verständlichkeit
Inhalte müssen klar und vorhersehbar sein.
Sprache und Text
- [ ] Einfache, klare Sprache
- [ ] Fachbegriffe erklärt (oder Glossar)
- [ ] Abkürzungen beim ersten Auftreten ausgeschrieben
- [ ] Lesbare Schriftgröße (mindestens 16px für Fließtext)
Navigation
- [ ] Konsistente Navigation auf allen Seiten
- [ ] Mehrere Wege zum Ziel (Navigation, Suche, Sitemap)
- [ ] Aktuelle Position erkennbar (Breadcrumbs, markierter Menüpunkt)
Formulare
- [ ] Alle Felder haben Labels
- [ ] Labels sind sichtbar (nicht nur Placeholder)
- [ ] Pflichtfelder markiert
- [ ] Fehlermeldungen konkret (was ist falsch, wie korrigieren)
- [ ] Fehlerfelder visuell hervorgehoben
- [ ] Bestätigungsseite bei Formularen
4. Robustheit
Die Website muss mit verschiedenen Technologien funktionieren.
Code-Qualität
- [ ] Valides HTML (keine Syntaxfehler)
- [ ] Eindeutige IDs (jede ID nur einmal)
- [ ] ARIA-Labels korrekt (wenn verwendet)
- [ ] Semantisches HTML (nav, main, article, aside, footer)
Screenreader-Kompatibilität
- [ ] Seite mit Screenreader testbar
- [ ] Dynamische Inhalte werden angekündigt (ARIA-Live-Regions)
- [ ] Formulare funktionieren mit Screenreader
Testen mit: NVDA (Windows, kostenlos), VoiceOver (Mac, eingebaut)
Schnelltest: Die wichtigsten Punkte
Keine Zeit für die komplette Checkliste? Diese 10 Punkte sind am wichtigsten:
| # | Prüfpunkt | Wie testen |
|---|---|---|
| 1 | Kontraste ausreichend | Contrast Checker |
| 2 | Alle Bilder haben Alt-Texte | Browser Dev Tools |
| 3 | Überschriften-Hierarchie stimmt | WAVE Tool |
| 4 | Komplett per Tastatur bedienbar | Tab-Test |
| 5 | Fokus ist sichtbar | Tab-Test |
| 6 | Formulare haben Labels | Visuell + Code prüfen |
| 7 | Fehlermeldungen sind hilfreich | Formular absichtlich falsch ausfüllen |
| 8 | Links sind verständlich | Durchlesen |
| 9 | Dokumentsprache gesetzt | Quellcode prüfen |
| 10 | Seite funktioniert mit Screenreader | NVDA/VoiceOver testen |
Kostenlose Test-Tools
| Tool | Was es prüft | Link |
|---|---|---|
| WAVE | Umfassende Accessibility-Analyse | wave.webaim.org |
| axe DevTools | Browser-Extension, detaillierte Analyse | deque.com/axe |
| Lighthouse | Performance + Accessibility (in Chrome eingebaut) | F12 → Lighthouse |
| Contrast Checker | Farbkontraste prüfen | webaim.org |
| HeadingsMap | Überschriften-Struktur visualisieren | Browser-Extension |
Wichtig: Automatische Tools finden nur ca. 30% der Probleme. Manuelle Tests sind unverzichtbar!
Was tun bei Verstößen?
Verstöße gegen das BFSG können Folgen haben:
- Bußgelder bis 100.000€ bei schweren Verstößen
- Abmahnungen durch Wettbewerber oder Verbraucherschutz
- Reputationsschaden in der Öffentlichkeit
Prioritäten setzen
Nicht alles ist gleich kritisch. Fokus auf:
- Kritisch: Tastaturzugänglichkeit, Alt-Texte, Formulare
- Wichtig: Kontraste, Überschriften, Linktexte
- Sollte: Videos, Dokumente, erweiterte ARIA
Barrierefreiheitserklärung
Das BFSG verlangt eine Barrierefreiheitserklärung auf deiner Website. Sie muss enthalten:
- Erklärung zur Barrierefreiheit
- Bekannte Einschränkungen
- Feedback-Mechanismus
- Kontaktmöglichkeit
- Datum der letzten Prüfung
Tipp: Die Erklärung sollte ehrlich sein. Besser "teilweise konform mit bekannten Einschränkungen" als falsche Behauptungen.
Nächste Schritte
Selbst umsetzen
- Diese Checkliste durchgehen
- Probleme priorisieren
- Nach und nach beheben
- Regelmäßig testen (auch nach Updates!)
Professionelle Hilfe
Wir bieten:
- BFSG-Audit – Vollständige Prüfung mit Maßnahmenplan
- Umsetzung – Wir beheben die Probleme
- Monitoring – Laufende Überwachung im Wartungsvertrag
Fazit
Barrierefreiheit ist kein Hexenwerk, aber auch keine Kleinigkeit. Diese Checkliste hilft dir beim Einstieg – für eine vollständige WCAG 2.1 AA Konformität ist jedoch oft professionelle Unterstützung sinnvoll.
Der Aufwand lohnt sich: Barrierefreie Websites sind nicht nur rechtssicher, sondern auch benutzerfreundlicher, SEO-optimierter und zukunftssicher.
Du möchtest wissen, wie barrierefrei deine Website wirklich ist? Wir machen einen kostenlosen Schnell-Check.