Viele Webseiten enthalten Blöcke, die auf jeder Seite wiederholt werden. Denken Sie an das Navigationsmenü oder einen Werbeblock. Stellen Sie sicher, dass Besucher diese Blöcke überspringen können.

Dadurch wird verhindert, dass sehbehinderte Menschen, die eine Sprachsynthese-Software verwenden, auf jeder Seite das gesamte Navigationsmenü oder aber die Werbung lesen müssen. Sie greifen so direkt auf die Informationen zu, die für sie von Interesse sind. Die Sprachsynthese-Software liest die Elemente der Seite in der Reihenfolge, in der sie im Quellcode aufgeführt sind.

Personen, die nur über die Tastatur navigieren, müssen diese Blöcke umgehen können, um zu vermeiden, dass sie alle Links auf der Seite durchgehen müssen.

Durch diese Umgehung sparen sie Zeit und vermeiden Frustration und ggf. sogar Schmerzen.

Wie wendet man das an?

Sie können dies auf zwei Arten anwenden:

  1. Hinzufügen von Links zu sich wiederholenden Sätzen, die übersprungen werden.
  2. Gruppieren Sie Teile der Seite anhand von Codes, damit sie übersprungen werden können.

Links zum Überspringen von Sätzen

Sie können Links zu übersprungenen Blöcken auf folgende Weise hinzufügen. Diese werden auch als "Skip-Links" bezeichnet.

Link zum wichtigsten Teil überspringen

Oben auf jeder Webseite platzieren Sie einen Link, der direkt zum wichtigsten Teil der Seite führt. In der Regel ist dies der Hauptinhalt der Seite.

  • Sie können den Link standardmäßig sichtbar machen oder nur, wenn der Besucher mit der Tabulatortaste dorthin springt und der Link den Fokus erhält.
  • Es ist wichtig, dass dieser Link im Quellcode so hoch wie möglich ist, vorzugsweise ganz oben.
Beispiel

Der erste Link im Quellcode lautet:

<a href="#inhalt">Zum Inhalt springen</a>

Unten im Quellcode befindet sich der Abschnitt mit dem Hauptinhalt der Seite. Es hat den id-Inhalt, auf den Sie mit dem Skip-Link verweisen.

Ein Link pro Block, um den Block zu überspringen

Für jeden Block von sich wiederholenden Inhalten setzen Sie einen Link zu Stellen außerhalb des Blocks, um zu navigieren. Sie platzieren dann einen Link direkt vor dem Block, der es dem Besucher ermöglicht, zu dem Text direkt unter dem Block zu springen.

Diese Methode ist nicht immer notwendig, nur in Fällen, in denen es Blöcke mit vielen Links auf einer Webseite gibt, kann sie nützlich sein. Stellen Sie sich einen alphabetischen Index vor, in dem jeder Buchstabe des Alphabets angeklickt werden kann. Dies ist eine lange Liste von Links, die einige Besucher überspringen möchten.

Beispiel

Ein Block mit Links sieht so aus:

<h2 id="kapitel1">Externe Quellen</h2>
<a href="#hoofdstuk2">Sla dit blok over</a>
<ul> 
<li><a href="https://www.wikipedia.org">Wikipedia</a></li>
<li><a href="https://www.grenzecho.net">Grenz-Echo</a></li>
<li><a href="https://www.brf.be”>BRF</a></li>
</ul>
<h2 id="kapitel2">Über diesen Bericht</h2>
<p>Text von Kapitel 2…</p>

Mit dem Link direkt unter der ersten Rubrik kann der Besucher zum nächsten Kapitel springen. Er überspringt die Links im ersten Kapitel.

Inhaltsverzeichnis oben auf der Seite

Oben auf der Seite platzieren Sie ein kurzes Inhaltsverzeichnis mit Links zu den wichtigsten Teilen der Seite. Dies muss nicht nur ein Teil des Textes sein, sondern umfasst auch die Suchfunktion und das Navigationsmenü. Diese Option ist besonders nützlich, wenn es mehrere wichtige Elemente auf einer Seite gibt.

Gruppierung von Teilen mit dem richtigen Code

Anstatt Links zu verwenden, können Sie auch Code und Technik verwenden, um diese Anforderung zu erfüllen. Es gibt mehrere Techniken, um Code zu verwenden, um die Teile der Seite zu gruppieren. Beispielsweise können Sie Überschriften für alle wichtigen Blöcke einer Seite verwenden. Denken Sie an den Hauptinhalt, aber auch an die Suchfunktion, das Hauptmenü, ein Formular, usw.

Besucher mit unterstützender Technologie können über die Kopfzeilen schnell zu einem Artikel springen. ARIA-Attribute im HTML-Code ermöglichen es Ihnen auch, Abschnitte einer Seite anzugeben. Ein weiterer Ansatz besteht darin, Blöcke ein- oder auszublenden, indem man sie zusammenklappbar macht. Normalerweise geschieht dies mit einer Programmiersprache wie Javascript.

Für Developer (Entwickler)

wiederholende Blöcke zu überspringen. Dies kann durch das Platzieren von Skip-Links hoch oben im Quellcode oder durch die Verwendung von Codes zum Erstellen von Gruppierungen in den Teilen der Seite erfolgen.