Was Sie brauchen
- Windows: NVDA, ein kostenloser Open-Source-Screenreader, zusammen mit Firefox oder Chrome.
- Mac: VoiceOver ist eingebaut, am besten mit Safari.
- iPhone oder iPad: VoiceOver ist ebenfalls eingebaut.
- Kopfhörer, etwas Ruhe und eine Liste mit zwei, drei typischen Aufgaben, etwa „Produkt finden und in den Warenkorb legen“ oder „Kontaktformular absenden“.
Rechnen Sie damit, dass sich die ersten Minuten ungewohnt anfühlen. Senken Sie die Sprechgeschwindigkeit nicht zu weit ab, aber so, dass Sie folgen können.
NVDA unter Windows: die wichtigsten Tasten
Die NVDA-Taste ist standardmäßig die Einfügen-Taste; bei der Laptop-Belegung kann auch die Feststelltaste dienen. Auf Webseiten arbeitet NVDA im Lesemodus: Einzelne Buchstaben springen dann zu Elementen.
| Taste | Wirkung |
|---|---|
H / Umschalt+H | nächste / vorige Überschrift |
1 bis 6 | nächste Überschrift dieser Ebene |
D | nächste Landmarke (Bereich) |
K | nächster Link |
F | nächstes Formularfeld |
T | nächste Tabelle |
NVDA+F7 | Elementliste: alle Überschriften, Links, Landmarken |
NVDA+Leertaste | zwischen Lesemodus und Fokusmodus wechseln |
Strg | Sprachausgabe sofort anhalten |
| Pfeil runter | Zeile für Zeile weiterlesen |
In Formularfeldern wechselt NVDA meist von selbst in den Fokusmodus, damit Sie tippen können.
VoiceOver auf dem Mac
Mit Befehl+F5 schalten Sie VoiceOver ein und aus. Die VoiceOver-Taste (kurz VO) ist Control+Option.
VO+Pfeil rechts/VO+Pfeil links: zum nächsten / vorigen Element.VO+U: Rotor öffnen. Mit Pfeil links und rechts wechseln Sie zwischen Listen von Überschriften, Links, Formularelementen und Landmarken, mit Pfeil hoch und runter wählen Sie ein Element.VO+Leertaste: das aktuelle Element aktivieren.Control: Sprachausgabe anhalten.
VoiceOver auf dem iPhone
VoiceOver aktivieren Sie unter Einstellungen, Bedienungshilfen, VoiceOver. Richten Sie vorher den Kurzbefehl für Bedienungshilfen ein, damit Sie es schnell wieder ausschalten können. Mit VoiceOver gilt:
- Einmal tippen wählt ein Element aus und liest es vor.
- Nach rechts oder links wischen springt zum nächsten oder vorigen Element.
- Doppeltippen aktiviert das ausgewählte Element.
- Zwei Finger auf dem Bildschirm drehen öffnet den Rotor, etwa um nach Überschriften zu springen; dann nach oben oder unten wischen.
Worauf Sie achten
- Seitentitel: Wird beim Laden ein sinnvoller Titel angesagt (2.4.2 Seite mit Titel)?
- Überschriften: Ergibt die Liste in der Elementliste oder im Rotor ein Inhaltsverzeichnis der Seite (1.3.1 Info und Beziehungen, 2.4.6 Überschriften und Beschriftungen)?
- Landmarken: Gibt es Kopfbereich, Navigation, Hauptinhalt und Fußbereich?
- Links und Buttons: Sind die Namen auch ohne Umgebung verständlich, oder hören Sie zehnmal „Mehr“ (2.4.4 Linkzweck (im Kontext))?
- Bilder: Hören Sie sinnvolle Alternativtexte, Dateinamen oder gar nichts (1.1.1 Nicht-Text-Inhalt)?
- Formulare: Wird zu jedem Feld die Beschriftung angesagt, und hören Sie Fehlermeldungen (3.3.1 Fehlererkennung)?
- Dynamik: Erfahren Sie, wenn etwas in den Warenkorb gelegt wurde oder ein Dialog aufgeht (4.1.3 Statusmeldungen)?
Befunde festhalten
Notieren Sie zu jedem Problem: Seite und Schritt, was Sie erwartet haben, was Sie gehört haben, und welcher Screenreader mit welchem Browser im Einsatz war. Ein kurzer Satz wie „Warenkorb-Button wird nur als ‚Schaltfläche‘ angesagt“ reicht dem Entwicklungsteam meist. Ordnen Sie den Befund einem Kriterium aus dem Kriterien-Lexikon zu, dann lässt sich die Lösung schneller finden.
Ein eigener Test ersetzt nicht die Erfahrung von Menschen, die täglich mit Screenreader arbeiten. Bei unserem Audit gehört ein Screenreader-Durchgang fest dazu.
Schritt für Schritt
0 von 7 erledigt
Ihre Häkchen bleiben nur in diesem Browser-Tab und werden nirgends gespeichert.
Passende WCAG-Kriterien
- 1.1.1 Nicht-Text-Inhalt
- 1.3.1 Info und Beziehungen
- 2.4.2 Seite mit Titel
- 2.4.4 Linkzweck (im Kontext)
- 2.4.6 Überschriften und Beschriftungen
- 3.3.1 Fehlererkennung
- 4.1.2 Name, Rolle, Wert
- 4.1.3 Statusmeldungen
Werkzeuge und Muster dazu
- Ohne Maus ans Ziel: Tastatur und FokusViele Menschen bedienen das Web ohne Maus: mit Tastatur, Schaltern, Sprachsteuerung oder Screenreader. Hier lesen Sie, was dafür funktionieren muss und wie Sie den Fokus in modernen Web-Apps richtig führen.
- Formulare, die jeder ausfüllen kannAm Formular entscheidet sich, ob jemand kauft, bucht oder aufgibt. Hier lesen Sie, wie Beschriftungen, Pflichtfelder und Fehlermeldungen gebaut sein müssen, damit es mit Tastatur, Screenreader und Vergrößerung klappt.
- ChecklistenFür Design, Entwicklung, Redaktion
- PrüfmethodeAlle 55 Kriterien offen beschrieben
Häufige Fragen
Welcher Screenreader ist der richtige für einen Test?
Testen Sie mit dem, den Ihre Zielgruppe wahrscheinlich nutzt. Für einen Einstieg eignen sich NVDA unter Windows und VoiceOver auf Mac und iPhone, weil beide ohne Kosten verfügbar sind.
Reicht ein automatischer Scan nicht aus?
Nein. Ein Scan findet viele technische Fehler, kann aber nicht beurteilen, ob eine Ansage verständlich ist oder ein Ablauf funktioniert. Dafür braucht es den Test von Hand.
Warum klingt NVDA in Formularen anders?
NVDA wechselt in Eingabefeldern in den Fokusmodus, damit Tastendrücke im Feld ankommen. Mit NVDA+Leertaste schalten Sie zwischen Lese- und Fokusmodus um.
Quellen
Wie steht Ihre Website da?
Der kostenlose Check prüft Ihre Startseite in zwei Minuten. Das Audit entscheidet alle 55 Kriterien, durch einen Menschen.