Barrierefrei ab 2025: Was BFSG/EAA für Websites & Online-Shops wirklich bedeutet (inkl. Checkliste)
Barrierefreiheitsstärkungsgesetz Website, dieser Begriff entscheidet 2025 darüber, ob deine Website oder dein Online-Shop nicht nur nutzerfreundlich, sondern auch rechtskonform ist. Mit Inkrafttreten des BFSG und der zugehörigen Verordnung (BFSGV) gelten für digitale Angebote neue Anforderungen, die sich praktisch an EN 301 549 / WCAG 2.1 AA orientieren. In diesem Leitfaden zeige ich, für wen die Pflichten gelten, was konkret umzusetzen ist und wie du mit einer Checkliste und einem 30-Tage-Plan zügig auf ein gutes Niveau kommst – inkl. ROI-Gedanken und lokalem Bezug Webdesign Braunschweig.
Gilt das für meine Website wirklich?
Sobald deine Website oder App Dienstleistungen für Verbraucher online bereitstellt (z. B. Online-Shop, Termin-/Ticket-Buchung, Registrierung/Bezahlung), fällt sie sehr wahrscheinlich in den Anwendungsbereich. Reine „Visitenkarten-Seiten“ ohne Prozess zum Vertragsschluss sind oft nicht betroffen, Prüfung ist dennoch Pflicht, weil bereits Login-/Registrier-Strecken oder Zahlung den Ausschlag geben können.
Das Barrierefreiheitsstärkungsgesetz Website bedeutet in der Praxis: Deine Kernprozesse müssen wahrnehmbar, bedienbar, verständlich und robust sein, also WCAG 2.1 AA.
Was genau muss barrierefrei sein?
Prozess-Strecken im E-Commerce: Identifizierung, Authentifizierung, elektronische Signaturen, Zahlungen- inkl. Formulare, Fehlermeldungen, Captcha-Alternativen, Screenreader-Kompatibilität.
Technischer Maßstab: EN 301 549; Websites/Apps orientieren sich an WCAG 2.1 AA (Struktur, Kontraste, Tastaturbedienbarkeit, Medien-Alternativen, Robustheit).
Warum sich Barrierefreiheit rechnet
- Mehr Anfragen & Umsatz: 15–20 % der Bevölkerung profitieren unmittelbar; eine klarere, ruhigere UX reduziert Abbrüche in Checkout und Formularen.
- SEO-Hebel: Saubere Überschriften, sinnvolle Alternativtexte, bessere Performance → mehr Sichtbarkeit.
- Geringeres Risiko: Konformität mindert Bußgelder/Abmahnungen und stärkt Vertrauen bei Kunden und Bewerbern.
Die praxisnahe 12-Punkte-Checkliste (WCAG 2.1 AA als Baseline)
- Kontrast & Farbe: Mindestkontrast 4.5:1; niemals Informationen ausschließlich über Farbe kommunizieren.
- Typografie: Text muss sich bis 200 % verlustfrei vergrößern lassen; großzügige Zeilen-/Absatzabstände.
- Alternativtexte & Medien: Präzise Alt-Texte; Untertitel/Transkripte für Videos/Audio.
- Tastatur-Bedienbarkeit: Jede Funktion ohne Maus nutzbar; sichtbarer Fokus-State.
- Semantik & Struktur: Eine H1, saubere H2/H3-Hierarchie; Landmarks (
header,nav,main,footer). - Formulare: Echte Labels, eindeutige Fehlermeldungen, Autocomplete; klare Erfolgsmeldung nach dem Senden.
- Links/Buttons: Erkennbarer Linkzweck, ausreichend große Klickflächen (mind. ~44×44 px).
- Sprache & Klarheit:
lang-Attribut setzen; einfache, konsistente Sprache; Abkürzungen erklären. - Dynamik & ARIA: Nur dort ARIA einsetzen, wo es Semantik ergänzt; Live-Regionen für Statusmeldungen.
- Bewegung/Medien: prefers-reduced-motion respektieren; Autoplay vermeiden oder abschaltbar machen.
- Performance: LCP < 2,5 s anstreben (LCP-Bild preloaden, WebP/AVIF, Fonts self-hosten mit
font-display: swap). - E-Commerce-/Buchungs-Flows: Identifizierung, Authentifizierung, elektronische Signatur, Zahlung barrierefrei gestalten; Captcha-Alternative, Screenreader-Test, Fehlerfälle (z. B. abgelaufene Session) klar kommunizieren.
Tipp: Wenn du aktuell einen Preloader/Lade-Screen nutzt, stelle sicher, dass er nicht render-blockiert und das LCP-Element (z. B. Hero-Bild) nicht verdeckt.
30-Tage-Plan zur Umsetzung
Woche 1 – Quick-Audit & Scope
- Prüfe: Fällt deine Seite unter Barrierefreiheitsstärkungsgesetz Website (Dienstleistung online ja/nein)?
- 20-Min-Screenreader-Runde (NVDA/VoiceOver), kompletter Tastatur-Test, Kontrast-Scan (WAVE/axe).
- Liste „kritische Pfade“: Login, Formular, Checkout, Terminbuchung, Zahlung.
Woche 2 – High-Impact-Fixes
- Formulare: Labels, Fehlermeldungen, Fokus-Reihenfolge, Autocomplete.
- Navigations-Landmarks, Skip-Links, sichtbarer Fokus.
- Alternativtexte, Heading-Struktur, interne Ankerlinks (Skip to content).
Woche 3 – Technik & Performance
- LCP-Bild preloaden, Bilder in WebP/AVIF, unnötiges JS/CSS entfernen.
- Google-Fonts self-hosten;
font-display: swap. - Prüfe, ob Captcha-Alternative (z. B. logische Frage, Time-Based Token) vorhanden ist.
Woche 4 – Nachweis & Governance
- Seite „Barrierefreiheit & Feedback“: kurzer Selbst-Report + Kontaktmöglichkeit.
- Authoring-Guidelines für Redakteure (Alt-Texte, Tabellen, PDFs, Video-Untertitel).
- Optional: externer WCAG-Audit und regelmäßige Re-Tests nach Releases.
ROI-Rechnung: Was bringt die Umsetzung wirtschaftlich?
Angenommen, dein Shop hat 10.000 Besucher/Monat, 2 % Checkout-Abschlussquote und 80 € Ø-Warenkorb → 16.000 € Umsatz/Monat.
Durch Barrierefreiheit + UX-Fixes (klarere Formulare, bessere Fehlermeldungen, Tastatur-Flow, schnelleres LCP) ist ein konservativer +0,5–1,0 pp Conversion-Uplift realistisch. Das wären +5.000–10.000 € pro Monat, oft mehr als die Projektkosten innerhalb weniger Monate.
Häufige Fragen
Gilt das Barrierefreiheitsstärkungsgesetz Website auch für kleine Unternehmen?
Für Dienstleistungs-Kleinstunternehmen (< 10 Mitarbeitende, ≤ 2 Mio. € Umsatz/Bilanzsumme) gibt es Ausnahmen. Prüfe deinen Status – die Usability-Vorteile lohnen sich dennoch.
Muss ich die ganze Seite umbauen oder nur den Shop?
Der Schwerpunkt liegt auf Prozess-Strecken zum Vertragsschluss (Login, Registrierung, Checkout, Zahlung). In der Praxis verbessert man die gesamte Seite in Richtung WCAG 2.1 AA, um Stolpersteine zu vermeiden.
Welche Normen sind relevant?
In Deutschland verweist die Umsetzung auf EN 301 549; im Web etabliert sich WCAG 2.1 AA als praktischer Maßstab.
Quellen
Bundesfachstelle Barrierefreiheit BFSG-FAQ (Allgemein & E-Commerce-Strecken, Geltungsbereich).
Bundesfachstelle Barrierefreiheit – Kleinstunternehmen-Ausnahme.
AccessibleEU – EAA kommt zum 28.06.2025 zur Anwendung. AccessibleEU
Heuking (Kurzüberblick) – Verweis auf EN 301 549 / WCAG 2.1 AA. Heuking
EU Kommission – Änderungen EN 301 549 v3.2.1 (Bezug zu WCAG 2.1).
Rechtlicher Hinweis: Dieser Beitrag dient allgemeinen Informationszwecken zum BFSG/EAA und stellt keine Rechtsberatung dar. Gesetzeslage und Standards (z. B. EN 301 549/WCAG) können sich ändern; prüfe deine individuelle Situation oder wende dich an eine Rechtsberatung.
Comments are closed.