„aria-hidden“ im Video: HTML-Seiten für die iPhone-Vorlesefunktion optimieren

Blinde. Wir bleiben beim Thema. Dank des in iOS integrierten Screen-Readers, lassen sich fast alle Inhalte die auf dem iPhone-Display angezeigt werden auch vorlesen. Die Sprachausgabe – ifun.de berichtete – kann mit einer einfachen Zwei-Finger-Geste aktiviert werden und liest anschließend die Menü-Elemente der aktiven App, die Bluetooth-Optionen der iPhone-Einstellungen oder auch die gerade aktive Webseite vor.

Dies funktioniert jedoch nicht immer problemlos. Stellenweise kämpft sich das iPhone durch Menü-Beschreibungen, Info-Texte und Knöpfe, die blinden iPhone-Nutzern eher die Zeit stehlen, als dafür sorgen Informationen zu vermitteln. Ein Problem mit dem auch ifun.de zu kämpfen hatte.

So schriebt uns Leser Dirk heute:

Hallo, ich bin euch ja schon mehrfach “auf die Nerven gegangen“ wegen der iOS-Vorlesen-Funktion mit eurer App. Mit iOS 8 gibt es ja nun das super Feature zum Vorlesen des Bildschirminhalts (ihr berichtetet ja darüber bereits). Leider ist euer aktuelles Web-Layout hinter der App nicht wirklich dafür geeignet.

Asche auf unser Haupt. Wir haben uns schlau gemacht, durch die Dokumentationen der Accessibility APIs des HTML 5-Standards gelesen und sind auf das „aria-hidden„-Element aufmerksam geworden.

HTML-Elemente, die zwar angezeigt, von Bildschirm-Lesern aber ignoriert werden sollen, können bei Bedarf einfach mit aria-hidden=“true“ ausgezeichnet werden. Entsprechend gekennzeichnete Stellen werden von der Vorlesefunktion anschließend ignoriert, sind aber weiterhin sichtbar.