Accessibility Testing lernen für den Quereinstieg: Websites nach WCAG und BFSG prüfen

Du öffnest einen Online-Shop, willst ein Produkt in den Warenkorb legen und merkst: Mit der Tab-Taste springt der Fokus irgendwohin, aber nicht auf den Button. Oder ein Formular meldet einen Fehler nur mit roter Schrift. Für Menschen, die ausschließlich mit Tastatur, Screenreader oder Vergrößerungssoftware arbeiten, ist das nicht nur ärgerlich. Es kann bedeuten, dass sie einen digitalen Dienst gar nicht nutzen können. Genau hier setzt Accessibility Testing an.

Seit dem 28. Juni 2025 ist digitale Barrierefreiheit für viele Produkte und Dienstleistungen im Verbraucherbereich durch das Barrierefreiheitsstärkungsgesetz, kurz BFSG, verbindlicher geworden. Unternehmen müssen deshalb genauer prüfen, ob ihre Websites, Apps und digitalen Prozesse zugänglich sind. Für Quereinsteiger eröffnet das ein spezialisiertes Feld innerhalb der Qualitätssicherung: Du testest nicht nur, ob eine Funktion technisch läuft, sondern ob sie für unterschiedliche Menschen tatsächlich nutzbar ist.

Infografik zu Accessibility Testing lernen für den Quereinstieg: Websites nach WCAG und BFSG prüfen (KI-generiert).

Was Accessibility Testing im Arbeitsalltag bedeutet

Accessibility Testing prüft, ob digitale Angebote auch von Menschen mit Behinderungen bedient und verstanden werden können. Dabei geht es unter anderem um Menschen mit Seh-, Hör-, Bewegungs- oder kognitiven Einschränkungen. Gute Barrierefreiheit hilft zugleich vielen weiteren Nutzerinnen und Nutzern, etwa bei schlechter Internetverbindung, kleiner Bildschirmgröße, vorübergehenden Verletzungen oder lauter Umgebung.

Im Arbeitsalltag prüfst du beispielsweise:

• Ist eine Website vollständig mit der Tastatur bedienbar?
• Ist jederzeit sichtbar, welches Element gerade den Tastaturfokus hat?
• Haben Bilder, Bedienelemente und Formulare verständliche Textalternativen und Beschriftungen?
• Werden Fehlermeldungen auch ohne Farbe eindeutig erklärt?
• Liest ein Screenreader Überschriften, Navigation, Dialogfenster und Statusmeldungen sinnvoll vor?
• Sind Kontraste, Schriftgrößen und interaktive Flächen ausreichend gestaltet?
• Funktionieren eingebettete Komponenten wie Cookie-Banner, Chats oder Buchungsstrecken barrierefrei?

Diese Arbeit ist eng mit QA verbunden. Wer bereits testet oder in den Einstieg als QA Engineer plant, findet hier eine klare Spezialisierung. Grundlagen zur Rolle, Testautomatisierung und dem sinnvollen Einsatz von KI erklären wir auch in unserem Beitrag „QA Engineer werden als Quereinsteiger: Testautomatisierung mit KI lernen“.

BFSG, WCAG und technische Anforderungen richtig einordnen

Das BFSG ist ein deutsches Gesetz. Es betrifft bestimmte Produkte und Dienstleistungen, die sich an Verbraucherinnen und Verbraucher richten, etwa Teile des E-Commerce, digitale Bankdienstleistungen, Telekommunikationsdienste oder Personenbeförderungsangebote. Ob ein konkretes Unternehmen und Angebot in den Anwendungsbereich fällt, hängt vom jeweiligen Fall ab. Accessibility Tester geben deshalb keine Rechtsberatung. Sie liefern nachvollziehbare technische Befunde, mit denen Fachabteilungen, Entwicklung und Recht arbeiten können.

Für die praktische Prüfung sind die Web Content Accessibility Guidelines, kurz WCAG, besonders wichtig. Sie strukturieren Anforderungen nach vier Prinzipien:

Prinzip	Bedeutung für Tests	Beispiel
Wahrnehmbar	Inhalte müssen auf unterschiedliche Weise erfassbar sein.	Bilder haben passende Alternativtexte.
Bedienbar	Funktionen müssen mit verschiedenen Eingabemethoden funktionieren.	Ein Menü ist per Tastatur erreichbar.
Verständlich	Inhalte und Interaktionen müssen klar und vorhersehbar sein.	Fehler im Formular werden verständlich beschrieben.
Robust	Inhalte müssen mit assistiven Technologien zuverlässig funktionieren.	Ein Screenreader erkennt Schaltflächen korrekt.

In Projekten werden oft konkrete Konformitätsziele vereinbart, häufig auf Basis von WCAG 2.1 oder WCAG 2.2. Entscheidend ist jedoch nicht, eine Checkliste blind abzuhaken. Du musst verstehen, welche Nutzungshürde hinter einem Kriterium steckt und wie du sie reproduzierbar dokumentierst.

Die drei wichtigsten Testarten

Ein belastbarer Accessibility Test besteht nie nur aus einem automatisierten Scan. Tools finden viele technische Muster, aber sie verstehen keinen Kontext. Deshalb kombinierst du automatisierte Prüfungen mit manuellen Tests.

Mit der Tastatur testen

Die Tastaturprüfung gehört zu den wirkungsvollsten manuellen Tests. Ziehe bei einer Website die Maus zur Seite und navigiere ausschließlich mit Tab, Umschalt plus Tab, Enter, Leertaste und den Pfeiltasten.

Prüfe dabei besonders:

• Die Fokusreihenfolge folgt einer nachvollziehbaren Reihenfolge.
• Der Fokus ist klar sichtbar und verschwindet nicht hinter fixierten Elementen.
• Alle interaktiven Elemente sind erreichbar.
• Aufklappmenüs, Dialoge und Tabs lassen sich bedienen und wieder schließen.
• Es gibt keine „Tastaturfalle“, aus der du nicht weiter navigieren kannst.
• Nach einer Aktion, etwa dem Öffnen eines Dialogfensters, landet der Fokus an einer sinnvollen Stelle.

Ein häufiger Fehler ist ein optisch schöner Button, der technisch nur ein dekoratives Element ist. Er reagiert vielleicht auf einen Mausklick, lässt sich aber per Tastatur nicht erreichen. Für betroffene Nutzerinnen und Nutzer existiert diese Funktion praktisch nicht.

Mit dem Screenreader testen

Screenreader lesen Inhalte und Bedienelemente vor. Sie übersetzen die technische Struktur einer Seite in eine hörbare Bedienoberfläche. Deshalb ist semantisches HTML so wichtig: Eine echte Schaltfläche wird anders angekündigt als ein Link, eine Überschrift anders als gewöhnlicher Text.

Zum Einstieg brauchst du nicht jede Screenreader-Software perfekt zu beherrschen. Wichtiger ist, typische Bedienmuster zu lernen und Unterschiede zwischen visueller Darstellung und vorgelesener Struktur zu erkennen.

Bei einem Screenreader-Test fragst du:

• Werden Überschriften als Überschriften erkannt und ergeben sie eine sinnvolle Gliederung?
• Haben Links und Buttons verständliche Namen?
• Werden Formularfelder mit ihren Labels korrekt vorgelesen?
• Erhalten Nutzerinnen und Nutzer wichtige Statusmeldungen, etwa „Artikel wurde hinzugefügt“?
• Sind Dialogfenster als solche erkennbar?
• Werden redundante oder verwirrende Informationen vermieden?

Ein Alternativtext wie „Bild“ erfüllt seinen Zweck selten. Ein guter Text beschreibt die relevante Information im jeweiligen Kontext. Bei einem Produktbild kann das Produktmerkmal wichtig sein, bei einer Infografik die enthaltene Aussage. Rein dekorative Bilder sollten dagegen nicht unnötig vorgelesen werden.

Automatisierte Tools sinnvoll einsetzen

Browser-Erweiterungen, Entwicklungswerkzeuge und automatisierte Tests helfen dir, schnell offensichtliche Probleme zu finden. Sie erkennen zum Beispiel fehlende Alternativtexte, unzureichende Kontraste, formale Fehler in ARIA-Attributen oder Überschriftenlücken.

Aber ein Tool kann nicht zuverlässig entscheiden, ob ein Alternativtext nützlich ist, eine Fokusreihenfolge logisch bleibt oder eine Fehlermeldung verständlich formuliert wurde. Deshalb lautet die richtige Arbeitsweise: automatisiert finden, manuell bewerten, sauber dokumentieren.

Wenn du dich für Testautomatisierung interessierst, ist es sinnvoll, Accessibility Checks früh in Testpipelines mitzudenken. Das ergänzt klassische funktionale Tests, ersetzt aber keine manuelle Prüfung.

So dokumentierst du Befunde, mit denen Entwicklungsteams arbeiten können

Ein guter Accessibility Bug Report ist konkret, reproduzierbar und ohne Vorwürfe formuliert. „Seite ist nicht barrierefrei“ hilft niemandem. Beschreibe stattdessen eine beobachtbare Hürde und ihren Effekt.

Nutze für jeden Befund diese Struktur:

• Titel: Kurz und eindeutig, zum Beispiel „Tastaturfokus im Cookie-Dialog nicht sichtbar“.
• Umgebung: Browser, Betriebssystem, Gerät und gegebenenfalls Screenreader.
• Schritte: Beschreibe genau, wie sich der Fehler auslösen lässt.
• Erwartetes Ergebnis: Erkläre, wie die Bedienung funktionieren sollte.
• Tatsächliches Ergebnis: Beschreibe das beobachtete Verhalten.
• Auswirkung: Benenne die konkrete Nutzungshürde.
• Bezug: Ordne den Befund einem passenden WCAG-Kriterium zu, wenn du sicher bist.
• Beleg: Ergänze bei Bedarf Screenshot, Video oder kurze Screenreader-Aufzeichnung.

Gerade die Auswirkung macht deinen Bericht wertvoll. Statt nur „Fokus fehlt“ zu schreiben, erklärst du: „Tastaturnutzende können nicht erkennen, welches Bedienelement aktiv ist und können das Formular nicht verlässlich bedienen.“

Dein Lernplan für den Quereinstieg

Accessibility Testing ist kein Bereich, in dem du nur Theorie auswendig lernst. Du brauchst ein Verständnis für Web-Technologien, Testmethodik und Nutzungssituationen. Der Einstieg gelingt gut in aufeinander aufbauenden Schritten.

1. HTML und Web-Grundlagen festigen

Lerne, wie HTML-Strukturen, Formulare, Links, Buttons und Überschriften funktionieren. Verstehe den Unterschied zwischen visueller Gestaltung mit CSS und semantischer Bedeutung im HTML. Auch grundlegendes JavaScript hilft, weil viele Probleme bei dynamischen Menüs, Dialogen oder Statusmeldungen entstehen.

Für eine breite technische Basis empfehlen wir unseren Ratgeber „Softwareentwicklung von Grund auf lernen“. Du musst nicht sofort selbst komplexe Anwendungen entwickeln, solltest aber den Code und die Kommunikation im Entwicklungsteam nachvollziehen können.

2. WCAG anhand echter Seiten üben

Nimm öffentliche Websites oder eigene kleine Übungsprojekte und teste sie systematisch. Beginne mit wenigen wiederkehrenden Prüfpunkten: Tastaturbedienung, Fokus, Überschriften, Formularlabels, Alternativtexte und Kontrast.

Führe ein Testprotokoll. Notiere nicht nur Fehler, sondern auch die Begründung. Mit der Zeit trainierst du deinen Blick für Muster: ein klickbares div statt eines Buttons, fehlende Beschriftungen, unklare Linktexte oder modale Fenster ohne Fokussteuerung.

3. Ein Portfolio mit Testfällen aufbauen

Für den Quereinstieg zählt der Nachweis, dass du strukturiert arbeiten kannst. Erstelle daher kleine Portfolio-Projekte, die deine Vorgehensweise sichtbar machen:

• Ein Accessibility Audit einer Übungswebsite mit priorisierten Befunden.
• Testfälle für eine Registrierung oder einen Checkout.
• Eine Gegenüberstellung von problematischem und verbessertem HTML.
• Ein automatisierter Check in einer kleinen Testumgebung.
• Ein kurzer Bericht über einen Screenreader-Test.

Wichtig ist, keine vertraulichen Daten oder Inhalte aus echten Kundenprojekten zu veröffentlichen. Wie du Projekte so aufbereitest, dass sie in Bewerbungen überzeugen, zeigen wir in „Ein Portfolio mit echten Projekten aufbauen“.

4. Kommunikation und Priorisierung trainieren

Nicht jeder Fehler hat dieselbe Auswirkung. Ein fehlendes dekoratives Bild ist anders zu bewerten als ein nicht bedienbarer Kaufbutton. Lerne daher, Probleme nach Nutzungshürde, Reichweite und Kritikalität einzuordnen.

In Teams übersetzt du zwischen mehreren Perspektiven: Design möchte eine klare Oberfläche, Entwicklung braucht umsetzbare Anforderungen, Product Owner müssen priorisieren. Ein gutes Accessibility Profil verbindet diese Anforderungen sachlich und lösungsorientiert.

Typische Fehlannahmen, die du vermeiden solltest

„Automatisierte Tools finden alle Probleme.“ Das stimmt nicht. Sie sind ein guter Start, aber keine vollständige Prüfung.

„Barrierefreiheit ist nur für blinde Menschen relevant.“ Tatsächlich betrifft sie sehr unterschiedliche Nutzungssituationen und Behinderungen.

„WCAG ist nur eine Aufgabe für Entwickler.“ Entwicklerinnen und Entwickler setzen Lösungen um, aber Produktmanagement, Design, Content und QA tragen gemeinsam Verantwortung.

„Accessibility Testing ist reine Kontrolle am Ende.“ Je früher Anforderungen, Designs und Komponenten geprüft werden, desto weniger aufwendig werden spätere Korrekturen.

Vom QA-Einstieg zum spezialisierten Profil

Accessibility Testing eignet sich besonders gut, wenn du sorgfältig analysierst, gerne nachvollziehbare Fehlerberichte schreibst und Technik mit realer Nutzerperspektive verbinden willst. Es ist keine Nische neben der eigentlichen Qualitätssicherung, sondern ein Qualitätsmerkmal moderner digitaler Produkte.

Kombiniere die Spezialisierung mit allgemeinem QA-Wissen, Grundlagen in Webentwicklung und ersten Erfahrungen mit Testautomatisierung. Dann kannst du dich auf Rollen wie QA Tester, Software Tester, Accessibility Tester oder Digital Accessibility Specialist vorbereiten. Für Bewerbungsgespräche hilft es, typische Fachfragen und eigene Projektbeispiele gezielt zu üben. Lies dazu auch „Technisches Vorstellungsgespräch: so bereitest du dich vor“.

Bei uns lernst du praxisnah an Aufgaben, die dem Arbeitsalltag nahekommen. Passende Seminare, Karrierepfade und Termine findest du bei uns auf cmt.de.