Blog #3

Digitale Barrierefreiheit: Entwicklung

Die Entwicklung trägt mit 80% am meisten zur Gewährleistung von digitaler Barrierefreiheit bei. Der HTML Code muss sauber aufbereitet sein, und alle Tags müssen sinnvoll verwendet werden.

Eine gängige und schnelle Methode zur Erstellung von HTML-Code ist die Verwendung von Div-Containern. Allerdings ist ein Code, der ausschließlich aus “divs” besteht, für E-Reader nicht informativ und kann nicht eindeutig identifiziert werden. Um die Barrierefreiheit zu gewährleisten, muss der Code so strukturiert sein, dass er von Hilfstechnologien interpretiert werden kann. Dies erfordert den sinnvollen Einsatz geeigneter HTML-Tags, um eine korrekte Lesbarkeit durch assistierende Software zu ermöglichen.                          

Das Gerüst eines Codes kann mit einem Haus und seinen Innenräumen verglichen werden:

Beispiel <div></div><div></div><div></div><div></div><div></div>

Betritt man das Haus, und man steht vor weiteren Türen, die nicht beschriftet sind, weiß der E-Reader nicht wo er zuerst hineinsehen soll, was sich darin befindet (ob es möglicherweise sogar irrelevant ist?) ob er den Raum betreten möchte und wie lange er sich in einem Raum aufhalten möchte. So muss er jede Tür öffnen, und nachsehen.

Beispiel: <section><div><h1><h2><p></p></h2><h1></div><article><img><h1><h2><p></p></article></section>

Sind die Räume allerdings beschriftet und haben sogar eine Kurzbeschreibung an der Wand hängen: “Hier geht’s zum Menü, darin befindet sich eine Sitemap mit diesen Links, ein Bild in Form eines Logos und zwei Icons, die auf die Social-Media Plattformen Facebook und Linked In verweisen.“ damit weiß der E-Reader und somit auch die Person, dass man auf diesem Weg zum Menü kommt. In einem anderen Raum befindet sich zum Beispiel ein Web-Shop oder andere Bereiche einer Website.

Keine Automatischen Slideshows einbauen,

welche nicht bedienbar sind! User*innen sollen selbst weiterklicken können, da sehbeeinträchtigte Menschen durchaus mehr Zeit brauchen können, um Bilder zu erkennen und E-Reader sonst nicht mitlesen können.

Mehrere Optionen für User*innen bereithalten

Zudem soll es auch mindestens zwei Auswahlmöglichkeiten geben, was die Ausgabe der Bedienhilfen betrifft. Mehr Sinne geben nicht nur mehr Information, sondern inkludieren mehr Menschen. Wenn ein Video beispielsweise nur vorgelesen werden kann, aber es keine Untertitel oder schriftliche Beschreibung zu dem Video gibt, werden Gehörbeeinträchtigte automatisch ausgeschlossen.

Eingabemasken

Füllt man bei Eingabemasken ein Feld falsch aus, reicht es nicht, wenn dies mit einem roten Rahmen gekennzeichnet ist. Zusätzlich sollte ein Text unter der Eingabemaske erscheinen, der beschreibt, wieso das Feld falsch ausgefüllt wurde. Zudem ist es wichtig, dass es nicht am Ende des Formulars beim „Abschicken“ geprüft wird, sondern sobald die Eingabe von den Vorgaben abweicht.

Der Tastaturfocus

Die Tabulatortaste und die Pfeiltasten dienen als unterstützende Bedienhilfe, um durch die Website und Links zu navigieren. Es ist wichtig, dass der aktuell ausgewählte Tab klar und deutlich hervorgehoben wird, und dies geschieht durch den Tastaturfokus.

Es sei darauf hingewiesen, dass die Handhabung des Tastaturfokus bei Pop-ups, wie beispielsweise Cookie-Bannern am Anfang der Seite, herausfordernd sein kann. In solchen Fällen kommt es nicht selten vor, dass Benutzer*innen, sobald sich das Pop-up öffnet, sich zwar im Pop-up-Menü mithilfe der Tabulatortaste orientieren können, jedoch Schwierigkeiten haben, wieder aus dem Pop-up herauszukommen. Dies erfordert eine spezielle Programmierung, um eine reibungslose Navigation für alle Benutzer*innen zu gewährleisten.

Skiplinks / Sprungmarken

Es ist empfohlen, Skiplinks (sogenannte Sprungmarken) einzubauen, um User*innen eine schnellere Navigation anzubieten, ohne dass sie sich, wenn sie in den Footer wollen, durch die gesamte Website mit der Tabulatortaste klicken müssen.

Diese Skiplinks können im Code mittels Anker ( <a href=“https://examp.le“ id=“anker“>Das ist ein Anker</a> ) gesetzt werden, damit sich Menschen mit taktiler Behinderung nicht durch das unendliche Menü klicken müssen, bevor sie zum eigentlichen Content gelangen.

In der Website https://www.hilfsgemeinschaft.at/ beim Drücken der Tabulatortaste öffnet sich ein solcher Skiplink. Die Hilfsgemeinschaft stellt hier ein best Practise dar. 

Veranschaulicht: Drücke taste 0, um im Hauptinhalt zu bleiben. Drücke Taste 1, um ins Hauptmenü zu gelangen. Drücke taste 3, um ins Suchfeld zu gelangen. Drücke Taste 4 für Kontakt daten… usw.

Best Pratices

https://www.hilfsgemeinschaft.at/
https://www.blindenverband.at/
https://www.myability.org/
https://www.kraft-rucksack.at/

Worst Practice/ Bad Practice

https://polizei.gv.at/
Leave a Reply

Your email address will not be published. Required fields are marked *