Software

Barrierefreiheit Website: Checkliste

7. September 2026 · 3 Min. Lesezeit

Die erste Prüfung auf Barrierefreiheit braucht kein Werkzeug, sondern eine Tastatur. Wer die Maus weglegt und versucht, mit Tab, Enter und den Pfeiltasten durch die eigene Seite zu kommen, findet in zehn Minuten mehr Probleme als jeder automatische Test.

Maßstab ist die EN 301 549, die für Webinhalte die WCAG 2.1 auf Stufe AA übernimmt. Wer wann dazu verpflichtet ist, steht unter Barrierefreiheit als gesetzliche Pflicht; hier geht es um die Umsetzung.

Bedienung ohne Maus#

Alles muss mit der Tastatur erreichbar sein. Jede Schaltfläche, jedes Menü, jedes Formularfeld, jeder Dialog. Wenn eine Aufklappnavigation nur auf hover reagiert, ist sie für Tastaturnutzer nicht vorhanden.

Der Fokus muss sichtbar sein. outline: none im Stylesheet ohne gleichwertigen Ersatz ist der häufigste Einzelfehler überhaupt. Er entsteht fast immer aus ästhetischen Gründen und macht die Seite für alle unbrauchbar, die nicht zeigen können, wo sie gerade sind.

Die Reihenfolge muss der Leserichtung folgen. Springt der Fokus vom Kopfbereich in die Fußzeile und wieder zurück, stimmt die Quelltextreihenfolge nicht mit dem visuellen Aufbau überein. Positive tabindex-Werte sind meist die Ursache.

Keine Fokusfalle. Ein modaler Dialog muss den Fokus halten, solange er offen ist, und ihn beim Schließen mit Esc wieder freigeben. Einwilligungsdialoge und Newsletter-Overlays fallen hier regelmäßig durch.

Wahrnehmbarkeit: Kontrast und Alternativen#

Kontrastwerte nach WCAG 2.1 AA: mindestens 4,5:1 für normalen Text, 3:1 für großen Text sowie für grafische Bedienelemente und Zustandsanzeigen. Der zweite Wert wird am häufigsten verfehlt, weil kaum jemand an ihn denkt: Er gilt für Icons ohne Beschriftung, für Rahmen von Eingabefeldern, für Schalterzustände und für Fokusmarkierungen.

Typische Fehlerquellen sind heller Grautext auf Weiß, Text über Fotos ohne Abdunklung und Platzhaltertext in Formularen.

Alternativtexte beschreiben Funktion, nicht Dateiname. Bei einem Bild, das Information trägt, gehört diese Information in das alt-Attribut. Bei einem verlinkten Logo gehört dort das Ziel hinein, nicht das Wort „Logo". Bei rein dekorativen Bildern gehört ein leeres alt="" hin, damit Screenreader sie überspringen. Ein fehlendes Attribut ist etwas anderes als ein leeres.

Farbe darf nie die einzige Information sein. Ein rot umrandetes Formularfeld ohne Text sagt niemandem, was falsch ist.

Struktur, Formulare, Sprache#

Überschriften bilden eine Gliederung. Eine H1 pro Seite, danach keine Ebene überspringen. Überschriften werden nach Rang gewählt, nicht nach Schriftgröße — die Begründung dafür steht unter H1-Überschrift. Screenreader navigieren über diese Struktur, ähnlich wie Sehende über Zwischenüberschriften springen.

Jedes Formularfeld braucht eine Beschriftung. Ein <label> mit passendem for zum id des Feldes. Ein Platzhalter ersetzt kein Label: Er verschwindet beim Tippen und hat oft zu wenig Kontrast. Fehlermeldungen müssen als Text neben dem betroffenen Feld stehen und benennen, was zu tun ist.

Die Sprache muss ausgezeichnet sein. <html lang="de"> steuert, mit welcher Aussprache ein Screenreader vorliest. Fehlt das Attribut, wird ein deutscher Text unter Umständen englisch ausgesprochen. Fremdsprachige Passagen im Text bekommen ein eigenes lang.

Bewegung muss anhaltbar sein. Automatisch startende Karussells, Videos und Animationen brauchen eine Möglichkeit zum Pausieren. Startendes Audio ohne Bedienelement ist ausgeschlossen. Wer prefers-reduced-motion auswertet, respektiert zusätzlich die Systemeinstellung.

Was Werkzeuge finden — und was nicht#

Automatisierte Prüfungen decken einen Teil der Kriterien ab, und zwar zuverlässig den maschinell entscheidbaren:

fehlende alt-Attribute
fehlende oder falsch verknüpfte Formularbeschriftungen
fehlendes lang-Attribut
Kontrastverstöße bei Text mit einfarbigem Hintergrund
doppelte id-Werte und fehlerhafte ARIA-Rollen
übersprungene Überschriftenebenen

Manuell bleibt alles, was Bedeutung voraussetzt. Ob ein Alternativtext das Bild tatsächlich beschreibt, ob die Fokusreihenfolge logisch ist, ob eine Fehlermeldung verständlich ist, ob eine Tabelle als Tabelle vorgelesen ergibt, ob ein Video eine sinnvolle Audiodeskription hat: Das entscheidet keine Software.

Ein Werkzeug ohne Befunde bedeutet deshalb nicht, dass eine Seite barrierefrei ist. Es bedeutet, dass die einfach messbaren Fehler behoben sind. Die Prüfung mit Tastatur und Screenreader kommt danach — nicht statt dessen.

Wer die Liste zum ersten Mal durchgeht, sollte vorher klären, in welchem Umfang das Angebot überhaupt erfasst ist: Die rechtlichen Grundlagen und die Ausnahmen stehen unter Barrierefreiheit als Pflicht seit 2025.