Barrierefreiheit fuer Online-Shops: BFSG-Compliance-Leitfaden (Frist Juni 2025)

Das Barrierefreiheitsstaerkungsgesetz (BFSG) – Deutschlands Webzugang-Gesetz – hatte eine Compliance-Frist am 28. Juni 2025. Diese Frist ist abgelaufen. Deutsche Unternehmen, die E-Commerce-Sites, digitale Dienstleistungen oder Online-Inhalte betreiben, riskieren jetzt Bussgelder bis zu 100.000 Euro fuer Nichtkonformitaet.

Was ist BFSG und warum es wichtig ist

Das Barrierefreiheitsstaerkungsgesetz (BFSG) ist deutsche Gesetzgebung, die die EU-Webzugangsrichtlinie (2016/2102) umsetzt. Sie verpflichtet oeffentliche und private Organisationen, ihre Websites und digitalen Dienstleistungen fuer Menschen mit Behinderungen zugaenglich zu machen. Nichtkonformitaet fuehrt zu Geldstrafen, negativem Markenruf und Ausschluss eines beachtlichen Teils des Marktes (15-20% der Bevoelkerung hat eine Behinderung).

1. Wer muss BFSG einhalten?

Betroffene Einrichtungen

Das BFSG gilt fuer alle kommerziellen Websites und digitalen Dienstleistungen. Allerdings gibt es einige Ausnahmen.

• Oeffentliche Sector-Websites (Regierung, oeffentliche Institutionen)
• B2C-E-Commerce (Online-Shops, die an Verbraucher verkaufen)
• Digitale Dienstleistungen (Software, Apps, Web-Anwendungen)
• Websites von Organisationen, die digitale Dienstleistungen anbieten
• Digitale Dienstleistungen im Zusammenhang mit Zahlungssystemen oder Telekommunikation

Ausnahmen: Wer muss NICHT konform sein (noch nicht)

Mikrounternehmen mit weniger als 10 Mitarbeitern sind bis 28. Dezember 2030 ausgenommen. Diese Ausnahmeregelung gilt jedoch nur fuer Barrierefreiheitsanforderungen; andere Vorschriften koennen noch gelten.

• Mikrounternehmen: <10 Mitarbeiter (bis 2030 ausgenommen)
• Einzelunternehmer: Koennen ausgenommen sein, wenn <10 Mitarbeiter
• KMU mit 10-49 Mitarbeitern: Muessen konform sein (keine Ausnahme)
• Groessere Organisationen: Muessen unabhaengig von der Groesse konform sein

2. WCAG 2.1 Level AA: Der Standard

Das BFSG erfordert die Einhaltung von WCAG 2.1 Level AA (Web Content Accessibility Guidelines). WCAG ist der internationale Standard fuer Webzugang, entwickelt vom W3C.

Was ist WCAG 2.1 Level AA?

WCAG 2.1 besteht aus 78 Erfolgskriterien, organisiert in 4 Prinzipien: Wahrnehmbar, Bedienbar, Verstaendlich und Robust (POUR).

• Level A: Grundlegende Konformitaet, minimale Zugangsmoeglichkeiten
• Level AA: Empfohlener Standard, deckt die meisten haueufigen Behinderungen ab
• Level AAA: Hoechster Standard, schwieriger/kostenaufwaendiger zu erreichen
• Das BFSG erfordert Level AA, das ist das globale Best Practice fuer die meisten Organisationen

3. Schluesselanforderungen von WCAG 2.1 AA

1. Textalternativen (Alt-Text)

Alle Bilder, Symbole und visuellen Inhalte muessen beschreibenden Alt-Text haben, der Inhalt und Funktion beschreibt. Screenreader-Benutzer verlassen sich vollstaendig auf Alt-Text.

• Produktbilder: 'Blaue Keramik-Kaffeetasse, 12 oz, Premium-Qualitaet' (nicht 'tasse.jpg')
• Dekorative Bilder: Alt-Text leer lassen (alt='')
• Symbole: Funktion beschreiben, nicht Aussehen ('Suche' nicht 'Lupe')
• Diagramme/Graphen: Datenzusammenfassung in Alt-Text oder zugaengliche Beschreibung bereitstellen

2. Tastaturnavigation

Alle Funktionen muessen mit der Tastatur allein bedienbar sein. Benutzer mit motorischen Behinderungen oder Sehstorungen verwenden Tastaturen statt Maeusen.

• Tab-Reihenfolge: Logisch, sequenziell (von oben nach unten, von links nach rechts)
• Skip-Links: Ermoegliche Benutzern, wiederholte Navigation zu ueberspringen (zum Hauptinhalt springen)
• Fokus-Indikatoren: Sichtbarer Fokus-Umriss auf Buttons/Links (nie setzen Sie outline: none)
• Keine Tastatur-Fallen: Benutzer muessen von jedem interaktiven Element weg tabuieren koennen
• Dropdown-Menuese: Bedienbar mit Pfeiltasten, nicht nur Mausbewegung

3. Farbkontrast

Text- und Hintergrundfarben muessen ausreichenden Kontrast fuer Menschen mit Farbenblindheit und niedriger Sehschaerfe haben. WCAG AA erfordert ein 4,5:1-Kontrastverhaeltnis fuer normalen Text, 3:1 fuer grossen Text.

Tools wie WebAIM Contrast Checker oder Color Contrast Analyzer helfen bei der Ueberprueung von Verhaeltnissen. Testen Sie alle Farbkombinationen auf Ihrer Site.

4. Formularetiketten und Anweisungen

Alle Formeingaben muessen verbundene Etiketten haben. Screenreader-Benutzer muessen wissen, wozu jedes Feld dient.

• Verwenden Sie HTML <label>-Elemente, die mit Eingaben ueber das 'for'-Attribut verknuepft sind: <label for='email'>E-Mail</label><input id='email'>
• Nur Platzhaltertext ist NICHT ausreichend (verschwindet, wenn Benutzer tippt)
• Fehlermeldungen muessen mit Feldern verbunden und Screenreadern angekuendigt werden
• Anweisungen sollten vor Formularfeldern stehen, nicht in Tooltips versteckt
• Erforderliche Felder muessen mit (*) markiert und in der Bezeichnung angekuendigt werden

5. Ueberschriften und Inhaltsstruktur

Verwenden Sie ordnungsmaessige HTML-Ueberschriftshierarchie (H1, H2, H3, usw.). Screenreader-Benutzer navigieren nach Ueberschriften.

• Eine H1 pro Seite (Haupttitel)
• Logische Hierarchie: H1 → H2 → H3 (keine uebersprungenen Ebenen)
• Verwenden Sie Ueberschriften nicht zum Stylen; verwenden Sie stattdessen CSS
• Tabellenkopfzeilen (<th>) fuer Datentabellen
• Listen: Verwenden Sie <ul>, <ol>, <li> statt <div>-Elemente

6. Zugaengliche PDFs und Dokumente

Herunterladbare PDFs und Dokumente muessen zugaenglich sein. Dies beinhaltet Markierung, ordnungsmaessige Struktur, Alt-Text fuer Bilder und durchsuchbarer Text (nicht gescannte Bilder).

• PDFs sollten mit ordnungsmaessigen Strukturelementen markiert sein
• Vermeiden Sie gescannte Bilder ohne OCR (verwenden Sie durchsuchbare PDFs)
• Bilder in PDFs benoetigen Alt-Text
• Links sollten beschreibenden Text haben (nicht 'hier klicken')
• Erwaegen Sie alternative Formate: HTML, Word, usw.

7. Video- und Audio-Untertitel

Multimediainhalte muessen Untertitel (fuer Videos) und Abschriften (fuer Audio) enthalten. Taube und schwerhoerige Benutzer vertrauen auf Untertitel.

• Videos: Geschlossene Untertitel oder Untertitel (nicht nur von YouTube automatisch generiert)
• Audio: Vollstaendige Abschrift bereitgestellt oder verlinkt
• Vermeiden Sie automatisch abgespielte Medien ohne Benutzerkontrolle
• Stellen Sie Lautspaerkeregler und Schaltflaehen zum Anhalten bereit

8. ARIA-Markierungen und -Bereiche

Verwenden Sie semantisches HTML und ARIA-Markierungen zur Definition von Seitenbereichen. Dies hilft Screenreader-Benutzern, komplexe Layouts zu navigieren.

• <nav> fuer Navigation
• <main> fuer Hauptinhalt
• <aside> fuer Seitenleisten
• <footer> fuer Fusszeile
• role='search' fuer Suchfunktionalitaet
• role='contentinfo' fuer Fusszeileninformationen

4. Technische Standards: EN 301 549

EN 301 549 ist der europaeische Standard fuer IKT-Zugang, auf den BFSG verweist. Er bezieht WCAG 2.1 ein und fuegt zusaetzliche Anforderungen fuer nicht-Web-Dienstleistungen hinzu (Mobile Apps, Software, usw.).

• Bezieht WCAG 2.1 Level AA ein
• Ergaenzt die Anforderungen fuer Mobile Apps und Software
• Anforderungen fuer Authoring-Tools und Content Management-Systeme
• PDF/Dokumentstandards
• Echtzeitkommunikation (Zugang zu Videokonferenzen, Chat)

5. Haueufige BFSG-Verletzen im deutschen E-Commerce

6. Test- und Audit-Tools

Automatisierte Test-Tools

• WAVE (WebAIM): Browser-Erweiterung, hebt Zugangssprobleme auf jeder Seite hervor
• axe DevTools: Erweiterung fuer Entwicklertools, detaillierte Berichte zu Verletzen
• Lighthouse: In Chrome integriert, Zugangs-Audit-Registerkarte
• NVDA (Bildschirmlesesoftware): Kostenlose Bildschirmlesesoftware fuer Windows-Tests
• JAWS: Premium-Bildschirmlesesoftware, Marktstandard

Diese Tools sind gut fuer grundlegende Tests, erfassen aber nicht alle Probleme. Manuelle Tests und echte Benutzertests mit Benutzern von Hilfstechnik sind unerlasslich.

Manuelle Test-Checkliste

• Navigieren Sie auf der Site nur mit der Tab-Taste (ohne Maus)
• Browser auf 200% zoomen und Layout-Layout ueberpruefen
• Testen Sie mit aktiviertem Windows-Hochkontrast-Modus
• Verwenden Sie eine Bildschirmlesesoftware, um zu ueberpruefen, dass Inhalte sinnvoll sind
• Aendern Sie die Groesse des Browser-Fensters; ueberpruefen Sie responsives Design
• Testen Sie alle Formularuebermittlungsablaeufe
• Testen Sie, ob Tastaturkuerzeln erkennbar sind

7. BFSG-Durchsetzung: Strafen

Wer setzt BFSG durch?

Marktueuberwachungsbehoerden (Marktueuberwachungsbehoerden) auf Landesebene setzen BFSG durch. Beschwerden koennen von Verbrauchern, Behindertenvertretern oder proaktiver Marktueuberwachung eingereicht werden.

Strafen fuer Nichtkonformitaet

Das BFSG-Verletzen tragen erhebliche Strafen:

• Erste Verletzen: Verwaltungsgeldbusse bis zu 100.000 Euro
• Wiederholte Verletzen: Geldbussen koennen eskaliert
• Dauernde Verletzen: Wiederholte Geldbussen fuer fortgesetzte Nichtkonformitaet
• Alternative Durchsetzung: Gerichtsbefehle zum Entfernen einer nicht konformen Site oder Dienstleistung

8. Kostenvoranschlaege fuer BFSG-Konformitaet

Die Konformitaetskosten haengen von der Site-Komplexitaet, dem aktuellen Stand und davon ab, ob Sie Berater mieten oder interne Ressourcen verwenden.

9. Implementierungs-Roadmap (2025-2026)

Wenn Ihre Site noch nicht konform ist, ist hier eine praktische Zeitleiste:

• Monat 1: Durchfuehren Sie ein Zugangs-Audit (WAVE, axe, manuelle Ueberpruefen)
• Monat 1-2: Priorisieren Sie Korrekturen: kritische Probleme zuerst (Alt-Text, Kontrast, Tastaturnavigation)
• Monat 2-4: Implementieren Sie kritische und grosse Korrektionen
• Monat 4: Ausfuehren Sie einen umfassenden Test (automatisiert + manuell + Bildschirmlesesoftware)
• Monat 4-5: Beheben Sie verbleibende kleinere Probleme
• Monat 5: Endgueltige Audit und Vorbereitung der Konformitaetserklaerung
• Fortlaufend: Monatliche Wartung, neue Inhaltsueberpruefen, vierteljaehrliche Audits

10. Uebergangsfrist: Bestehende Produkte (2025-2030)

Fuer Produkte, die vor dem 28. Juni 2025 existierten, gibt es eine Uebergangsfrist bis zum 28. Dezember 2030 fuer physische oder Software-Produkte. Dies gilt jedoch NICHT fuer Websites oder digitale Dienstleistungen – diese muessen sofort konform sein.

• Websites und Online-Shops: Muessen sofort konform sein (Frist abgelaufen)
• Physische Produkte: Uebergangsfrist bis 2030 (nicht Ihr Anliegen)
• Software/Apps: Muessen sofort konform sein
• Digitale Dokumente: Muessen sofort konform sein

11. Konformitaets-Dokumentation und Zugangserklaerung

Das BFSG erfordert, dass Websites eine Zugangserklaerung bereitstellen, die Konformitaetsanstrengungen dokumentiert und Kontaktinformationen fuer Zugangssprobleme bereitstellt.

Was in Ihre Zugangserklaerung aufgenommen ist

• Erklaerung der Konformitaet mit WCAG 2.1 Level AA
• Erklaerung, wie Zugang erreicht wurde
• Liste der bekannten nicht konformen Elemente (falls vorhanden)
• Kontakt-E-Mail fuer Zugangssprobleme
• Verfahren zum Umgang mit Zugangsbeschwerde
• Link zur Marktueuberwachungsbehoerde (wenn Beschwerde ungeloest)

Ihre Zugangserklaerung sollte leicht zugaenglich sein (z.B. Fusszeilen-Link). Ueberpruefen Sie sie jaehrlich.

12. Business Case fuer Zugang

Jenseits der Rechtskonformitaet ist Zugang gutes Geschaeft:

• Marktexpansion: ~15-20% der Bevoelkerung haben Behinderungen; inklusives Design erfasst diesen Markt
• Bessere Benutzererfahrung: Zugangsverbesserungen profitieren allen Benutzern (Untertitel helfen in lauten Umgebungen, klare Navigation hilft allen)
• SEO-Verbesserung: Ordnungsmaessige Ueberschriften, Alt-Text, semantisches HTML verbessern die Suchrangfolge
• Rechtliches Risikomanagement: Proaktive Konformitaet vermeidet Geldbussen und Klagen
• Markenreputation: Zeigt Engagement fuer Inklusion
• Mobile-Optimierung: Zugaengliche Sites funktionieren oft besser auf Mobilgeraeten

13. Praktische Umsetzungs-Checkliste

Zusammenfassung

Die BFSG-Konformitaetsfrist ist am 28. Juni 2025 abgelaufen. Wenn Sie noch nicht anfangen haben, ist sofortige Massnahme erforderlich, um Geldbussen bis zu 100.000 Euro zu vermeiden. Beginnen Sie mit einem Zugangs-Audit, priorisieren Sie kritische Probleme (Alt-Text, Kontrast, Tastaturnavigation), und planen Sie eine umfassende Konformitaet innerhalb von 2-3 Monaten ein. Jenseits der Rechtsanforderungen ist Zugang gutes Geschaeft – es erweitert Ihren Markt, verbessert die Benutzererfahrung und schafft Markentreue.