Techniken für WCAG 2.0

Zum Inhalt

-

G123: Hinzufügen eines Links zu Beginn eines Blocks mit sich wiederholendem Inhalt, um zum Ende dieses Blocks zu gehen

Anwendbarkeit

Alle Techniken, die Links enthalten

Die Technik bezieht sich auf:

Beschreibung

Das Ziel dieser Technik ist es, einen Mechanismus zur Verfügung zu stellen, um Blöcke mit Material zu umgehen, indem man direkt zum Ende des Blocks springt. Der erste Link im Block oder der Link, der dem Block unmittelbar vorausgeht, bewegt den Fokus auf den direkt auf den Blick folgenden Inhalt. Die Aktivierung des Links rückt den Tastaturfokus an dem Block vorbei weiter. Wenn es mehrere zu überspringende Blocks gibt, dann springt der Benutzer mit diesen Links von Block zu Block.

Beispiele

Beispiel 1: Navigationslinks überspringen

Die Seiten auf der Website einer Organisation beinhalten eine Navigationszeile oder ein Hauptmenü, in dem Links zu den primären Abschnitten der Site, zur Sitemap, zu Informationen über die Organisation und zur Kontaktaufnahme mit der Organisation enthalten sind. Der erste Link in diesem Bereich hat den Titel „Navigationslinks überspringen“. Ein Benutzer aktiviert den Link, um diese Links zu überspringen.

Beispiel 2: Ein Index eines Buches

Ein Buch enthält einen Index, der in eine Reihe von Seiten unterteilt ist. Im Inhalt gibt es zu Beginn jeder Seite des Index Links für jeden Buchstaben des Alphabets, die an die Stelle des Index verlinken, an denen die Einträge mit jenem Buchstaben beginnen. Der erste Link in der Reihe hat den Titel „Links zum Index überspringen“. Ein Benutzer aktiviert diesen Link, um die Links zu überspringen.

Beispiel 3: Verschiedene Reihen von Links

Alle Webseiten auf einer Website beinhalten einen Abschnitt, der Links zur Sitemap, zu Informationen über die Organisation und zur Kontaktaufnahme mit der Organisation enthält. Alle Seiten in jedem Abschnitt der Site beinhalten außerdem eine Reihe von Links zu ihren Unterbereichen. Der erste Link im ersten Block hat den Titel „Navigationslinks überspringen“ und überspringt die erste Reihe an Links. Der erste Link im zweiten Block hat den Titel „Abschnittslinks überspringen“ und überspringt die Links zu den Unterbereichen.

Beispiel 4: Eine HTML-Seite mit mehreren Blöcken an Navigationslinks

Dieses Beispiel zeigt sowohl den Gebrauch von Heading-Elementen zu Beginn jedes Abschnitts (H69) und von Links, die zum Ende jedes Abschnitts springen. Dies ermöglicht es Menschen, Blöcke mit sich wiederholenden Inhalten zu überspringen, indem sie die Navigation per Tastatur oder Heading benutzen, je nach Leistungsfähigkeit ihrer Benutzeragenten. Beachten Sie, dass einige Inhaltsabschnitte von einem div-Element umgeben sind, um damit ein Handicap des Internet Explorers zu umgehen (lesen sie dazu die Anmerkungen zu Benutzeragenten zur Erstellung von HTML-Links, um Inhaltsabschnitte zu überspringen (zukünftiger Link)).

Code-Beispiel:

			<p><a href="#content">Content title</a></p>
    <h2>Main Navigation</h2>
    <ul>
      <li><a href="#subnav">Sub Navigation</a></li>
      <li><a href="/a/">Link A</a></li>
      <li><a href="/b/">Link B</a></li>
      <li><a href="/c/">Link C</a></li>
...
      <li><a href="/j/">Link J</a></li>
    </ul>
    <div class="iekbfix">
      <h2 id="subnav">Sub Navigation</h2>
      <ul>
        <li><a href="#ultranav">Ultra Sub Navigation</a></li>
        <li><a href="/suba/">Sub A</a></li>
        <li><a href="/subb/">Sub B</a></li>
        <li><a href="/subc/">Sub C</a></li>
...
        <li><a href="/subj/">Sub J</a></li>
      </ul>
    </div>
    <div class="iekbfix">
      <h2 id="ultranav">Ultra Sub Navigation</h2>
      <ul>
        <li><a href="#content">Content title</a></li>
        <li><a href="/ultraa/">Ultra A</a></li>
        <li><a href="/ultrab/">Ultra B</a></li>
        <li><a href="/ultrac/">Ultra C</a></li>
...
        <li><a href="/ultraj/">Ultra J</a></li>
      </ul>
    </div>
    <div>
      <h2 id="content">Content title</h2>
      <p>Now that I have your attention...</p>
    </div>

Und das CSS

Code-Beispiel:

			div.iekbfix {
  width: 100%;
} 
  

Ressourcen

Ressourcen sind nur zu Informationszwecken und keine offizielle Empfehlung.

Tests

Vorgehensweise

  1. Prüfen Sie, ob der Link das letzte fokussierbare Steuerelement vor dem Block mit dem sich wiederholenden Inhalt oder der erste Link im Block ist.

  2. Prüfen Sie, ob die Beschreibung des Links vermittelt, dass damit der Block übersprungen wird.

  3. Prüfen Sie, ob der Link entweder immer sichtbar ist oder sichtbar ist, wenn er den Tastatur-Fokus erhält.

  4. Prüfen Sie, ob die Aktivierung des Links den Fokus zum Inhalt unmittelbar nach dem Block bewegt.

  5. Prüfen Sie, ob sich der Tastaturfokus nach der Aktivierung des Links direkt zum Inhalt nach dem Block bewegt hat.

Erwartete Ergebnisse

Wenn dies eine ausreichende Technik für ein Erfolgskriterium ist, dann bedeutet das Scheitern an diesem Testverfahren nicht zwangsläufig, dass das Erfolgskriterium nicht auf irgendeine andere Art und Weise erfüllt wurde, sondern nur, diese Technik nicht erfolgreich implementiert wurde und nicht benutzt werden kann, um die Konformität zu erklären.