Screenreader-Grundlagen

Ein Screenreader liest die Bedienoberfläche vor oder gibt sie auf einer Braillezeile aus – er ist für viele blinde und stark sehbehinderte Menschen das Fenster zum Web. Zu verstehen, wie so ein Programm eine Seite „sieht“, verändert den Blick aufs eigene Markup grundlegend. Plötzlich ist nachvollziehbar, warum semantisches HTML und saubere Struktur keine Theorie sind, sondern hörbar den Unterschied machen.

Und die beste Nachricht: Man muss kein Profi sein, um mit einem Screenreader die eigene Seite zu testen. Eine Stichprobe ist schnell gemacht und überraschend lehrreich.

Die gängigen Screenreader

Zum Testen unter Windows ist NVDA die naheliegende Wahl (gratis), auf dem Mac ist VoiceOver schon da. Beide reichen für aussagekräftige Stichproben völlig aus.

Wie ein Screenreader eine Seite erfasst

Der häufigste Irrtum: dass alles stur von oben nach unten vorgelesen wird. In Wirklichkeit navigieren die Nutzenden gezielt – und zwar über die Struktur, die dein Markup vorgibt:

• nach Überschriften springen (die Überschriften-Hierarchie wird zum Inhaltsverzeichnis),
• zu Landmarks wie <nav>, <main>, <footer> springen (siehe Landmarks & Outline),
• sich alle Links oder Formularfelder als Liste ausgeben lassen,
• Element für Element durch den Inhalt gehen.

Das heißt im Umkehrschluss: Gibt es keine sinnvollen Überschriften, keine Landmarks, keine verknüpften Labels, dann fehlen genau die Sprungmarken, von denen diese Navigation lebt. Eine „Div-Suppe“ ist für einen Screenreader eine glatte, orientierungslose Fläche.

Lese- und Formularmodus

Ein Detail, das beim ersten Testen oft verwirrt: Screenreader kennen zwei Modi. Im Lesemodus (Browse Mode) blättert man frei durch die Inhalte; sobald man in ein Eingabefeld kommt, schaltet der Screenreader in den Formularmodus (Focus Mode), in dem Tastendrücke ins Feld gehen. Der Wechsel passiert meist automatisch – gut zu wissen, wenn die Tastatur sich plötzlich „anders“ verhält.

So machst du eine schnelle Stichprobe

• VoiceOver (Mac): mit Cmd + F5 ein- und ausschalten. Mit **VO (Ctrl + Alt)
  • Pfeiltasten** durch die Seite gehen; der Rotor (VO + U) listet Überschriften und Links.
• NVDA (Windows): installieren und starten, dann mit den Pfeiltasten lesen; H springt zur nächsten Überschrift, D zur nächsten Landmark, F zum nächsten Formularfeld.

Worauf ich höre: Werden Überschriften und Landmarks angekündigt? Haben alle Bedienelemente einen sinnvollen Namen? Ergeben Links auch außerhalb des Kontexts Sinn („mehr“ allein tut das nicht)? Werden dynamische Änderungen angesagt? Das sind die Stellen, an denen sich gutes Markup auszahlt.

Stichprobe, nicht Stellvertretung. Ein eigener Test mit dem Screenreader deckt viel auf, macht dich aber nicht zur erfahrenen Nutzerin. Für belastbare Aussagen sind Tests mit Menschen, die täglich damit arbeiten, durch nichts zu ersetzen.

Häufige Fragen

Muss ich mehrere Screenreader testen?

Für den Anfang nicht. Ein kostenloser (NVDA oder VoiceOver) reicht, um die meisten Probleme zu finden. Unterschiede zwischen den Programmen sind eher etwas für tiefere Audits.

Ich finde die Bedienung verwirrend – mache ich etwas falsch?

Wahrscheinlich nicht. Screenreader haben eine Lernkurve, und die ersten Minuten fühlen sich für Sehende immer ungewohnt an. Schon eine grobe Stichprobe bringt Erkenntnisse – es muss nicht perfekt sein.

Was hilft Screenreader-Nutzung am meisten?

Sauberes, semantisches HTML: echte Überschriften, Landmarks, Listen, verknüpfte Labels und Buttons. Fast alles, was diese Website behandelt, zahlt darauf ein – die Mühe wird hier unmittelbar hörbar.

Fazit

Screenreader navigieren über die Struktur des Dokuments – Überschriften, Landmarks, Links, Formularfelder. Wer das verstanden hat, sieht, warum semantisches Markup so entscheidend ist: Es ist die praktische Seite der WCAG-Prinzipien „wahrnehmbar“ und „robust“. Eine eigene Stichprobe mit NVDA oder VoiceOver ist schnell gemacht, sehr lehrreich und ein fester Teil meines Testablaufs – ganz ersetzen kann sie das Testen mit echten Nutzenden aber nicht.