Barrierefreie Links – Linktexte, WCAG-Anforderungen und Best Practices
Barrierefreie Links sind eines der grundlegendsten Elemente zugänglicher Websites – und gleichzeitig eine der häufigsten Fehlerquellen. Ein barrierefreier Link hat einen aussagekräftigen Linktext, der Nutzern – insbesondere Screenreader-Nutzern – klar vermittelt, wohin der Link führt. Linktexte wie „hier klicken", „mehr" oder „weiter lesen" ohne erklärendem Kontext sind typische Barrieren, die Menschen mit Behinderungen die Navigation erschweren oder unmöglich machen.
Für Screenreader-Nutzer ist die Qualität von Linktexten besonders entscheidend: Sie können alle Links einer Seite als Liste aufrufen und zwischen ihnen navigieren – ohne den umgebenden Text zu hören. Ein Beispiel: Eine Seite mit zehn Mal „hier klicken" ist für einen Screenreader-Nutzer vollständig unbrauchbar. Dieselbe Seite mit zehn aussagekräftigen Linktexten ist effizient navigierbar.
Die WCAG adressieren barrierefreie Links unter dem Prinzip Bedienbarkeit. Kriterium 2.4.4 (Level AA) ist für vom BFSG erfasste digitale Angebote relevant und fordert verständliche Linktexte. Ergänzend gilt Kriterium 1.4.1 (Level A), das Farbe als einziges Unterscheidungsmerkmal für Links im Fließtext verbietet.
Barrierefreie Links auf einen Blick
- Aussagekräftiger Linktext: Zweck des Links ohne Kontext verständlich – kein „hier klicken"
- Tastaturbedienbar: Alle Links per Tab erreichbar, sichtbarer Fokusindikator vorhanden
- Nicht nur durch Farbe unterscheidbar: Unterstreichung oder anderes visuelles Merkmal nötig
- Bildlinks: Alternativtext des Bildes beschreibt das Linkziel, nicht das Bild
- WCAG-Kriterium: 2.4.4 Linkzweck (AA) – Zweck aus Linktext oder Kontext bestimmbar
Gute und schlechte Linktexte: Beispiele im Vergleich
Der Unterschied zwischen barrierefreien und nicht barrierefreien Linktexten ist in der Praxis schnell erklärt. Die folgenden Beispiele zeigen, wie schlechte Linktexte entstehen und wie man sie verbessert. Entscheidend ist immer die Frage: Versteht ein Nutzer den Zweck dieses Links, wenn er nur den Linktext – ohne umgebenden Text – hört oder liest?
- ❌ „Hier klicken" → ✓ „Barrierefreiheitsbericht 2025 herunterladen (PDF)"
- ❌ „Mehr erfahren" → ✓ „Mehr über unsere Accessibility-Prüftools erfahren"
- ❌ „Weiter" → ✓ „Weiter zu Schritt 2: Zahlungsdaten"
- ❌ „www.sitecockpit.com" → ✓ „SiteCockpit – digitale Barrierefreiheit prüfen"
- ❌ „[Bild]" → ✓ alt="Zur SiteCockpit Startseite" (wenn Bild als Link)
Linktexte und Screenreader: Wie Navigation in der Praxis funktioniert
Screenreader-Nutzer navigieren Websites grundlegend anders als sehende Nutzer. Eine der häufigsten Navigationsmethoden ist die Link-Liste: Der Screenreader listet alle Links der aktuellen Seite auf – der Nutzer springt durch diese Liste und aktiviert den gewünschten Link. In diesem Modus hört der Nutzer ausschließlich den Linktext – kein Fließtext, kein Kontext, keine Überschriften.
Ein weiteres Beispiel: Eine Produktseite mit zwanzig „Jetzt kaufen"-Links für verschiedene Produkte ist im Screenreader-Modus vollständig ununterscheidbar. Barrierefreie Linktexte würden lauten: „iPhone 15 Pro – jetzt kaufen", „MacBook Air M3 – jetzt kaufen" – so kann der Nutzer direkt das gewünschte Produkt auswählen.
WCAG-Anforderungen für barrierefreie Links
Die WCAG stellen mehrere Anforderungen an barrierefreie Links. Das wichtigste Kriterium ist 2.4.4 – aber barrierefreie Linkgestaltung umfasst mehr als nur den Linktext. Auch visuelle Erkennbarkeit, Tastaturbedienbarkeit und der Kontext spielen eine Rolle.
- 2.4.4 Linkzweck (AA): Zweck des Links aus Linktext oder programmatisch bestimmbarem Kontext erkennbar
- 2.4.9 Linkzweck – nur Link (AAA): Zweck allein aus dem Linktext erkennbar – ohne Kontext
- 1.4.1 Verwendung von Farbe (A): Links im Fließtext nicht ausschließlich durch Farbe unterscheidbar
- 2.1.1 Tastatur (A): Alle Links per Tastatur erreichbar und aktivierbar
- 2.4.7 Fokus sichtbar (AA): Tastaturfokus auf Links muss sichtbar sein
Bildlinks und Icon-Links barrierefrei gestalten
Besondere Aufmerksamkeit verdienen Bildlinks und Icon-Links – also Links bei denen kein sichtbarer Text vorhanden ist. Wenn ein Bild oder Icon als Link verwendet wird, muss der zugängliche Name des Links dem Nutzer den Linkzweck vermitteln. Das geschieht über den Alternativtext des Bildes oder ein aria-label am Link-Element.
- Logo als Link:
alt="Zur Startseite von [Firmenname]"– nichtalt="Logo" - Social-Media-Icons:
aria-label="SiteCockpit auf LinkedIn"statt leeres Icon - Produktbilder als Links: Alt-Text beschreibt das Ziel, nicht das Bild – z. B.
alt="iPhone 15 Pro – Produktseite öffnen" - Pfeil- oder Plus-Icons:
aria-labelbeschreibt die Aktion – z. B.aria-label="Produktdetails ausklappen"
SiteCockpit Lösung
easyMonitoring: Unzugängliche Linktexte automatisch erkennen
easyMonitoring prüft automatisiert alle Links auf Ihrer Website auf WCAG 2.4.4-Konformität – und erkennt dabei leere Linktexte, generische Inhalte wie „hier klicken" sowie Bildlinks ohne zugänglichen Namen. So sehen Sie auf einen Blick, welche Links auf Ihrer Website für Screenreader-Nutzer und andere Menschen mit Behinderungen eine Barriere darstellen.
easyMonitoring kennenlernen →Häufige Fragen zu barrierefreien Links
Ist „Mehr erfahren" immer ein Problem?
Nicht zwangsläufig. WCAG 2.4.4 erlaubt Linktexte wie „Mehr erfahren", wenn der Kontext – zum Beispiel die direkt vorangehende Überschrift – programmatisch mit dem Link verknüpft ist und der Screenreader diesen Kontext automatisch mitliest. Besser ist jedoch immer ein vollständig aussagekräftiger Linktext, da nicht alle Screenreader den Kontext gleich interpretieren.
Dürfen Links sich in einem neuen Tab öffnen?
Ja – aber Nutzer sollten vorher darüber informiert werden. Ein Hinweis im Linktext (z. B. „Datenschutzerklärung – öffnet in neuem Tab") oder ein aria-label mit diesem Hinweis ist empfehlenswert. Unangemeldetes Öffnen neuer Tabs kann insbesondere für Screenreader-Nutzer und Menschen mit kognitiven Einschränkungen verwirrend sein.
Muss die URL als Linktext verwendet werden?
Nein – und in den meisten Fällen ist das sogar schlechte Praxis. Eine URL wie „https://www.sitecockpit.com/de/produkte/easymonitoring" als Linktext wird vom Screenreader buchstabenweise vorgelesen und ist für Nutzer kaum verständlich. Stattdessen sollte ein beschreibender Linktext verwendet werden, zum Beispiel „easyMonitoring von SiteCockpit".
Was ist der Unterschied zwischen WCAG 2.4.4 und 2.4.9?
WCAG 2.4.4 (Level AA) erlaubt, dass der Zweck eines Links aus dem Linktext zusammen mit dem programmatisch bestimmbaren Kontext hervorgeht. WCAG 2.4.9 (Level AAA) ist strenger: der Zweck muss allein aus dem Linktext erkennbar sein – ohne Kontext. Für gesetzliche Konformität nach BFSG ist Level AA maßgeblich.
Links auf Ihrer Website auf Barrierefreiheit prüfen
Mit easyMonitoring erkennen Sie automatisch, welche Links auf Ihrer Website für Screenreader-Nutzer und andere Menschen mit Behinderungen nicht zugänglich sind – und erhalten konkrete Hinweise zur Verbesserung.
Kostenlos testen