Barrierefreiheit für Webseiten wird Pflicht: Was das neue BFSG für Unternehmen bedeutet


Einleitung

Ab dem 28. Juni 2025 tritt in Deutschland das Barrierefreiheitsstärkungsgesetz (BFSG) in Kraft. Dieses Gesetz ist die deutsche Umsetzung des European Accessibility Act (EAA) und wird weitreichende Auswirkungen auf Unternehmen haben, die Produkte oder Dienstleistungen für Verbraucher anbieten. In diesem Artikel erklären wir, was das BFSG bedeutet, wen es betrifft und wie sich Unternehmen darauf vorbereiten können.

Was ist das BFSG?

Das Barrierefreiheitsstärkungsgesetz (BFSG) ist die deutsche Umsetzung der EU-Richtlinie 2019/882, auch bekannt als European Accessibility Act (EAA). Ziel des Gesetzes ist es, die Barrierefreiheit von Produkten und Dienstleistungen zu verbessern, insbesondere im digitalen Bereich.Hauptpunkte des BFSG:

  • Verpflichtung zur barrierefreien Gestaltung von Produkten und Dienstleistungen
  • Geltungsbereich umfasst Websites und mobile Anwendungen
  • Orientierung an der europäischen Norm EN 301 549
  • Bußgelder von bis zu 100.000 Euro bei Nichteinhaltung

Zeitrahmen und Übergangsregelungen

    1. Juni 2025: Inkrafttreten des BFSG
  • Bis 28. Juni 2030: Übergangsfrist für bestehende Produkte und Dienstleistungen
  • Ab 28. Juni 2030: Vollständige Anwendung auf alle Produkte und Dienstleistungen

Ausnahmen:

  • Kleinstunternehmen mit weniger als 10 Mitarbeitern und einem Jahresumsatz unter 2 Millionen Euro sind von einigen Anforderungen ausgenommen
  • Produkte und Dienstleistungen, bei denen die Barrierefreiheit eine „unverhältnismäßige Belastung“ darstellen würde, können teilweise von den Anforderungen befreit werden

Wer ist betroffen?

Das BFSG betrifft alle Unternehmen, die Produkte oder Dienstleistungen für Verbraucher anbieten. Besonders relevant ist es für folgende Branchen:

  1. E-Commerce und Online-Handel
  2. Finanzdienstleistungen und Banken
  3. Telekommunikation
  4. Verkehr und Tourismus
  5. Medien und Unterhaltung
  6. Bildung und E-Learning
  7. Gesundheitswesen

Beispiel: Ein Online-Shop für Bekleidung muss sicherstellen, dass alle Produktinformationen, Bilder und der Bestellprozess barrierefrei zugänglich sind.

Technische Anforderungen

Die technischen Anforderungen des BFSG basieren auf der europäischen Norm EN 301 549, die wiederum auf den Web Content Accessibility Guidelines (WCAG) aufbaut. Einige Kernpunkte sind:

  • Wahrnehmbarkeit: Inhalte müssen für alle Nutzer wahrnehmbar sein, z.B. durch Alternativtexte für Bilder
  • Bedienbarkeit: Alle Funktionen müssen per Tastatur bedienbar sein
  • Verständlichkeit: Inhalte und Bedienung müssen leicht verständlich sein
  • Robustheit: Inhalte müssen mit verschiedenen Technologien kompatibel sein

Fokus auf Tastaturbedienbarkeit

Die Anforderung, dass alle Funktionen einer Webseite per Tastatur bedienbar sein müssen, ist besonders wichtig und oft missverstanden. Hier eine detaillierte Erklärung:

  1. Warum ist Tastaturbedienbarkeit wichtig?
    • Viele Menschen mit motorischen Einschränkungen können keine Maus benutzen
    • Blinde und sehbehinderte Menschen navigieren oft ausschließlich mit der Tastatur
    • Auch Poweruser bevorzugen oft die Tastaturnavigation für effizienteres Arbeiten
  2. Was bedeutet Tastaturbedienbarkeit konkret?
    • Alle interaktiven Elemente (Links, Buttons, Formulare) müssen mit der Tab-Taste erreichbar sein
    • Die Reihenfolge der Tab-Navigation muss logisch und intuitiv sein
    • Aktuelle Position des Tastaturfokus muss visuell deutlich erkennbar sein
    • Dropdown-Menüs müssen mit Pfeiltasten bedienbar sein
    • Modalfenster müssen den Tastaturfokus einfangen und beim Schließen zurückgeben
  3. Beispiel für gute Tastaturbedienbarkeit:
    Ein Online-Banking-Portal ermöglicht es dem Nutzer, durch Drücken der Tab-Taste alle Menüpunkte zu erreichen, Überweisungen komplett per Tastatur auszufüllen und abzuschicken, sowie durch Modalfenster für Sicherheitsabfragen zu navigieren, ohne die Maus zu benutzen.
  4. Technische Umsetzung:
    • Verwendung semantisch korrekter HTML-Elemente (z.B. <button> statt <div onclick=“…“>)
    • Einsatz von ARIA-Attributen für komplexe Interaktionen
    • JavaScript-Eventlistener für Tastaturereignisse (z.B. keydown)
    • CSS-Styles für den :focus-Zustand, um den aktuellen Fokus deutlich zu markieren

Handlungsempfehlungen für Unternehmen

  1. Bestandsaufnahme durchführen: Analysieren Sie Ihre digitalen Angebote auf Barrierefreiheit
  2. Experten einbeziehen: Arbeiten Sie mit Barrierefreiheitsexperten zusammen
  3. Schulungen durchführen: Bilden Sie Ihre Mitarbeiter in Barrierefreiheit aus
  4. Barrierefreiheit in den Entwicklungsprozess integrieren: Berücksichtigen Sie Barrierefreiheit von Anfang an
  5. Regelmäßige Überprüfungen durchführen: Testen Sie Ihre Angebote kontinuierlich auf Barrierefreiheit
  6. Feedback einholen: Beziehen Sie Menschen mit Behinderungen in den Testprozess ein

Fallstudie: Ein mittelständisches Unternehmen für Haushaltsgeräte hat frühzeitig begonnen, seine Website barrierefrei zu gestalten. Durch die Einbindung von Nutzern mit verschiedenen Behinderungen im Testprozess konnten sie nicht nur die gesetzlichen Anforderungen erfüllen, sondern auch die allgemeine Benutzerfreundlichkeit ihrer Website verbessern, was zu einer Steigerung der Konversionsrate um 15% führte.

Technische Lösungen

  1. Screen Reader-Kompatibilität: Stellen Sie sicher, dass Ihre Inhalte mit gängigen Screen Readern funktionieren
  2. Farbkontraste optimieren: Verwenden Sie Kontrast-Checker-Tools
  3. Responsive Design: Gewährleisten Sie die Nutzbarkeit auf verschiedenen Geräten
  4. Untertitel und Transkripte: Bieten Sie Alternativen für audiovisuelle Inhalte
  5. Formularoptimierung: Gestalten Sie Formulare barrierefrei und leicht verständlich
  6. Tastaturnavigation: Ermöglichen Sie die vollständige Bedienung per Tastatur
  7. ARIA-Attribute: Nutzen Sie ARIA (Accessible Rich Internet Applications) zur Verbesserung der Zugänglichkeit

Konsequenzen bei Nichteinhaltung

Bei Verstößen gegen das BFSG drohen Bußgelder von bis zu 100.000 Euro. Darüber hinaus können Imageschäden und der Ausschluss von öffentlichen Aufträgen weitere Folgen sein.

Fazit

Das Barrierefreiheitsstärkungsgesetz stellt Unternehmen vor neue Herausforderungen, bietet aber auch Chancen. Eine barrierefreie Gestaltung von Produkten und Dienstleistungen erweitert den Kundenkreis und verbessert die Nutzererfahrung für alle. Unternehmen sollten die Zeit bis zum Inkrafttreten des Gesetzes nutzen, um ihre digitalen Angebote zu überprüfen und anzupassen. Langfristig wird Barrierefreiheit nicht nur eine gesetzliche Verpflichtung, sondern ein entscheidender Wettbewerbsvorteil sein.

Ergänzung Tastaturkürzel zur Erreichung der Barrierefreiheit:

Um die Barrierefreiheit auf Webseiten zu verbessern, ist eine effektive Tastaturbedienung unerlässlich. Hier sind einige wichtige Tastaturkürzel und Tasten, die für die barrierefreie Nutzung verwendet werden können:

Wichtige Tastaturkürzel für die Barrierefreiheit

BefehlWirkung
TabBewegt den Fokus vorwärts zu interaktiven Elementen
Shift + TabBewegt den Fokus rückwärts zu interaktiven Elementen
EnterAktiviert das fokussierte Element (z.B. Button, Link)
LeertasteAktiviert oder deaktiviert Checkboxen
PfeiltastenNavigiert innerhalb von Dropdown-Menüs oder Auswahlfeldern
EscSchließt modale Fenster oder Dropdown-Menüs
Home / EndeBewegt den Fokus an den Anfang oder das Ende der Seite
Alt + Pfeil runterÖffnet Dropdown-Listen

Weitere nützliche Funktionen

  • Fokus sichtbar halten: Der aktuelle Fokus sollte immer deutlich sichtbar sein, um den Nutzern zu helfen, wo sie sich auf der Seite befinden.
  • Navigation durch modale Dialoge: Wenn ein modales Fenster geöffnet wird, sollte der Fokus automatisch auf das erste interaktive Element innerhalb des Modals gesetzt werden.
  • Tab-Reihenfolge: Die Reihenfolge, in der Elemente durch Drücken der Tab-Taste erreicht werden, sollte logisch und intuitiv sein.

Tipps zur Implementierung

  1. Verwenden Sie standardisierte HTML-Elemente: Stellen Sie sicher, dass alle interaktiven Elemente wie Buttons und Links mit den entsprechenden HTML-Tags erstellt werden, um die Tastaturbedienbarkeit zu gewährleisten.
  2. Vermeiden Sie tabindex-Attribute: Wenn möglich, sollten benutzerdefinierte tabindex-Werte vermieden werden, da sie die natürliche Tab-Reihenfolge stören können.
  3. Testen Sie die Tastaturbedienung: Überprüfen Sie regelmäßig die Funktionalität Ihrer Webseite mit der Tastatur, um sicherzustellen, dass alle Elemente erreichbar und bedienbar sind.

Diese Tastaturkürzel und Tipps helfen dabei, eine barrierefreie Nutzererfahrung zu schaffen, insbesondere für Menschen mit motorischen Einschränkungen oder Sehbehinderungen.

Weiterführende Informationen

Unsere Frontendabteilung berät Sie gerne.