Barrierefreiheit der Website: die Kontrollen, die Menschen bei der Nutzung helfen

Der schnellste Weg herauszufinden, ob eine Website nutzbar ist, ist der Versuch, die Angebotsanfrage auszufüllen, ohne die Maus zu berühren. Gelingt das nicht — weil der Cursor verschwindet, weil ein Feld nicht erreichbar ist, weil der Button nicht reagiert —, dann gibt es Menschen, die Ihnen nicht schreiben können, und Sie werden es nie erfahren: Wer es nicht schafft, schickt keine Meldung, sondern schließt die Seite.

Barrierefreiheit wird an Wegen geprüft, nicht an Seiten im Abstrakten. Die Wege, auf die es ankommt, sind zwei oder drei: die Leistung finden, verstehen, ob sie passt, anfragen. Dieser Leitfaden hilft dabei, sie mit den eigenen Händen zu prüfen und das Gefundene in zugewiesene Korrekturen zu verwandeln.

Vier Kontrollen, die in zehn Minuten gehen, ohne Werkzeuge

1. Die Tastatur. Von der ersten Zeile der Seite aus muss man mit der Tabulatortaste jeden Link, jedes Feld und jeden Button erreichen können, in einer Reihenfolge, die dem Lesefluss folgt. Versuchen Sie, das Menü zu öffnen, ein von selbst erscheinendes Fenster zu schließen, das Formular abzuschicken.
2. Der aktive Fokus. Während man sich mit der Tastatur bewegt, muss immer sichtbar sein, wo man sich befindet: ein Rahmen, eine Farbe, irgendetwas. Viele Designs entfernen ihn, weil er als unästhetisch gilt: Das ist der häufigste und zugleich am leichtesten zu behebende Fehler.
3. Der Kontrast. Hellgrauer Text auf Weiß, Schrift über einem Foto, Buttons mit Beschriftung in fast derselben Tonlage wie der Hintergrund. Das sind die Stellen, an denen man Leser verliert, die bei Sonnenlicht auf einen Bildschirm schauen oder mit müden Augen lesen — also früher oder später fast alle.
4. Die Hierarchie der Überschriften. Eine Hauptüberschrift pro Seite, dann Abschnitte und Unterabschnitte in Reihenfolge, ohne Sprünge und ohne Überschriften, die nur benutzt werden, um Text größer wirken zu lassen. So überfliegt man eine Seite, wenn man sie nicht als Ganzes sieht.

Bilder, Formulare und Fehlermeldungen

Die zweite Runde betrifft das, was eine Seite mitteilt, wenn man sie nicht als Ganzes betrachtet.

• Alternativtexte: Sie beschreiben, wozu das Bild an dieser Stelle dient, nicht was zu sehen ist. Das Logo wird mit dem Firmennamen beschrieben; ein dekoratives Foto braucht keine Beschreibung; ein Schaubild, das eine Information trägt, muss vollständig beschrieben werden, oder die Information muss auch im Text stehen.
• Feldbeschriftungen: Jedes Feld hat seine eigene, sichtbare und mit dem Feld verbundene Beschriftung. Der graue Text im Feld selbst ist keine Beschriftung: Er verschwindet, sobald man zu schreiben beginnt, und wer abgelenkt wird, weiß nicht mehr, was er gerade ausfüllte.
• Fehlermeldungen: Sie müssen sagen, welches Feld betroffen ist und was zu korrigieren ist, sichtbar bleiben und nicht nur von der Farbe abhängen. Ein roter Rahmen allein ist keine Meldung.
• Pflichtfelder: Sie werden vorher angegeben, nicht erst nach dem gescheiterten Sendeversuch. Und das Formular darf nicht löschen, was bereits eingegeben wurde.

Automatische Werkzeuge und manuelle Tests

Automatische Werkzeuge sind nützlich und reichen nicht aus: Sie finden, was zählbar ist, nicht, was sinnvoll ist. Beide werden gebraucht, und es lohnt sich zu wissen, was man von jedem erwarten kann.

Die praktische Regel: Das Automatische läuft einmal, um das Grobe zu beseitigen, und dann bei jeder Veröffentlichung; das Manuelle wird bei jeder Änderung der Hauptwege wiederholt, weil nur es sagt, ob eine Person wirklich bis zum Ende kommt.

Ein Testprotokoll für die Angebotsanfrage

Einmal geschrieben, wird es jedes Mal gleich wiederholt, wenn sich die Website ändert. Eine einzige Person führt es in einer halben Stunde durch und notiert, wo sie hängen geblieben ist und was sie erraten musste.

1. Die Startseite öffnen und die Leistungsseite nur mit der Tastatur erreichen. Notieren, wie viele Schritte nötig sind und ob immer sichtbar ist, wo man sich befindet.
2. Den Text mit dem Browserbefehl bis zur doppelten Größe vergrößern. Prüfen, dass nichts verschwindet, dass das Menü weiterhin geöffnet werden kann und dass keine horizontale Scrollleiste erscheint.
3. Das Formular mit der Tastatur ausfüllen, dabei absichtlich ein Pflichtfeld leer lassen und die E-Mail-Adresse falsch schreiben. Prüfen, dass der Fehler ausgeschrieben, erreichbar und verständlich ist, ohne auf die Farbe zu achten.
4. Korrigieren und absenden. Prüfen, dass die Bestätigung ein Text ist, der gelesen und wiedergefunden werden kann, nicht nur ein Farbwechsel oder ein Symbol.
5. Den Weg vom Smartphone aus wiederholen, mit nur einer Hand, und dann im Querformat.
6. Den ersten Schritt mit aktivierter Bildschirmvorlesefunktion wiederholen, auch nur mit der bereits im Betriebssystem vorhandenen. Es braucht keine Expertise, um zu merken, dass ein Button nur als „Button“ angesagt wird und sonst nichts.

Korrekturen zuweisen und erneut prüfen

Eine Liste von Problemen ohne einen Namen daneben führt zu keinen Korrekturen. Jeder Eintrag braucht vier Angaben: wo es passiert, was dadurch verhindert wird, wer es korrigiert, wie geprüft wird, dass es gelöst ist. Die Reihenfolge ist nicht die, in der die Probleme gefunden wurden.

• Zuerst, was das Abschließen eines Weges verhindert: Ein Formular, das nicht abgeschickt werden kann, kommt vor einem etwas schwachen Kontrast.
• Dann, was sich über die ganze Website wiederholt: Der unsichtbare aktive Fokus oder fehlende Beschriftungen werden einmal in der Seitenvorlage korrigiert und gelten überall.
• Zum Schluss die Einzelfälle, Seite für Seite, die oft Inhalt und nicht Code betreffen: eine Beschreibung, die umzuschreiben ist, eine Überschrift, die an der falschen Stelle verwendet wird.
• Nach jeder Korrektur wird das Protokoll vollständig auf den betroffenen Wegen wiederholt. Korrekturen zur Barrierefreiheit lösen sich bei der ersten Designänderung oder der ersten hinzugefügten Komponente leicht wieder auf.

Was dieser Leitfaden nicht abdeckt

Hier wird geprüft, ob die Website nutzbar ist, nicht, ob sie eine gesetzliche Vorgabe erfüllt: Die Anwendbarkeit von Vorschriften, formale Prüfungen und etwaige Erklärungen erfordern spezialisierte Kompetenz und müssen separat bewertet werden. Ebenfalls nicht behandelt wird, welche Fragen in ein Kontaktformular gehören — das ist eine Frage des Inhalts, nicht der Barrierefreiheit —, noch der allgemeine Abnahmetest vor dem Onlinegang, der viele weitere Prüfungen über diese hinaus umfasst.