Links must have discernible text

Regel-ID: link-name
Regelsatz: axe-core 4.10
Auswirkungen auf die Benutzer: Ernst
Leitlinien: WCAG 2.1 (A), WCAG 2.0 (A), WCAG 2.2 (A), Section 508, Trusted Tester, EN 301 549

Learn Web Accessibility

Subscribe to our extensive curriculum of online self-paced courses

Compliance Data & Impact

User Impact

Disabilities Affected

  • Blind
  • Taubblinde
  • Mobilität

Standard(s)

  • WCAG 2.1 (A)
  • WCAG 2.0 (A)
  • WCAG 2.2 (A)
  • Section 508
  • Trusted Tester
  • EN 301 549

WCAG-Erfolgskriterien [WCAG 2.1 (A)]

  • 2.4.4: MUST: Link Purpose (In Context)
  • 4.1.2: MUST: Name, Role, Value

WCAG-Erfolgskriterien [WCAG 2.0 (A)]

  • 2.4.4: MUST: Link Purpose (In Context)
  • 4.1.2: MUST: Name, Role, Value

WCAG-Erfolgskriterien [WCAG 2.2 (A)]

  • 2.4.4: MUST: Link Purpose (In Context)
  • 4.1.2: MUST: Name, Role, Value

Richtlinien zu Abschnitt 508

  • 1194.22: MUST: Web based intranet and Internet Information & Applications
  • 1194.22 (a): MUST: A text equivalent for every non-text element shall be provided (e.g., via "alt", "longdesc", or in element content)

Richtlinien für vertrauenswürdige Tester

  • 6.A: MUST: The purpose of each link or button can be determined from any combination of the link/button text, accessible name, accessible description, and/or programmatically determined link/button context.

EN 301 549 Richtlinien

  • 9.2.4.4: MUST: Link Purpose (In Context)
  • 9.4.1.2: MUST: Name, Role, Value

So beheben Sie das Problem

  • Stellen Sie sicher, dass alle Linknamen zugänglich sind. Möglicherweise ist der innere Linktext für einen Bildschirmleser nicht sichtbar, es sind doppelte Linkbezeichnungen vorhanden oder der Link ist nicht fokussierbar.

  • Stellen Sie sicher, dass alle Links programmgesteuert fokussiert werden können. Vermeiden Sie beispielsweise gerätespezifische Ereignisse (z. B. onmouseover).

  • Um sicherzustellen, dass der gesamte Linktext für Bildschirmleseprogramme sichtbar ist, kann der Linktext nicht ausgeblendet werden (z. B. mit display: none oder aria-hidden="true").

  • Um sicherzustellen, dass alle Links programmgesteuert fokussiert werden können, vermeiden Sie gerätespezifische Javascript-Ereignisse wie onmouseover(), mouseover(), hover(), onmouseout(), mouseout(). Ersetzen Sie diese durch geräteunabhängige Ereignisse wie onfocus(), focus(), onblur() oder blur().

  • Ändern Sie den Stil der Links nicht, um die Stiländerung zu unterdrücken, wenn ein Link im programmatischen Fokus steht. Durch das Ändern der Link-Stile können sehende Tastaturbenutzer nicht mehr erkennen, wo auf der Seite sie sich befinden. Stellen Sie außerdem sicher, dass Sie echte Links erstellen, indem Sie das a Element mit dem href Attribut verwenden.

Auf der ARIA 1.1-Wiki-Seite Verwendung von aria-label für den Linkzweck finden Sie das folgende Beispiel, um den Zweck eines Links in HTML unter Verwendung des aria-label-Elements zu beschreiben: 

<h4>Neighborhood News</h4>
 <p>Seminole tax hike: Seminole city managers are proposing a 75% increase in 
 property taxes for the coming fiscal year.
 <a href="taxhike.html" aria-label="Read more about Seminole tax hike">[Read more...]</a>
 </p> 
 <p>Baby Mayor: Seminole voters elect the city's youngest mayor ever by voting in 3 year
 old Willy "Dusty" Williams in yesterday's mayoral election.
 <a href="babymayor.html" aria-label="Read more about Seminole's new baby mayor">[Read more...]</a>
 </p>

Warum es wichtig ist

  • Nicht zugängliche Linkelemente stellen Barrieren für die Zugänglichkeit dar, da sie ein grundlegender Bestandteil einer Website sind.

  • Benutzer, die zum Navigieren auf einer Webseite ausschließlich eine Tastatur (und keine Maus) verwenden, können nur Links auswählen, die programmgesteuert fokussiert werden können. Ein Link, der keinen programmgesteuerten Fokus erhalten kann, ist für diese Benutzer nicht zugänglich.

  • Ebenso wie sehende Benutzer müssen auch Benutzer von Bildschirmleseprogrammen wissen, wohin ein Link zeigt. Der innere Linktext stellt diese Informationen bereit, kann jedoch nicht genutzt werden, wenn ein Bildschirmleseprogramm nicht darauf zugreifen kann.

  • Tastaturbenutzer, einschließlich sehbehinderter Benutzer von Bildschirmleseprogrammen oder Personen, die keine Maus verwenden können, können nur die Links und Formularelemente aktivieren, die den programmatischen Fokus erhalten können. Auf Ereignisse, die ausschließlich durch andere Fokustypen aktiviert werden, beispielsweise onmouseover Ereignisse, die vom Mauszeigerfokus abhängen, sind für Tastaturbenutzer nicht zugänglich. Nur Links und Formularelemente erhalten standardmäßig den Tastaturfokus. Ändern Sie Elemente, die keine Links oder Formularkomponenten sind, um Fokus zu erhalten, indem Sie tabindex="0" hinzufügen.

Regelbeschreibung

Linktext und Alternativtext für Bilder müssen, wenn sie als Links verwendet werden, für einen Bildschirmleser lesbar sein, dürfen keine doppelte Beschriftung aufweisen und müssen fokussierbar sein.

Der Algorithmus (vereinfacht ausgedrückt)

Stellt sicher, dass jeder Link einen zugänglichen Namen hat.

Ressourcen

Kursseiten der Deque University (Abonnement erforderlich)

Tragen Sie zu axe-core auf GitHub bei

Andere Hilfsmittel

Vielleicht möchten Sie sich auch diese anderen Ressourcen ansehen.

Beziehen Sie sich auf die vollständige Liste der axe-Regeln 4.10 .

Waren diese Informationen hilfreich?

Sie haben bereits Ihr Feedback gegeben, danke..

Ihre Antwort lautete wie folgt:

Waren diese Informationen hilfreich?
Datum/Uhrzeit der Feedback-Abgabe: