Definition: Ein Skip-Link ist ein Link ganz am Anfang einer Seite, meist mit dem Text „Zum Inhalt springen“, der direkt zum Hauptinhalt führt. So müssen Menschen, die mit der Tastatur navigieren, nicht auf jeder Seite erst durch Logo, Menü und Suche tabben. Er ist eine der anerkannten Techniken für WCAG 2.4.1 Blöcke umgehen auf Stufe A [1][2].
Englisch: Skip link · Auch: Sprunglink · Zuletzt geprüft: 27. September 2026
Wer ihn braucht
Ein Hauptmenü mit vierzig Links bedeutet vierzig Tab-Drücke – auf jeder Seite, bevor der eigentliche Inhalt beginnt. Das betrifft Menschen mit motorischen Einschränkungen, die eine Tastatur, einen Schalter oder einen Mundstab nutzen und für jeden Tastendruck Kraft und Zeit brauchen. Es betrifft auch Menschen, die eine Bildschirmlupe nutzen und dem Fokus durch die ganze Navigation folgen müssten.
Screenreader-Nutzende haben andere Wege, etwa Landmarks und Überschriften. Browser bieten sehenden Tastaturnutzenden solche Sprünge aber nicht an. Für sie ist der Skip-Link der schnellste Weg zum Inhalt [3].
Wie ein guter Skip-Link aussieht
- Er ist das erste fokussierbare Element der Seite. Der erste Tab-Druck landet auf ihm.
- Sein Ziel existiert:
href="#inhalt"braucht ein Element mitid="inhalt", am besten<main>. - Er wird spätestens beim Fokus sichtbar. Viele Seiten blenden ihn aus, bis er den Fokus bekommt. Das ist in Ordnung – unsichtbar beim Fokus ist er nutzlos und verstößt zusätzlich gegen 2.4.7 Fokus sichtbar.
- Sein Text ist eindeutig und in der Sprache der Seite.
Im Code
<!-- Fehlt: 40 Menülinks vor dem Inhalt -->
<header>…</header>
<nav>…</nav>
<main>…</main>
<a class="skip" href="#inhalt">
Zum Inhalt springen
</a>
<header>…</header>
<nav>…</nav>
<main id="inhalt">…</main>
.skip { position: absolute; left: -999em; }
.skip:focus { left: 1rem; top: 1rem; }
Häufige Fehler
- Das Ziel fehlt. Nach einem Relaunch heißt der Hauptbereich anders, und der Link führt ins Leere.
- Er bleibt unsichtbar, auch wenn er den Fokus hat – etwa durch
display: noneoder eine Farbe ohne Kontrast. - Er ist nicht der erste Tab-Stopp, weil Cookie-Hinweis, Sprachwahl oder Social-Media-Links davor stehen.
- Er springt, aber der Fokus nicht. Die Seite scrollt, der nächste Tab-Druck setzt trotzdem im Menü fort. Testen Sie das in allen Browsern, die Sie unterstützen.
Wie Reviseberg damit umgeht
Bevor der Tastatur-Agent die erste Taste drückt, prüft er, ob das erste fokussierbare Element ein Link auf ein Sprungziel dieser Seite ist und ob es dieses Ziel gibt. Ist das nicht so, meldet er die Regel keyboard:skip-link und schreibt in den Schritt, was er stattdessen gefunden hat. Dazu kommen die axe-core-Regeln skip-link (das Ziel eines Sprunglinks existiert) und bypass (die Seite bietet überhaupt einen Weg vorbei an wiederholten Blöcken). Ob das Ziel wirklich der Hauptinhalt ist und ob der Link sich gut bedienen lässt, beurteilt am Ende ein Mensch.
Verwandte Begriffe
Landmark · Tastaturbedienbarkeit · Fokusreihenfolge · Fokusindikator · Tastaturfalle