Barrierefreiheit
05 / Prüfen & Testen
Kernfrage
Wie weiss ich, ob es funktioniert?
Barrierefreiheit lässt sich prüfen, aber nicht allein mit einem Werkzeug. Automatische Tests finden nur einen Teil der Probleme. Den Rest findet man mit Tastatur, Screenreader und Zoom, und vor allem mit Menschen, die diese Hilfsmittel täglich nutzen.
Lernziel: Du kannst Bedienelemente mit Rolle, Name und Zustand beschreiben, passende Alternativtexte schreiben und eine Seite in drei Stufen prüfen.
Was nicht getestet ist, ist nicht barrierefrei.
5.1 / Rolle, Name, Zustand
Ein Screenreader liest, was der Code sagt.
Für Hilfsmittel muss jedes Bedienelement drei Fragen beantworten:
01
Rolle
Was ist es?
02
Name
Wie heisst es?
03
Zustand
Wie steht es gerade?
Die erste Regel lautet: native HTML-Elemente vor ARIA. Ein echter button bringt Rolle, Tastatur und Fokus mit. ARIA ergänzt nur, was HTML nicht kann, etwa aria-expanded für ein Aufklappmenü.
Kein ARIA ist besser als falsches ARIA.
5.2 / Bilder beschreiben
Der Alternativtext ersetzt das Bild.
Ein Alternativtext sagt in einem Satz, was das Bild im Zusammenhang bedeutet: bei einem Diagramm die Aussage, bei einem Foto das Wesentliche, bei einem Button das Ziel. «Bild von» ist überflüssig, das sagt der Screenreader schon.
Rein dekorative Bilder bekommen ein leeres Alternativattribut (alt=""), damit sie übersprungen werden. Komplexe Grafiken brauchen zusätzlich eine ausführliche Beschreibung oder eine Tabelle mit den Daten.
Beschreibe die Bedeutung, nicht die Pixel.
5.3 / Testen und dokumentieren
Automatisch, von Hand und mit Menschen.
Ein guter Test hat drei Stufen: Automatische Werkzeuge wie WAVE oder axe finden fehlende Labels und schwache Kontraste. Der Test von Hand mit Tastatur, Zoom und Screenreader findet Probleme im Ablauf. Tests mit Menschen mit Behinderungen zeigen, ob es wirklich funktioniert.
Was gefunden wird, kommt mit Priorität in die Planung. Viele Organisationen veröffentlichen eine Erklärung zur Barrierefreiheit: Was ist erfüllt, was noch nicht, und wie kann man Probleme melden?
Testen ist ein Ablauf, kein Abschluss.
Übung
Ein kleines Audit
Aufgabe: Prüfe eine Seite deines Projekts in drei Stufen.
SCHRITT 1
Lass ein automatisches Prüfwerkzeug laufen und notiere die Fehler.
SCHRITT 2
Teste von Hand: Tastatur, Zoom auf 200 %, Screenreader auf dem Handy.
SCHRITT 3
Prüfe alle Bilder und Icons auf passende Alternativtexte.
SCHRITT 4
Schreib eine kurze Erklärung: erfüllt, offen, nächster Schritt.
Auswertung: Welche Fehler fand das Werkzeug, welche nur du, und was hat dich beim Screenreader am meisten überrascht?