Barrierefreiheit im Web

Ab Juni 2025 gilt das Barrierefreiheitsstärkungsgesetz (BFSG) – und entgegen einer weit verbreiteten Annahme betrifft es nicht nur öffentliche Stellen. Auch private Unternehmen, die Dienstleistungen oder Produkte über Webseiten und Apps anbieten, müssen ihre digitalen Angebote barrierefrei gestalten. Besonders mittelständische Unternehmen und kleine Agenturen stehen jetzt vor der Herausforderung, ihre digitalen Produkte rechtzeitig anzupassen.

Die Übergangsfrist läuft ab – wer jetzt nicht handelt, riskiert nicht nur Abmahnungen, sondern verschenkt auch Potenzial. Denn barrierefreie Webseiten sind nicht nur inklusiver, sondern auch besser auffindbar, nutzerfreundlicher und oft schneller als ihre nicht-barrierefreien Pendants. In diesem Artikel erfahren Sie, was das BFSG für Ihr Unternehmen bedeutet, welche konkreten Anforderungen auf Sie zukommen und wie Sie systematisch WCAG 2.2 AA Konformität erreichen.

Was fordert das BFSG konkret?

Das Gesetz verlangt, dass Webseiten und mobile Anwendungen von bestimmten Unternehmen so gestaltet sein müssen, dass sie von Menschen mit Behinderungen ohne fremde Hilfe genutzt werden können. Das umfasst unter anderem:

Wahrnehmbarkeit: Alle Inhalte müssen über mehrere Sinne erfassbar sein – etwa durch Alternativtexte für Bilder und Untertitel für Videos.
Bedienbarkeit: Die Navigation und Interaktion muss auch per Tastatur und assistiven Technologien möglich sein.
Verständlichkeit: Texte und Bedienelemente müssen klar und vorhersagbar sein.
Robustheit: Die Inhalte müssen mit aktuellen und zukünftigen assistiven Technologien kompatibel sein.

Was bedeutet das BFSG für Ihr Unternehmen?

Das BFSG richtet sich an Unternehmen, die Produkte oder Dienstleistungen im elektronischen Geschäftsverkehr anbieten. Konkret betroffen sind alle Anbieter von Webseiten, Apps, Online-Shops und Buchungsplattformen, die sich an Verbraucher richten. Anders als häufig angenommen, gibt es keine generelle Ausnahme für kleine Unternehmen – die Umsatzschwellen und Mitarbeiterzahlen, die im ursprünglichen Gesetzesentwurf diskutiert wurden, wurden in der finalen Fassung nicht als pauschale Befreiungskriterien aufgenommen.

Praktisch bedeutet das: Betreiber einer WordPress-Seite mit 50 Produkten sind genauso in der Pflicht wie ein großer Versandhändler mit zehntausend Artikeln. Die Anforderungen gelten für den gesamten Kundenprozess – von der Produktsuche über den Bestellvorgang bis hin zur Rechnungstellung. Auch Kontaktformulare, Newsletter-Anmeldungen und interaktive Elemente wie Chatbots fallen unter die Regelung.

Unternehmen, die das BFSG ignorieren, riskieren Abmahnungen durch Wettbewerbsverbände, Bußgelder und im schlimmsten Fall Vertriebsverbote für ihre digitalen Angebote. Doch statt die Vorschrift als Last zu sehen, sollten Sie sie als Chance begreifen: Frühzeitige Umsetzung verschafft Ihnen einen Wettbewerbsvorteil gegenüber säumigen Mitbewerbern.

Konkrete Anforderungen an Ihre Website

Das BFSG bezieht sich auf die EN 301 549, die ihrerseits die WCAG 2.2 (Web Content Accessibility Guidelines) auf Konformitätsstufe AA referenziert. Daraus ergeben sich konkrete technische Anforderungen, die Sie heute schon prüfen können:

Kontrastverhältnisse: Text und Hintergrund müssen ein Kontrastverhältnis von mindestens 4,5:1 aufweisen (bei großen Schriften ab 18px/14px fett reichen 3:1).
Tastaturbedienung: Sämtliche Funktionen Ihrer Seite müssen sich per Tastatur erreichen und auslösen lassen – ohne Ausnahmen.
Fokus-Reihenfolge: Die Tab-Reihenfolge muss logisch sein und dem visuellen Layout entsprechen. Kein Element darf durch versteckte Tab-Stops "verschluckt" werden.
Alternativtexte: Jedes nicht-textliche Element (Bilder, Icons, Grafiken) benötigt einen aussagekräftigen Alternativtext, der den Zweck des Elements beschreibt.
ARIA-Landmarks: Verwenden Sie semantische HTML-Strukturen und ARIA-Rollen, damit Screenreader die Seitenbereiche (Navigation, Hauptinhalt, Footer) erkennen können.
Formularfeedback: Fehlermeldungen in Formularen müssen programmatisch erkennbar sein und idealerweise den konkreten Korrekturbedarf nennen.
Bewegte Inhalte: Automatisch abspielende Videos, Karussells oder Animationen müssen pausierbar sein – und dürfen nicht länger als fünf Sekunden laufen, ohne eine Pause-Möglichkeit anzubieten.

Diese Auflistung ist bei weitem nicht vollständig, deckt aber die häufigsten Verstöße ab, die automatisierte Prüftools wie der WAVE-Browser-Plugin oder axe DevTools aufdecken. Eine vollständige WCAG 2.2 AA Konformität erfordert zusätzlich manuelle Prüfungen durch geschulte Experten.

Warum sich Barrierefreiheit lohnt

Barrierefreies Webdesign ist nicht nur eine gesetzliche Pflicht – es bietet auch handfeste Vorteile. Suchmaschinen belohnen zugängliche Seiten mit besseren Rankings, weil klare Strukturen und Alternativtexte die Indexierung verbessern. Gleichzeitig erreichen Sie eine größere Zielgruppe: Rund 10 Prozent der Bevölkerung in Deutschland leben mit einer Behinderung – das sind Millionen potenzieller Kunden.

Darüber hinaus profitieren auch Nutzer ohne Behinderung von barrierefreiem Design: Tastaturbedienung hilft Power-Usern, gute Kontraste verbessern die Lesbarkeit bei Sonnenlicht, und Untertitel werden in lauten Umgebungen geschätzt. Barrierefreiheit ist damit ein Gewinn für alle – und ein klares Signal Ihrer Marke, dass Sie Inklusion ernst nehmen.

So erreichen Sie WCAG 2.2 AA Konformität

Der Weg zur Konformität muss nicht überwältigend sein. Wir empfehlen ein gestaffeltes Vorgehen in drei Phasen:

Phase 1: Automatisierte Analyse

Starten Sie mit einem automatisierten Scan Ihrer gesamten Webseite. Tools wie axe DevTools, WAVE oder der TOTEMA Accessibility Scanner durchsuchen alle Unterseiten nach den häufigsten WCAG-Verstößen. Sie erhalten einen detaillierten Bericht mit Priorisierung der Fundstellen nach Schweregrad. Diese Analyse dauert nur wenige Minuten und deckt bereits 30 bis 40 Prozent aller Barrieren auf.

Phase 2: Manuelle Expertenprüfung

Viele Barrieren lassen sich nicht automatisch erkennen – etwa ob ein Alternativtext tatsächlich den Zweck des Bildes beschreibt oder ob die logische Navigationsreihenfolge für Screenreader-Nutzer sinnvoll ist. Hier ist ein manueller Audit durch geschulte Accessibility-Experten unerlässlich. Dieser umfasst in der Regel die Prüfung repräsentativer Seiten mit Screenreadern, Vergrößerungssoftware und reiner Tastaturnavigation.

Phase 3: Kontinuierliche Überwachung

Barrierefreiheit ist kein einmaliges Projekt, sondern ein fortlaufender Prozess. Jedes neue Update, jeder neue Blogbeitrag und jedes neue Plugin kann neue Barrieren einführen. Etablieren Sie deshalb automatisierte Prüfungen in Ihren CI/CD-Workflow und führen Sie regelmäßig (mindestens quartalsweise) manuelle Audits durch. Mit Tools wie der TOTEMA WPAccessSuite behalten Sie den Überblick, ohne Ihr Team zu belasten.

Automatisierung als Schlüssel

Die manuelle Prüfung jeder einzelnen Seite und jedes neuen Contents ist für die meisten Unternehmen nicht skalierbar. Hier kommt die Automatisierung ins Spiel. Moderne Accessibility-Plattformen können nicht nur bestehende Probleme erkennen, sondern viele davon auch automatisch beheben:

Automatische Alternativtexte: KI-gestützte Bildanalyse erzeugt passende Alt-Texte für Produktbilder und Grafiken, die dann manuell verifiziert werden können.
Kontrastoptimierung: Automatisierte Tools passen Farbwerte so an, dass die Mindestkontraste eingehalten werden, ohne das Design zu zerstören.
ARIA-Reparatur: Fehlende oder fehlerhafte ARIA-Attribute werden erkannt und durch korrekte Werte ersetzt.
Strukturkorrektur: Automatisierte Prüfungen stellen sicher, dass Überschriften hierarchisch korrekt sind und Landmarks richtig gesetzt wurden.

Die TOTEMA AutoFix Pipeline ist das Herzstück dieser Automatisierungsstrategie. Sie lässt sich direkt in Ihre bestehende Infrastruktur integrieren, sei es als GitHub Action, als GitLab CI-Job oder als WordPress-Plugin. Nach jedem Deployment scannt die Pipeline automatisch alle geänderten Seiten und korrigiert gefundene Barrieren, bevor die Änderung live geschaltet wird. So stellen Sie sicher, dass Ihre Webseite rund um die Uhr den WCAG-Standards entspricht – ganz ohne manuellen Aufwand.

Checkliste: WCAG 2.2 AA in 10 Schritten

Verwenden Sie diese Checkliste als Startpunkt für Ihre Barrierefreiheits-Initiative. Kreuzen Sie Schritt für Schritt ab, um systematisch Konformität zu erreichen:

☐ 1. Automatisierten Scan durchführen: Lassen Sie Ihre gesamte Webseite von einem Prüftool wie axe DevTools analysieren und dokumentieren Sie die Ergebnisse.
☐ 2. Farbkontraste prüfen: Stellen Sie sicher, dass alle Text-Hintergrund-Kombinationen das geforderte Mindestkontrastverhältnis von 4,5:1 erfüllen.
☐ 3. Tastaturbedienung testen: Navigieren Sie durch Ihre gesamte Seite, ohne die Maus zu verwenden. Jedes interaktive Element muss erreichbar und bedienbar sein.
☐ 4. Alternativtexte einpflegen: Versehen Sie alle Bilder, Icons und Grafiken mit aussagekräftigen Alt-Texten. Dekorative Elemente erhalten ein leeres alt-Attribut.
☐ 5. Überschriftenstruktur prüfen: Die Hierarchie von h1 bis h6 muss logisch sein. Es darf keine Sprünge geben (etwa von h2 direkt zu h5).
☐ 6. ARIA-Landmarks setzen: Definieren Sie die Hauptbereiche Ihrer Seite (banner, navigation, main, contentinfo) mit korrekten ARIA-Rollen.
☐ 7. Formulare testen: Jedes Formularfeld muss ein korrektes label-Element haben. Fehlermeldungen müssen programmatisch erkennbar sein.
☐ 8. Video- und Audioinhalte prüfen: Stellen Sie sicher, dass Videos Untertitel haben und Audioinhalte in Textform bereitgestellt werden.
☐ 9. Fokusreihenfolge validieren: Die Tab-Reihenfolge muss dem visuellen Layout folgen. Fokus-Indikatoren müssen deutlich sichtbar sein.
☐ 10. Screenreader-Test durchführen: Prüfen Sie repräsentative Seiten mit einem Screenreader wie NVDA (Windows) oder VoiceOver (macOS), um die tatsächliche Nutzererfahrung zu verstehen.

Diese Checkliste ersetzt keinen vollständigen Audit, gibt Ihnen aber eine klare Orientierung für die ersten Schritte. Jeder abgehakte Punkt bringt Ihre Webseite näher an die WCAG 2.2 AA Konformität – und damit an ein inklusives, rechtssicheres und zukunftsfähiges digitales Angebot.

Erste Schritte für Ihr Unternehmen

Beginnen Sie mit einer Bestandsaufnahme: Lassen Sie Ihre Webseite von einem automatisierten Prüftool analysieren. Tools wie der WAVE-Browser-Plugin oder der Axe-DevTools geben Ihnen einen schnellen Überblick über die häufigsten Barrieren. Danach folgt eine manuelle Überprüfung durch geschulte Experten, denn nicht alle Probleme lassen sich automatisch erkennen.

TOTEMA unterstützt Sie mit der WPAccessSuite, die speziell für WordPress-basierte Webseiten entwickelt wurde. Unsere Lösung prüft, analysiert und behebt Barrierefreiheitsprobleme – automatisiert und nach WCAG 2.2-Standard.

Fazit und nächste Schritte

Das BFSG ist keine Bedrohung, sondern eine Einladung, Ihre digitalen Angebote inklusiver und besser zu machen. Unternehmen, die jetzt handeln, sichern sich nicht nur rechtliche Sicherheit, sondern erschließen sich auch neue Kundengruppen und verbessern ihr SEO-Ranking. Die Investition in Barrierefreiheit zahlt sich mehrfach aus.

Unser Rat: Starten Sie noch diese Woche mit einem automatisierten Scan Ihrer Webseite. Die Ergebnisse werden Sie überraschen – und der Aufwand für die ersten Korrekturen ist meist geringer als befürchtet. Sollten Sie Unterstützung benötigen, steht Ihnen das TOTEMA-Team mit maßgeschneiderten Lösungen für Ihren Technologie-Stack zur Seite.

Vereinbaren Sie ein kostenloses Erstgespräch, in dem wir Ihre Webseite scannen und Ihnen einen konkreten Fahrplan zur WCAG 2.2 AA Konformität erstellen. Die ersten Schritte sind einfacher, als Sie denken – und die ersten Erfolge stellen sich schneller ein, als Sie erwarten.