Seit dem 28. Juni 2025 ist das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft — und damit die Pflicht zur digitalen Barrierefreiheit für Online-Shops und Dienstleistungswebsites. Eine Website testen Sie auf zwei Ebenen: automatisiert mit Tools wie Lighthouse, WAVE oder axe (erkennt ca. 30–40 % der Barrieren) und manuell für Tastaturnavigation, Alternativtexte und Lesereihenfolge. Maßstab ist die WCAG 2.1 Level AA. In diesem Ratgeber finden Sie eine vollständige Checkliste mit 15 Prüfpunkten, empfohlene kostenfreie Tools und die häufigsten Fehler.
1. Warum Barrierefreiheit testen?
In Deutschland leben rund 10 Millionen Menschen mit einer Behinderung — viele davon nutzen das Internet täglich. Dazu kommen Millionen älterer Menschen mit nachlassender Sehkraft, motorischen Einschränkungen oder kognitiven Herausforderungen. Eine barrierefreie Website erreicht diese Zielgruppe — und verbessert nebenbei die Nutzererfahrung für alle.
Rechtliche Pflicht seit Juni 2025
Das BFSG (Barrierefreiheitsstärkungsgesetz) verpflichtet Online-Shops und Dienstleistungswebsites zur digitalen Barrierefreiheit. Bei Verstößen drohen Bußgelder bis zu 100.000 € und Abmahnungen. Die EN 301 549 verweist auf WCAG 2.1 Level AA als Mindeststandard.
2. WCAG 2.1 kurz erklärt
Die Web Content Accessibility Guidelines (WCAG) sind der internationale Standard für barrierefreie Webinhalte. Sie basieren auf vier Prinzipien:
Wahrnehmbar
Inhalte müssen für alle Sinne verfügbar sein (Alternativtexte, Untertitel, Kontraste).
Bedienbar
Navigation muss per Tastatur und assistiven Technologien möglich sein.
Verständlich
Inhalte und Bedienung müssen logisch und vorhersehbar sein.
Robust
Inhalte müssen mit verschiedenen Browsern und Hilfsmitteln funktionieren.
Die WCAG kennt drei Konformitätsstufen. Welches Level für Sie Pflicht ist, regelt das BFSG:
| Level | Anforderung | Pflicht (BFSG)? |
|---|---|---|
| A (Minimum) | Grundlegende Barrierefreiheit | Ja |
| AA (Standard) | Erweiterte Barrierefreiheit — der gesetzliche Standard | Ja |
| AAA (Optimal) | Höchste Barrierefreiheit — optional | Nein (empfohlen) |
3. Die Checkliste: 15 Prüfpunkte für Ihre Website
Arbeiten Sie diese 15 Punkte der Reihe nach ab. Jeder verweist auf das zugehörige WCAG-Erfolgskriterium — so können Sie gezielt nachschlagen.
Kontraste prüfen (WCAG 1.4.3)
Text muss mindestens 4.5:1 Kontrastverhältnis zum Hintergrund haben. Großer Text (ab 18pt / 14pt bold): 3:1. Prüfen Sie besonders Buttons, Links und Text auf farbigen Hintergründen.
Alternativtexte für Bilder (WCAG 1.1.1)
Jedes Bild braucht ein alt-Attribut. Dekorative Bilder: alt="". Informative Bilder: beschreibender Text. Keine Dateinamen als Alt-Text.
Tastaturnavigation (WCAG 2.1.1)
Alle interaktiven Elemente müssen per Tab-Taste erreichbar und per Enter/Space aktivierbar sein. Testen Sie: Können Sie das Menü, Formulare und Buttons ohne Maus bedienen?
Fokus-Indikatoren (WCAG 2.4.7)
Fokussierte Elemente müssen sichtbar hervorgehoben sein (Outline, Rahmen). Entfernen Sie niemals outline: none ohne Ersatz.
Semantisches HTML (WCAG 1.3.1)
Verwenden Sie semantische Tags: <nav>, <main>, <header>, <footer>, <article>. Überschriften-Hierarchie: H1 → H2 → H3 ohne Lücken.
Formulare mit Labels (WCAG 1.3.1)
Jedes Eingabefeld braucht ein zugeordnetes <label>. Fehlermeldungen müssen klar beschreiben, was falsch ist und wie es korrigiert wird.
Sprache definiert (WCAG 3.1.1)
<html lang="de"> muss gesetzt sein. Bei fremdsprachigen Abschnitten: lang-Attribut am Element.
Responsive und zoombar (WCAG 1.4.4)
Die Seite muss bei 200 % Zoom nutzbar bleiben. Kein maximum-scale=1 im Viewport-Meta-Tag.
Links sinnvoll beschriftet (WCAG 2.4.4)
Keine Links mit „Hier klicken" oder „Mehr". Der Linktext muss das Ziel beschreiben: „WCAG-Richtlinien herunterladen" statt „Hier klicken".
Skip-to-Content-Link (WCAG 2.4.1)
Ein „Zum Inhalt springen"-Link am Seitenanfang ermöglicht Tastaturnutzern, die Navigation zu überspringen.
Keine reinen Farb-Informationen (WCAG 1.4.1)
Informationen dürfen nicht ausschließlich über Farbe vermittelt werden. Ergänzen Sie Symbole, Text oder Muster.
Videos mit Untertiteln (WCAG 1.2.2)
Alle Videos müssen Untertitel haben. Audiodeskription für visuelle Informationen, die nicht im Ton vorkommen.
Keine Auto-Play-Medien (WCAG 1.4.2)
Audio und Video dürfen nicht automatisch starten. Falls doch: Pause/Stopp-Button und Lautstärkeregler bereitstellen.
Fehlervermeidung bei Formularen (WCAG 3.3.4)
Bei rechtlich bindenden Aktionen (Bestellung, Zahlung): Eingaben prüfbar, korrigierbar und bestätigbar machen.
ARIA-Attribute korrekt (WCAG 4.1.2)
Wenn Sie ARIA-Attribute verwenden, müssen sie korrekt sein. Falsches ARIA ist schlimmer als kein ARIA. Testen Sie mit einem Screenreader.
4. Kostenfreie Tools zum Testen
Mit diesen Werkzeugen starten Sie ohne Budget. Kombinieren Sie automatische Scanner mit einem echten Screenreader-Test:
| Tool | Typ | Stärken |
|---|---|---|
| Lighthouse (Chrome) | Automatisch | Schneller Überblick, Score 0–100 |
| WAVE | Browser-Extension | Visuelle Fehlermarkierung |
| axe DevTools | Browser-Extension | Detaillierte WCAG-Referenzen |
| Colour Contrast Analyser | Desktop-App | Exakte Kontrast-Messung |
| NVDA / VoiceOver | Screenreader | Realer Screenreader-Test |
Hinweis: Automatisierte Tools wie Lighthouse oder axe erkennen nur ca. 30–40 % der Barrieren. Tastaturnavigation, sinnvolle Alternativtexte, logische Lesereihenfolge und kognitive Barrierefreiheit erfordern immer eine manuelle Prüfung.
5. Die 5 häufigsten Barrierefreiheits-Fehler
Diese fünf Probleme sehen wir in der Praxis am häufigsten — und sie lassen sich fast immer ohne großen Aufwand beheben:
Zu geringer Kontrast
Hellgrauer Text auf weißem Hintergrund, weiße Schrift auf hellen Buttons — besonders bei Tabellen-Headings und CTAs häufig. Minimum: 4.5:1 für normalen Text.
Fehlende Alt-Texte
Bilder ohne alt-Attribut sind für Screenreader-Nutzer unsichtbar. Jedes informative Bild braucht einen beschreibenden Alternativtext.
Fehlende Fokus-Indikatoren
CSS-Resets entfernen oft die Standard-Outlines. Ohne sichtbaren Fokus können Tastaturnutzer nicht erkennen, wo sie sich befinden.
Formulare ohne Labels
Placeholder-Text ist kein Ersatz für Labels. Screenreader lesen Placeholder oft nicht vor — verwenden Sie immer ein zugeordnetes label-Element.
Überschriften-Chaos
H1 → H3 → H2 — eine falsche Hierarchie verwirrt Screenreader-Nutzer. Überschriften müssen logisch aufgebaut sein: H1 → H2 → H3, ohne Lücken.
6. BFSG 2025: Was müssen Sie beachten?
Das Barrierefreiheitsstärkungsgesetz (BFSG) setzt die EU-Richtlinie European Accessibility Act (EAA) in deutsches Recht um. Seit dem 28. Juni 2025 gilt: Wer online Produkte oder Dienstleistungen an Verbraucher verkauft, muss barrierefrei sein.
Das gilt für Sie:
- Online-Shops müssen WCAG 2.1 Level AA erfüllen
- Eine Erklärung zur Barrierefreiheit muss auf der Website veröffentlicht werden
- Ein Feedback-Mechanismus für Nutzer muss vorhanden sein
- Ausnahme nur für Kleinstunternehmen (< 10 MA, < 2 Mio. € Umsatz)
Das droht bei Verstößen:
- Bußgelder bis zu 100.000 € bei Verstößen
7. Fazit: Testen ist nur der erste Schritt
Ein Test zeigt Ihnen, wo Ihre Website steht — die eigentliche Arbeit beginnt bei der Umsetzung. Starten Sie mit einem automatisierten Scan, ergänzen Sie eine manuelle Prüfung der 15 Checkpunkte und priorisieren Sie nach Schweregrad. So erreichen Sie Schritt für Schritt WCAG 2.1 Level AA.
Sie möchten Ihre Website nicht selbst prüfen oder brauchen ein belastbares Ergebnis? Wir unterstützen Sie bei der WCAG-Analyse und -Umsetzung, richten mit Eye-Able die BFSG-konforme Lösung ein und erstellen Ihre rechtssichere Erklärung zur Barrierefreiheit. Die Erstberatung ist kostenfrei.
8. Häufige Fragen zur Website-Barrierefreiheit
Was kostet ein Barrierefreiheits-Audit?
Automatisierte Audits mit Lighthouse oder WAVE sind kostenfrei. Ein professionelles manuelles Audit kostet je nach Umfang zwischen 2.000 und 10.000 €. In einem kostenfreien Erstgespräch schätzen wir den Aufwand für Ihre Website ein.
Ist mein Online-Shop vom BFSG betroffen?
Ja, seit Juni 2025 müssen alle Online-Shops barrierefrei sein. Ausnahmen gelten nur für Kleinstunternehmen mit weniger als 10 Mitarbeitern und unter 2 Millionen Euro Jahresumsatz.
Welches WCAG-Level muss ich erreichen?
Das BFSG fordert WCAG 2.1 Level AA. Level A ist das Minimum, Level AA der gesetzliche Standard. Level AAA ist optional und in der Praxis selten vollständig umsetzbar.
Reicht ein automatischer Test?
Nein. Automatisierte Tools erkennen nur ca. 30–40 % der Barrieren. Tastaturnavigation, sinnvolle Alternativtexte und kognitive Barrierefreiheit erfordern manuelle Prüfung.
Was passiert bei Verstößen?
Mit dem BFSG drohen Bußgelder bis zu 100.000 €, Abmahnungen und Unterlassungsklagen. Aber der wichtigste Grund: Sie schließen sonst ca. 15 % der Bevölkerung von Ihrem Angebot aus.