UX-Glossar
Screenreader
Ein Screenreader ist eine Software, die Inhalte auf dem Bildschirm vorliest oder auf einer Braillezeile ausgibt. Viele blinde und sehbehinderte Menschen bedienen damit Computer und Smartphone.
Stell dir vor, du schließt die Augen und sollst auf einer Website einen Arzttermin buchen. Du hörst nur eine Stimme, die dir der Reihe nach vorliest, was auf der Seite steht: „Link. Link. Bild. Link. Button.“ Wohin führen diese Links? Was zeigt das Bild? Und welcher Button bucht den Termin?
So erleben viele blinde Menschen schlecht gebaute Websites. Das Werkzeug, mit dem sie arbeiten, heißt Screenreader.
Einfach erklärt
Ein Screenreader (deutsch auch Bildschirmleseprogramm) ist eine Software, die das, was auf dem Bildschirm passiert, in Sprache oder Blindenschrift übersetzt. Die Sprachausgabe liest Texte, Bedienelemente und Statusmeldungen vor. Alternativ gibt der Screenreader die Inhalte auf einer Braillezeile aus, einem Gerät mit beweglichen Stiften, die Punktschrift fühlbar machen.
Ein Vergleich aus dem Alltag: Ein Screenreader ist wie eine Person, die dir am Telefon eine Website beschreibt. Sie kann dir aber nur sagen, was im Code steht. Ist ein Button nicht als Button erkennbar oder fehlt einem Bild die Beschreibung, weiß auch sie nicht weiter.
Wie Menschen mit Screenreader eine Seite nutzen
Kaum jemand hört sich eine Website von oben bis unten an. Stattdessen springen Menschen mit Tastenkürzeln oder Wischgesten gezielt durch die Seite: von Überschrift zu Überschrift, durch eine Liste aller Links oder direkt zu Bereichen wie Navigation und Hauptinhalt. In der Screen Reader User Survey von WebAIM (2023/24, 1.539 Antworten) gaben 71,6 Prozent an, auf langen Seiten zuerst über die Überschriften zu navigieren. Viele erfahrene Menschen stellen die Sprachausgabe außerdem sehr schnell ein, oft auf 300 Wörter pro Minute und mehr.
Die bekanntesten Programme sind JAWS und das kostenlose Open-Source-Programm NVDA unter Windows, VoiceOver auf Geräten von Apple und TalkBack unter Android. Laut derselben Umfrage nutzen 91,3 Prozent der Befragten einen Screenreader auch auf dem Smartphone oder Tablet.
Ein Beispiel
Ein Beispiel: Ein Online-Kochmagazin hat eine Rezeptseite mit fett formatierten Zwischenzeilen statt echter Überschriften, Links mit dem Text „hier klicken“ und einem Lupen-Icon für die Suche, das keine Beschriftung hat. Der Screenreader liest „Button“ vor, mehr nicht. Wer nach Zutaten springen will, findet keine Überschrift dafür.
Nach der Überarbeitung sind „Zutaten“ und „Zubereitung“ echte H2-Überschriften, die Links heißen „Rezept für Linsensuppe öffnen“, und das Lupen-Icon wird als „Suche“ angesagt. Die Seite sieht exakt gleich aus. Für Menschen mit Screenreader ist sie jetzt aber in Sekunden durchsuchbar.
Warum das wichtig ist
Screenreader sind auf saubere Semantik angewiesen, also darauf, dass jedes Element im Code das ist, was es zu sein scheint. Genau diese Anforderungen beschreiben die WCAG: Alternativtexte für Bilder, beschriftete Formularfelder, eine logische Überschriftenstruktur und verständliche Linktexte. Gute Struktur hilft dabei allen, auch Suchmaschinen und Menschen, die Texte nur überfliegen. Wie du Inhalte entsprechend aufbaust, zeigt der Artikel Wie man Inhalte richtig strukturiert.
In der Praxis
- Teste selbst mit einem Screenreader. VoiceOver ist auf jedem Mac und iPhone vorinstalliert, NVDA ist für Windows kostenlos. Schon zehn Minuten auf der eigenen Startseite zeigen die größten Lücken. Weitere Prüfmethoden findest du im Artikel Accessibility-Prüfung: Werkzeuge und Methoden für UX-Designer.
- Bau eine klare Überschriftenstruktur. Eine H1 pro Seite, darunter H2 und H3 in logischer Reihenfolge. Überschriften sind für viele Menschen mit Screenreader das Inhaltsverzeichnis der Seite.
- Schreib Links und Buttons, die allein verständlich sind. „Mehr erfahren“ zehnmal hintereinander hilft niemandem. Besser ist ein Text, der das Ziel nennt.
Verwandte Begriffe
Barrierefreiheit, WCAG, Microcopy