Einführung Links und Hypertext

Von

Übersicht

Hypertext Links gehören zu den grundlegenden Elementen von (HTML stands for HyperText Markup Language). Die Programmiersprache HTML steht für HyperText Markup Language. Hypertext-Links im World Wide Web, sind sehr wichtige Aspekte für Barrierefreiheit und Usability.

Die Standard Hypertext-Links funktionieren mit den bekannten Technologien, Plattformen und Betriebssystemen einwandfrei. Nutzer können entweder direkt per Tastatur auf diese zugreifen oder technische Hilfsmittel nutzen. Hypertext-Links sind ganz einfache Links, die sich meistens auf ein Schlagwort reduzieren.

Einige Arten von Links sind gut zugänglich für Menschen mit bestimmten Arten von Behinderungen, andere sind jedoch völlig unzugänglich. Da Links aber die Basis einer Funktionalität von Webinhalten sind, stellt das Navigieren durch Inhalte von Websites, für behinderte Menschen oft ein Problem da. Hypertext-Links können Behinderten Usern da helfen.

Links über die Tastatur erreichen

Website Benutzer müssen in der Lage sein allein über die Tastatur zu navigieren oder zwischen einzelnen Links auszuwählen. Mit der Tab Taste auf der Tastatur kann der User zu den einzelnen Hyperlinks springen und mit der Enter Taste „anklicken“. Mit einem JavaScript-Event-Handler erstellte Links, die generell nur über die Mouse erreichbar sind (siehe auch Artikel zu JavaScript Event-Handler), sind nicht barrierefrei. Weitere typische Möglichkeiten, um Links Tastatur Benutzern unzugänglich zu machen – sind z.B. auch Verlinkungen in JAVA oder Flash Technologien zu integrieren. Beide Technologien bieten zwar auch Unterstützung für Barrierefreiheit, es ist allerdings vergleichbar unkomplizierter barrierefreie HTML Links in ein HTML Dokument zu integrieren. Entwickler sollten die Zugänglichkeit ihrer Projekte mit Bedacht planen und Einschränkungen von z.B. behinderten Tastaturbenutzern berücksichtigen.

Wichtig

Links müssen einen nicht leeren href Attribut haben, um als echte Links erkannt zu werden und von Tastatur-Nutzern verwendet werden zu können.

Manche Entwickler verwenden kein barrierefreies JAVA Script für Ihre Dropdown Navigationen. Hinter einem Link bzw. Menü-Punkt verbergen sich oft weitere Links oder Inhalte, die bei einem Mouse Over sichtbar und anklickbar werden. Dabei haben die Hauptnavigationspunkte oft gar kein eigenes Linkziel außer z.B. # (entspricht der gleichen Seite auf der man sich befindet) und dienen nur dem Zweck, bei Mouse Over weitere Inhalte anzuzeigen. Klickt aber ein Tastatur Benutzer auf diesen Link, werden keine weitere Inhalte mehr angezeigt. Im Grunde genommen ist eine Verlinkung auf # nicht nötig, da weder dem Tastatur- noch Maus-Benutzer Inhalte bei Klick auf den Link angezeigt werden.

Schlechtes Beispiel

Der Link in diesem Beispiel geht nirgendwohin. Das eigentliche Ziel davon ist es einen Javascript zu aktivieren.

<a href="#" onmouseover="dropdownmenu()">Products</a>

Ein Lösungsansatz wäre hier einfach Standard Hypertext-Links zu nutzen und diese in gewohnter Weise direkt mit einer URL zu verlinken (z.B. href=“products.htm“). Alle relevanten Verlinkungen des Dropdown Menus, sollten als aussagekräftiger Link vorhanden sein.

Weitere Informationen dazu, finden Sie in Beispiel 2 Artikel zu onMouseOver section für JavaScript Event Handler.

Screen-Reader und Links

Screenreader User werden darüber informiert, ob Text oder eine Grafik verlinkt ist

Screen-Reader wie JAWS geben in der Sprachausgabe einen Hyperlink mit dem Linktext „products“ als „link products“ aus. Der IBM Home Page Reader variiert zu normalem Text mit einer männlichen Stimme und bei Links mit einer weiblichen Stimme, die den Linktext vorliest.

Fazit: Sie müssen nicht extra einen Linktext „Link“ einfügen. Ähnlich ist das bei Grafiken die man verlinkt. Im ALT-Text für eine Grafik sollte nicht das Wort „Link“ vorhanden sein. JAWS User hören sonst eine doppelte Ausgabe des Wortes „Link“.

Nutzer von Bildschirmlesegeräten navigieren gerne oft von Link zu Link und überspringen ggf. den Text dazwischen

Sich mit der TAB Taste von Link zu Link zu hangeln, kann für den Benutzer sehr mühsam sein, insbesondere dann, wenn er versucht einen bestimmten Bereich auf der Website zu erreichen bzw. Inhalte zu finden.

Fazit 1: Wenn Sie Inhalte verlinken, so sollte das in dem Zusammenhang auch Sinn machen. Links wie „hier klicken“, „mehr“, „Für Details klicken“, usw. sind im Grunde genommen nicht aussagekräftig und eher nutzlos. Es wäre aber auch übertrieben, dem User jedes Detail über ein Linkziel in Form von langen Kontexten mitzuteilen. Besser wäre z.B. ein kurzes verlinktes Schlagwort wie „Produkte“.

Fazit 2: Definieren Sie eindeutige und logische Unterscheidungsmerkmale für barrierefreie Links. Verzichten Sie auf Formulierungen wie „Link öffnet in neuem Fenster: Produkte“ Stattdessen könnte man besser verwenden: „Produkte (öffnet in neuem Fenster)“ oder ähnliches. Bei vielen Links auf der Website, muss der Screenreader User das jedoch immer wieder hören. Es wäre also ratsamer, kurze Schlagwörter oder Kombinationen zu verlinken, um die Sprachausgabe für Links zu minimieren und dem User damit einen schnellen Überblick über verlinkte Inhalte zu geben.

Nutzer von Bildschirmlesegeräten erhalten manchmal eine alphabetisch geordnete Liste mit Links

Screenreader können über eine Tastenkombination Links in eine alphabetisch geordnete Liste extrahieren. Der User kann dann mit dem Anfangsbuchstaben seiner Themenwünsche durch diese Liste navigieren.

Fazit: Benutzen Sie intuitive Linktexte und Phrasen die einfach in alphabetischer Reihenfolge organisiert / sortiert werden können. Der Begriff Kontakt ist ein allgemein zugänglicher Begriff, den die User sicherlich erwarten. Wechselt man aber in längere Phrasen wie z.B. „So können Sie uns kontaktieren,“ oder „wie Sie uns erreichen“, etc. ist die Suche für den User eher schwieriger und zeitaufwendiger.

Nächste Seite