Orientierung unter der Haube-Screenreader im Quellcode

Skiplinks
Skiplinks

Die Technik der Cascading StyleSheets (CSS abgekürzt) ermöglicht es, das Aussehen einer Website völlig unabhängig von der Anordnung der einzelnen Elemente im Quellcode zu gestalten. Screenreader, Vorlesegeräte für blinde Menschen, lesen den Quellcode einer Website vor.

Jetzt stellte sich die Frage, wie sich blinde Menschen zurechtfinden, wenn der Inhalt vor der Navigation im Quellcode steht.

Roger Hudson, Russ Weakley and Lisa Miller untersuchten dies und kamen zum Ergebnis:

Die meisten Screenreader Nutzer erwarten zumindest die Hauptnavigation vor dem Inhalt.
Die Anordnung des Quelltextes hat für die wenigsten eine Relevanz.
über die Hälfte der Testpersonen fanden sogenannte Sprunglinks sehr hilfreich.
Alle Testpersonen fanden Überschriften in der Navigation als ausgesprochen hilfreich. Source Order, Skip links and Structural labels

Getestet wurde mit zwei sehr einfachen, unterschiedlichen Websites. Als Sprunglinks gab es die Auswahl: Zum Inhalt, Zur Navigation.

Hier auf webdesign-in.de sind drei Sprunglinks im Quelltext:


<!-- zu den Menues und zum Inhalt-->
<a class="invisible" href="#artikel"  accesskey="1" title=" zum Inhalt">zu den Artikeln</a><span class="invisible">|</span>
<a class="invisible" href="#inhalt"  accesskey="2" title=" zu den inhaltlich weiterführenden Links">Links zu mehr Inhalt</a><span class="invisible">|</span>
<a class="invisible" href="#vorstell"  accesskey="3" title="Kontaktlinks und zur Sitemap">Kontakt und Sitemap</a><span class="invisible">|</span>


Da sich jeder Screenreader Nutzer aussuchen kann, ob er sich den title tag vorlesen läßt oder nicht, versuchte ich die Texte in den Links aussagekräftig zu halten.
Diese Sprunglinks sind hier für sehende Nutzer unsichtbar, doch man kann diese auch als sichtbare Elemente zur Verfügung stellen.

Überschriften in der Navigation

Damit ein blinder Mensch auswählen kann, ob nachfolgende Links innerhalb einer Navigation für ihn von Interesse sind oder nicht, sind Überschriften, die die Navigation strukturieren äußerst hilfreich.

Wenn Sie Bilder statt Texte für diese Strukturierung nutzen, verwenden Sie zumindest aussagekräftige “alt” Texte oder Quelltextkommentare. Text als Überschrift ist jedoch am besten.

<h3>WebDesign</h3>
...alle links...
<h4>barrierefrei</h4>
..alle links...


mts

Ebenfalls informativ und lesenswert

Deine / Ihre Meinung zu...

Name und E-Mail Adresse sind nötig. Die E-Mail Adresse wird niemals veröffentlicht.