BITV Reloaded – Anforderung 13

Bedingung 13.6: Gruppierung und Umgehung von Linkgruppen (Prio. 2)

»Inhaltlich verwandte oder zusammenhängende Hyperlinks sind zu gruppieren. Die Gruppen sind eindeutig zu benennen und müssen einen Mechanismus enthalten, der das Umgehen der Gruppe ermöglicht.«

Was heißt das?

Eine Bedingung, die nur noch in Teilen anwendbar ist. Im englischen Original ist dies eine der »until user agents«-Checkpunkte, in der deutschen Übersetzung der WCAG 1.0 heißt es an dieser Stelle: »… und ermöglichen Sie das Überspringen der Gruppe, bis Benutzeragenten dies gestatten«.

Wenn sie Ihre Navigation in Listenform (OL oder UL) anlegen, so werden diese Listen von modernen Screenreadern erkannt und der Nutzer kann sie mit Tastaturbefehlen überspringen. Einige Screenreader besitzen mittlerweile sogar die Fähigkeit, sich wiederholende Elemente wie eine auf allen Seiten gleiche Navigation zu ignorieren. Sie müssen also nicht jeden einzelnen Block einer Navigation mit eigenen Sprungmarken versehen, da die Einschränkung aus den WCAG als erfüllt betrachtet werden kann.

Die Möglichkeit, ganze Bereiche einer Seite zu überspringen kann jedoch für eine ganze Reihe anderer Nutzungsszenarien hilfreich sein. Damit zum Kern der Bedingung: »Inhaltlich verwandte oder zusammenhängende Hyperlinks« lässt eigentlich nur den Schluß zu, dass es sich hier um Navigationsleisten oder ähnliches handeln muss. Dies kann sowohl die Hauptnavigation des Angebots sein als auch verschiedene Ebenen der Unter- oder Zusatznavigation.

Durch diese Bedingung sollen alternative Ausgabemedien in die Lage versetzt werden, den Benutzer bei der Ansteuerung und der Bedienung der Navigation zu unterstützen. In der Sprachausgabe und anderen nicht-grafischen Umgebungen fehlt der visuelle Kontext, mit denen sich Benutzer grafischer Browser auf einer Seite orientieren und ohne großen Aufwand zwischen den verschiedenen Inhaltsblöcken einer Seite springen können. Hierzu gehört auch die deutliche Kennzeichnung der Navigation über mehr als nur gestalterische Mittel, so zum Beispiel durch entsprechend getextete Überschriften, die den Navigationsebenen vorangestellt werden.

Für Nutzer mit motorischer Behinderung kann die Bedienung per Tastatur oder mit anderen Hilfsmitteln ausgesprochen mühselig sein, wenn Navigationsblöcke nicht zusammengefasst, sondern lose über die Seite verteilt präsentiert werden. Zur Unterstützung dieser Nutzer ist es sinnvoll, Navigationsblöcke über einen Verweis innerhalb der Seite direkt ereichbar zu machen. Auch der umgekehrte Fall, das Überspringen einer vorgeschalteten Navigation zum direkten Erreichen des eigentlichen Inhalts ist eine einfache Hilfe, die Sie Ihren Nutzern anbieten sollten. Falls Ihre Navigation im Quelltext vor dem eigentlichen Inhalt der Seiten steht ist diese Technik auch eine Hilfe für Screenreader-Nutzer, die so verhindern können, daß ihnen die Navigation immer wieder vorgelesen wird, bevor sie zum Inhalt der Seite kommen.

Dies geschieht in HTML über lokale Anker (a href="#inhalt>), die auf einen Punkt einer Seite mit einer bestimmten ID (div id="navigation">) verweisen. Dies sind genau die IDs, die man zur Identifizierung von Blöcken einsetzt, um per CSS Stile zuweisen zu können. Der leichte Einbau einer solchen Navigation innerhalb einer Seite ist also fast schon ein Abfallprodukt der CSS-Formatierung und entsprechend einfach umzusetzen. Daher sollten Sie diese Vorgabe abweichend von der BITV durchaus mit Priorität 1 behandeln.

Negative Beispiele:

Bei einem unkritischen und übermäßigen Einsatz von Skip-Links kann es jedoch passieren, dass Sie mehr Barrieren auf- als abbauen. So können dauerhaft sichtbare Skip-Links bei der rein visuellen Orientierung den Nutzer verwirren, wenn sie zwar immer angezeigt werden, aber keine offensichtliche Aktion auslösen, da das Linkziel sich wie üblich schon im sichtbaren Bereich befindet.

Auch die Methode, Skip-Links zwar einzubauen, sie dann aber dauerhaft per CSS zu verstecken ist keine optimale Lösung. Gerade für Tastaturnutzer ist es ausgesprochen verwirrend, wenn man erst fünfmal auf Tab drücken muss, um festzustellen, dass es eine ganze Batterie von versteckten Skip-Links gibt, deren Funktion man nur durch Entziffern der URL in der Statuszeile des Browsers erraten kann.

Positive Beispiele:

Eine elegante Lösung dieser Probleme ist auf den Seiten der Stadt Wien zu finden: die Skip-Links sind zunächst per CSS aus dem sichtbaren Bereich der Seite geschoben und werden in grafischen Desktop-Browsern erst bei Tastaturbedienung sichtbar. Sobald der Nutzer nach dem Laden der Seite die Tab-Taste drückt (und sich somit als Tastaturnutzer zu erkennen gibt) werden die Skip-Links (Zur Navigation springen und Zum Inhalt springen) per CSS in den sichtbaren Bereich der Seite geschoben und sind damit sowohl optisch wahrnehmbar als auch per Tastatur (Enter) auszulösen.

Wie können Sie das testen?

Um die angesprochenen unsichtbaren Skip-Links zu finden müssen sie in Ihrem Browser CSS abschalten. Am einfachsten geht dies wie üblich mit den Toolbars für Webentwickler, die über entsprechende Funktionen verfügen. Alternativ können Sie auch einen Sprachbrowser oder einen Screenreader verwenden und Ihren Monitor ausschalten. Versuchen Sie, sich nur per Sprachausgabe und Tastaturbedienung auf Ihren Seiten zu orientieren. Gelingt Ihnen dies in einer angemessenen Zeit (und ohne den Monitor wieder anzuschalten!), so haben Sie den Test bestanden.

Warnhinweis:

Das Leben des Webentwicklers wäre geradezu langweilig, wenn es nicht zu allem den passenden Internet Explorer-Bug gäbe. So auch hier: Skip Links funktionieren im IE nur, wenn das Linkziel in einem Block-Element mit definierter Breite liegt. Mehr zu dieser Problematik im Artikel »On having layout — the concept of hasLayout in IE/Win« von Ingo Chao.