Barrierefreiheit-Checkliste:
Website selbst prüfen
39 Prüfpunkte, mit denen ihr eure Website vor einem Audit selbst durchgeht: Kontraste, Tastatur, Formulare, Alternativtexte, Struktur, Bewegung, Zoom und Screenreader. Jeder Punkt nennt das WCAG-Kriterium und sagt, wie ihr ihn testet. Dazu gibt es eine Vorlage für die Mängelliste.
Wie prüft man eine Website auf Barrierefreiheit?
In drei Durchgängen: Zuerst ein automatischer Scan, der Kontrastfehler, fehlende Alt-Texte und Labels findet. Dann die Seite nur mit der Tastatur bedienen. Zum Schluss die wichtigsten Abläufe mit einem Screenreader durchgehen. Der Scan findet nur einen Teil der Probleme. Was Menschen tatsächlich aussperrt, zeigt sich meist erst bei den Tests von Hand.
Maßstab: Das BFSG verweist auf die Norm EN 301 549, die derzeit WCAG 2.1 AA abbildet. Diese Checkliste folgt WCAG 2.2 AA, weil die neuen Kriterien (Fokus nicht verdeckt, Zielgröße, Alternativen zu Ziehbewegungen) ohnehin gutes Design sind.
Was ihr dafür braucht
- Tastatur: reicht für den ganzen Abschnitt Fokus & Tastatur
- Screenreader: VoiceOver ist auf Mac und iPhone eingebaut, NVDA für Windows ist kostenlos
- Kontrastrechner: zum Beispiel der WebAIM Contrast Checker oder die Messung in den Browser-Entwicklertools
- Automatischer Scan: axe DevTools oder Lighthouse im Chrome-Browser, als Ergänzung
- Browser-Zoom: und die Geräte-Ansicht der Entwicklertools
39 Prüfpunkte zum Abhaken
Die Häkchen werden nur in eurem Browser gespeichert. Prüft am besten die Seiten, über die Geld oder Anfragen laufen: Startseite, Kontaktformular, Buchung oder Checkout.
0 von 39 geprüft
Die Checkliste deckt die Punkte ab, an denen Websites in der Praxis am häufigsten scheitern. Sie ist keine vollständige Abbildung aller WCAG-Kriterien und ersetzt weder ein Audit noch eine Rechtsberatung.
Vorlage für die Mängelliste
Jeder gefundene Mangel bekommt eine Zeile: wo er steckt, welches Kriterium er verletzt, wie schwer er wiegt und was der Fix ist. Sortiert nach Auswirkung wird daraus eine Liste, die euer Team abarbeiten kann. Die Beispielzeilen stammen aus dem Audit dieser Website.
| Nr. | Fundstelle | Problem | Kriterium | Auswirkung | Fix | Status |
|---|---|---|---|---|---|---|
| 1 | Alle Seiten, Fokus-Ring | Fokus unsichtbar: CSS setzt Breite und Farbe, aber keinen Linienstil | 2.4.7 · AA | hoch | outline-style ergänzen | behoben |
| 2 | Kontaktformular, 4 Felder | Felder ohne verknüpftes Label, Screenreader liest sie unbenannt vor | 3.3.2 · A | hoch | label mit for/id verknüpfen, Fehlertext und Statusmeldung ergänzen | behoben |
| 3 | Footer-Links | Kontrast 1,73:1 | 1.4.3 · AA | mittel | Linkfarbe anpassen, jetzt 5,16:1 | behoben |
Zu viele offene Punkte? Dann lohnt sich das Audit.
Im Audit gehe ich dieselben Kategorien von Hand durch, mit Tastatur, VoiceOver und Kontrastmessung, und liefere die fertige Mängelliste mit konkretem Fix pro Punkt. Auf Wunsch behebe ich die Mängel direkt in Design und Code.
Häufige Fragen zur Barrierefreiheitsprüfung
Kann ich meine Website selbst auf Barrierefreiheit prüfen?
Zu einem großen Teil, ja. Mit Tastatur, eingebautem Screenreader, Kontrastrechner und Browser-Zoom lassen sich die meisten Punkte dieser Checkliste ohne Fachwissen testen. Schwieriger wird es bei eigenen Komponenten wie Menüs, Dialogen und Formularen mit Fehlerlogik: Ob sie richtig angesagt werden, braucht Übung mit dem Screenreader.
Reicht ein automatischer Test wie Lighthouse?
Nein. Automatische Tests finden fehlende Alt-Texte, fehlende Labels und zu schwache Kontraste. Ob ein Ablauf per Tastatur funktioniert, ob der Fokus sichtbar ist oder ob ein Alt-Text sinnvoll ist, erkennt kein Tool. Der Scan ist ein guter erster Durchgang, aber keine Prüfung.
Welche WCAG-Version gilt für das BFSG?
Das BFSG verweist auf die europäische Norm EN 301 549, die derzeit WCAG 2.1 Level AA abbildet. WCAG 2.2 AA ist der sinnvollere Maßstab, weil die neuen Kriterien zu Fokus, Zielgröße und Ziehbewegungen ohnehin gutes Design sind und die nächste Normfassung sie voraussichtlich übernimmt.
Was gehört in eine Mängelliste?
Pro Mangel: die Fundstelle, das Problem in einem Satz, das verletzte WCAG-Kriterium, die Auswirkung auf Nutzer:innen und der konkrete Fix. Sortiert nach Auswirkung zeigt die Liste, was zuerst behoben werden muss. Die Vorlage auf dieser Seite gibt die Spalten vor.
Wie lange dauert die Prüfung mit der Checkliste?
Für eine kleine Website mit Kontaktformular etwa ein bis zwei Stunden, wenn ihr die Werkzeuge schon kennt. Bei Shops mit Checkout, Kundenkonto und vielen eigenen Komponenten deutlich länger.
Ersetzt die Checkliste ein Audit?
Nein. Die Checkliste deckt die häufigsten Fehler ab, aber nicht alle WCAG-Kriterien. Ein Audit prüft vollständig, bewertet jeden Fund und liefert den konkreten Fix. Ob euer Angebot unter das BFSG fällt, klärt im Zweifel eine Rechtsberatung.
Wer unter das BFSG fällt und welche Fristen gelten, steht ausführlich im Artikel Barrierefreiheit im UX-Design.
Lass uns sprechen
Du planst eine Website, eine App, ein Redesign — oder möchtest euer Team mit einem AI-UX Workshop voranbringen?
Ich unterstütze Unternehmen dabei, komplexe Anforderungen in klare, nutzerfreundliche Lösungen zu übersetzen.