German UPA | Beitrag vom 26.06.2025 –
Das BFSG ist jetzt Pflicht: Wie du jetzt Barrierefreiheit wirklich prüfst - und warum Overlays keine Lösung sind

Accessibility testen: Was wirklich funktioniert - und wo du aufpassen musst

„Automatisierte Tools sind ein super Einstieg, aber kein Ersatz für echtes User Testing.“

Diese Einschätzung aus der UX-Community bringt es auf den Punkt. Tools wie das WAVE Plugin von WebAIM oder Stark für Figma helfen, offensichtliche Barrieren schnell zu identifizieren - etwa Kontrastprobleme oder fehlende Alt-Texte. Doch sie decken höchstens 30-40 % der relevanten Accessibility-Fehler ab. Trotzdem sind sie schonmal ein guter Anfang.

Empfehlenswerte Tools für den UX Alltag …

Simulation & Browser-Inspektionshilfen

# WAVE (Browser-Extension): 
Das Add-on von WebAIM markiert WCAG-Fehler direkt im Kontext des DOMs und liefert Code-Snippets sowie Text-Erklärungen, sodass UX-Profis Barrieren visuell und technisch zugleich nachvollziehen können.
https://wave.webaim.org/extension/ 

# Eye Able (Chrome-Extension)
Das kostenfreie Browser-Add-on bietet Nutzenden visuelle Hilfen wie Kontrast-Umschalter, Schriftvergrößerung und Dyslexie-Schrift, sodass UX-Profis rasch simulieren können, wie unterschiedliche Seh­einschränkungen ein Layout beeinflussen. 
https://chromewebstore.google.com/detail/eye-able%C2%AE-visuelle-hilfe/mpifhmmgeeofnfpehedbokjmlcgnlhbn?hl=de

# taba11y (Tab-Order-Checker)
Die Chrome-Extension visualisiert die tabulatorische Fokusreihenfolge auf einer Seite, damit UX-Profis Tastaturzugänglichkeit schnell überprüfen können. 
https://chromewebstore.google.com/detail/taba11y-tab-order-accessi/aocppmckdocdjkphmofnklcjhdidgmga

# Web Developer Tools (Chris Pederick)
Die vielseitige Browser-Erweiterung blendet per Klick CSS, Bilder oder ARIA-Attribute aus bzw. ein, womit UX-Teams die rohe Semantik und Screen-Reader-Struktur testen können. 
https://chrispederick.com/work/web-developer/ 

Praxis-Tipp: Nutze sogenannte Bookmarklets für schnelle Checks wie Buchstabenabstand oder Tastatur-Navigation - ideal als Low-Tech-Zugangsweg.

# BITV-Bookmarklets (Direkt­installation)
Ein Satz leichter Script-Lesezeichen aus der BIK-Liste, die DOM-Strukturen, Kontrast oder Textabstände im Live-Frontend visualisieren und so Sofort-Checks erlauben. 
https://bitvtest.de/test-methodik/web/werkzeugliste#c337 

Design-Support & Authoring-Tools

# Stark (Figma-Plugin)
Das freemium-Plugin überprüft Kontrast, Farbblindheit und Touch-Zielgrößen in Echtzeit innerhalb von Figma, sodass Designer barrierefreie Entscheidungen bereits während des Screen-Layouts treffen.
https://www.figma.com/community/plugin/732603254453395948/stark-contrast-accessibility-checker 

# axe for Designers (Figma-Plugin)
Das kostenlose Plugin prüft in Figma automatisch Farbstärke, Zielgrößen und Struktur-Headings, sodass Designer bereits im Wireframe Barrieren aufdecken. 
https://www.figma.com/community/plugin/1085612091163821851/axe-for-designers-a-free-accessibility-plugin 

# Colour Contrast Analyser (TPGi)
Das Desktop-Tool misst Kontrast­verhältnisse nach WCAG AA/AAA und simuliert Seh­behinderungen, wodurch Designer Farbpaletten evidenz-basiert optimieren. 
https://www.tpgi.com/color-contrast-checker/ 

# ButtonBuddy
Der Online-Generator prüft und optimiert Button-Farben entlang aller Kontrast­vektoren und ermöglicht so farbsichere Call-to-Action-Designs. 
https://buttonbuddy.dev/

Accessibility-Audit: Was ein guter UX-Testprozess leisten muss

UX-Testing auf Barrierefreiheit ist mehr als „noch mal mit dem Screenreader draufgucken“. Ein strukturiertes Audit besteht aus:

1. Vorab-Checks im Designprozess (Kontraste, Fokusführung)
2. Konformitätsprüfung nach WCAG oder BITV
3. User Testing mit betroffenen Personen

Pragmatische Praxis-Tipps aus dem Interview:

• Repräsentative Unterseiten auswählen, statt komplette Sites zu prüfen.
• Designsysteme nutzen, um Fehler zentral zu beheben - aber den finalen Seitenaufbau genau beobachten.
• Screenreader-Tests brauchen Erfahrung - oder besser: Menschen, die selbst auf diese Technologien angewiesen sind, mit einbeziehen.
• Checklisten nach Rollen aufteilen - z. B. für Content-Redakteur*innen vs. Dev-Team.
• QA-Tools wie Cypress mit eingebautem A11y-Test einbinden - ideal für den CI/CD-Prozess.

Checklisten & Schnellprüfungen

# Checklisten von LBIT Hessen 
Downloadbare Muster für die gesetzliche „Erklärung zur Barrierefreiheit“ helfen öffentlichen Stellen und UX-Teams, Compliance klar zu dokumentieren. 
https://lbit.hessen.de/oeffentliche-stellen/checklisten 

# Easy Web Check (HdM Stuttgart)
Eine vereinfachte Prüfmethode, die 53 häufige BITV-Kriterien halb­automatisch erfasst und sich damit als schnelle Pre-Audit-Checkliste für UX-Teams eignet. 
https://barrierefreiheit.hdm-stuttgart.de/easy-web-check/ 

# BIK BITV-Werkzeugliste (Web)
Eine kuratierte Übersicht von kostenlosen Bookmarklets und Prüf­programmen, die Prüfer\*innen bei BITV/WCAG-Tests systematisch unterstützt. 
https://bitvtest.de/test-methodik/web/werkzeugliste 

Reporting & Ergebnis-Dokumentation

# Siteimprove
Die Cloud-Plattform crawlt ganze Sites, prüft Accessibility-Fehler kontinuierlich und konsolidiert Ergebnisse in Dashboards, was Stakeholdern klare KPIs und Priorisierungen für fortlaufende Governance bietet.
https://www.siteimprove.com 

# CAAT.report 
Die Software erzeugt strukturierte Prüfberichte und kann Ergebnisse in Ticket­systeme exportieren, wodurch Accessibility-Findings leichter in agile Workflows einfließen. 
https://www.caat.report/de 

Automatisierung: Möglich, aber bitte mit Maß

Heute schon relativ gut automatisiert werden können u. a.:

• Prüfen von Kontrastverhältnisse
• Finden und setzen von fehlende Alt-Texte
• Audit der ARIA-Rollen
• Finden von fehlende Landmark-Elemente

Grenzen bei der Automation gibt es bei:

• Semantische Fehler (z. B. unklare Button-Benennung) werden nicht erkannt
• Tools geben teils irreführende Fehlermeldungen
• Bei „0 Fehler“-Meldung: misstrauisch bleiben - keine Garantie für Barrierefreiheit

Resourcen für automatisiertes Testing & Dev-Integration

# Accessibility Insights (Tool-Suite)
Microsofts Open-Source-Werkzeug­sammlung unterstützt schnelle WCAG-2.1-AA-Audits für Web-, Windows- und Android-Apps und liefert priorisierte Fix-Empfehlungen, was den Test-Workflow im UX-Team verkürzt.
https://accessibilityinsights.io/ 

# Lighthouse (Chrome DevTools)
Das integrierte Audit-Tool liefert einen gewichteten Accessibility-Score auf Basis von axe-Regeln und erleichtert schnelle Regressionstests während der Entwicklung. 
https://developer.chrome.com/docs/lighthouse?hl=de 

# Cypress Accessibility Testing Guide
Die offizielle Dokumentation zeigt, wie sich axe-Checks in End-to-End-Tests integrieren lassen, sodass Entwickler automatisierte Regressions-Audits für Barrierefreiheit einrichten können. 
https://docs.cypress.io/app/guides/accessibility-testing

👉 WICHTIG: 
Automatisierung ist ein Pre-Check, aber kein Ersatz für UX Research mit echten Nutzer*innen.

KI und Accessibility: Mehr Hoffnung als Hilfe?

Künstliche Intelligenz kann Barrierefreiheit unterstützen - aber nicht automatisieren. Besonders häufig eingesetzt wird KI aktuell für:

• Alt-Text-Generierung
• Textvereinfachung (Leichte Sprache, Einfache Sprache)
• Screenreader-kompatible Labels
   

Aber Achtung:

„KI-Modelle sind nicht auf Accessibility trainiert. Der Output ist oft gut gemeint, aber selten richtig gut gemacht.“

GPT-basierte Modelle liefern kreative, aber nicht normkonforme Vorschläge. KI kann als Assistentin für Routine-Aufgaben helfen, allerdings (noch) nicht als Entscheidungshilfe für barrierefreies UX-Design.

Empfehlung: Immer ein menschliches Review einplanen, vor allem bei Leichter Sprache, weil dort auch gesellschaftliche Normen, Stil und Tonlage zählen, die kaum ein Modell vollständig kennt.

KI Tools für Leichte Sprache & Content-Vereinfachung

# text2knowledge
Das KI-Tool wandelt Texte automatisch in leicht verständliche Sprache um und unterstützt damit Content-Teams, barrierefreie Texte schneller zu produzieren. 
https://icy-glacier-04bcd9703.5.azurestaticapps.net/de 

# capito digital 
Die SaaS-Lösung analysiert Texte auf drei Verständlichkeits­niveaus und vereinfacht sie per API, was Redaktionen hilft, gesetzliche Anforderungen an Leichte Sprache zu erfüllen. 
https://www.capito.eu/digital/ 

# Summ AI
Das Münchner Start-up bietet eine KI-Übersetzung in Leichte Sprache „auf Knopfdruck“, sodass komplexe Fachtexte binnen Sekunden barrierefrei ausgegeben werden können. 
https://summ-ai.com/en/ 

Warum Accessibility-Overlays keine Lösung sind ...

Seit Jahren stehen sogenannte Barrierefreiheits-Overlays in der Kritik. Die Idee: Zwei Zeilen JavaScript - und die Seite wird per Interface anpassbar. Kontraste erhöhen, Schrift vergrößern, Inhalte vorlesen. Klingt gut? Ist es selten.

Das neue Positionspapier des Arbeitskreises Barrierefreiheit der German UPA bringt es auf den Punkt:

„Overlays sind kosmetisch - aber lösen keine strukturellen Barrieren.“

Die Kritik ist klar:

❌ Screenreader-Kompatibilität fehlt

❌ Einstellungen sind nicht persistent

❌ Mobile Usability oft eingeschränkt

❌ Datenschutzrisiken durch externe JS

❌ Verstoß gegen ISO 9241-11 - weil die Nutzbarkeit nicht für alle gewährleistet ist
 

UX Professionals sind darum aufgefordert, Stakeholder aufzuklären, UX Testing priorisieren und langfristige Accessibility-Strategien aufzubauen - statt auf Plug-and-play-Lösungen zu hoffen.

Bildung, Austausch und praktische Umsetzung - Ressourcen für UX-Teams

Wer Accessibility in der täglichen UX-Arbeit nicht nur mit Tools und Testing, sondern auch mit strukturellem Wissen, rechtlicher Sicherheit und Community-Austausch verankern möchte, braucht starke Ressourcen. Ob E-Learning, Rollenverantwortung nach WCAG oder KI-basierte Vereinfachung komplexer Texte - es gibt mittlerweile zahlreiche spezialisierte Plattformen, Netzwerke und Standards, die UX Professionals praxisnah unterstützen.

Gerade mit Blick auf langfristige Strategien, teamweite Awareness und interdisziplinäre Zusammenarbeit lohnt sich der Blick in diese Angebote - als Impulsgeber, Qualitätsmaßstab und Lernplattform zugleich.

Bildung & Community

# gehirngerecht.digital
Lernplattform für digitale Barrierefreiheit: Eine deutschsprachige E-Learning-Plattform mit Kursen, Checklisten und Workshops, die UX-Teams praxisnah durch WCAG-konforme Gestaltung führt und ihnen hilft, frühzeitig barrierefreie Entscheidungen zu treffen.
https://gehirngerecht.digital/ 

# Arbeitskreis 'Barrierefreiheit' der German UPA
Das Fachnetzwerk veröffentlicht Leitfäden, Vorträge und Events, über die sich UX-Professionals kontinuierlich zum Stand der Technik austauschen können. 
https://germanupa.de/arbeitskreise/arbeitskreis-barrierefreiheit 

# netz-barrierefrei (Schulungen & Tests)
Der Dienstleister kombiniert Expertentests mit Perspektiven Betroffener und bietet praxisnahe Schulungen, was Design-Teams hilft, reale Nutzer­bedürfnisse zu verstehen. 
https://www.netz-barrierefrei.de/wordpress/ 

# bit-inklusiv Netzwerk
Die Initiative stellt Prüfverfahren für Arbeitsplatz-Software nach EN 301 549 bereit und vernetzt Organisationen, die Barrierefreiheit intern verankern wollen. 
https://www.bit-inklusiv.de 

# Fronta11y Artikelserie (GAAD-Aktion)
Jährliche deutschsprachige Fachartikel zum Global Accessibility Awareness Day geben UX-Profis frische Impulse und Best Practices. 
https://www.fronta11y.org/ 

# Fronta11y auf LinkedIn: Der LinkedIn-Auftritt bündelt Events, Calls-for-Papers und Community-Diskussionen rund um digitale Barrierefreiheit und fördert so Networking für Accessibility-Interessierte.
https://www.linkedin.com/company/fronta11y/

Standards, Richtlinien & Recht

# Handreichung „Barrierefreie UI-Elemente“ (BFIT-Bund)
Die offiziell publizierte Anleitung beschreibt barrierefreies Verhalten gängiger UI-Controls und liefert UX-Designern praxisnahe Pattern. 
https://handreichungen.bfit-bund.de  

# Accessibility Roles & Responsibilities Mapping (W3C ARRM)
 Das Mapping-Framework weist WCAG-Aufgaben klaren Rollen zu und unterstützt Product-Owner dabei, Barrierefreiheit team-weit zu verankern. 
https://www.w3.org/WAI/planning/arrm/ 

# Bundesfachstelle Barrierefreiheit - Definition
Die Site liefert die juristische (§ 4 BGG) Definition von Barrierefreiheit in Deutschland, was UX-Teams als Referenz für Rechts­argumentationen nutzen.
https://www.bundesfachstelle-barrierefreiheit.de/DE/Ueber-Uns/Definition-Barrierefreiheit/definition-barrierefreiheit_node.html 

5 Takeaways für echte Barrierefreiheit

1. Stakeholder überzeugen
   • Zeige auf, warum Overlays kosmetisch sind und echte UX-Probleme kaschieren.
      
2. UX Research mit Betroffenen
   • Teste mit Menschen, die Screenreader nutzen oder motorische Einschränkungen haben.
      
3. Tools gezielt einsetzen
   • Nutze WAVE, Axe, Stark & Co. - aber immer ergänzt durch manuelle Prüfungen.
      
4. Checklisten nach Rollen
   • Content-, Dev- und Design-Checklisten in Jira oder Confluence integrieren.
      
5. Accessibility als Prozess, nicht Projekt
   • Accessibility gehört in Styleguides, Designsysteme, QA und User Research.

Fazit: Accessibility muss in die UX-DNA - nicht ins Plugin

Mit dem Barrierefreiheitsstärkungsgesetz endet die Zeit der Ausreden. UX Professionals stehen in der Verantwortung, barrierefreie Nutzererlebnisse zu gestalten - jenseits technischer Abkürzungen und Overlay-Illusionen. Die gute Nachricht: 

Mit den richtigen Tools, klarer Methodik und echtem Nutzerfokus ist Accessibility machbar - als Kernbestandteil exzellenter UX.

 

Noch mehr Infos und weitere Ressourcen ...
zu dem Thema gibt es auf den Seiten des Arbeitskreis Barrierefreiheit der German UPA
https://germanupa.de/arbeitskreise/arbeitskreis-barrierefreiheit 

 

Was meinst du zu den neuen Anforderungen? 
Welche Tools und Strategien setzt du ein?
Teile diesen Artikel gerne via Social Media und lass uns deine Meinung dazu wissen. Wir freuen uns auf dein Feedback.