Sprungmarke

Auch: Anker-Link, Jump Link, Fragment

Kurz erklärt

Eine Sprungmarke ist ein Linkziel innerhalb einer Seite: Der Teil nach dem # in einer URL verweist auf ein Element mit passender id, zu dem der Browser springt. Für Suchmaschinen bleibt die Adresse dieselbe Seite.

Lange Seiten haben ein Problem: Wer nur eine bestimmte Antwort sucht, muss scrollen. Sprungmarken lösen das. Ein Klick auf „Kosten“ im Inhaltsverzeichnis führt direkt zum Abschnitt „Kosten“, ohne dass eine neue Seite geladen wird.

Im Deutschen heißen sie auch Anker oder Anker-Links, im Englischen Jump Links; technisch korrekt ist der Begriff Fragment. Für das Linkbuilding sind Sprungmarken aus einem Grund interessant: Sie ändern, wo ein Besucher landet, aber nicht, welche Seite einen Link erhält.

Wie eine Sprungmarke technisch funktioniert

Eine Sprungmarke besteht aus zwei Teilen. Auf der Zielseite trägt ein Element ein id-Attribut, meist eine Zwischenüberschrift. Der Link hängt diese id mit einem # an die Adresse an. Der Browser lädt die Seite und scrollt zu dem Element, dessen id zum Fragment passt.

Was beim Klick auf #kosten passiertDas Fragment wird nicht an den Server gesendet (MDN)1KlickSchritt 1Link auf/ratgeber/#kosten2AnfrageSchritt 2Browser fragt nur/ratgeber/ an3AntwortSchritt 3Server liefertdie ganze Seite4SprungSchritt 4Browser suchtid="kosten"
Das Fragment verlässt den Browser nie: Der Server liefert die ganze Seite, den Sprung erledigt der Browser.
<h2 id="kosten">Was kostet das?</h2>
<a href="#kosten">Zu den Kosten</a>
<a href="https://beispiel.de/ratgeber/#kosten">Kosten im Ratgeber</a>

Der erste Link springt innerhalb derselben Seite, der zweite führt von einer anderen Seite oder Website direkt an die Stelle. Ältere Seiten nutzen statt der id noch das Attribut name an einem a-Element; heute ist die id der übliche Weg. Groß- und Kleinschreibung müssen exakt übereinstimmen: #Kosten findet id="kosten" nicht.

Wichtig für alles Weitere: Der Fragment-Teil wird laut MDN beim Abruf nicht an den Server geschickt. Der Server liefert immer dieselbe Seite aus; erst der Browser sucht die Stelle. Deshalb erscheinen Fragmente auch nicht in Server-Logdateien.

Sprungmarke, Deeplink, Ziel-URL: die Abgrenzung

Drei Begriffe werden gern vermischt, weil alle mit dem Ziel eines Links zu tun haben. Sie beschreiben aber verschiedene Ebenen.

BegriffBeschreibtBeispiel
Ziel-URLdie vollständige Adresse im href/ratgeber/heizung/#kosten
Deeplinkeinen Link auf eine Unterseite statt auf die Startseite/ratgeber/heizung/
Sprungmarkeeine Position innerhalb dieser Seite#kosten

Eine Sprungmarke macht aus einem Link also keinen Link auf eine andere Seite. /ratgeber/heizung/ und /ratgeber/heizung/#kosten zeigen auf dasselbe Dokument, nur auf eine andere Stelle darin. Aus demselben Grund eignet sich eine Adresse mit Fragment nicht als kanonische URL; mehr dazu im Eintrag Canonical-Tag.

Was Google mit Fragmenten macht

Google ist hier eindeutig: In den Richtlinien zur URL-Struktur heißt es, die Google Suche unterstütze URL-Fragmente im Allgemeinen nicht. Fragmente sollen deshalb nicht dazu dienen, den Inhalt einer Seite auszutauschen.

Praktisch bedeutet das zweierlei. Erstens wird eine Adresse mit Sprungmarke nicht als eigene Seite indexiert; im Index steht die Seite ohne Fragment. Zweitens gilt ein Backlink auf /ratgeber/#kosten nach dieser Logik als Link auf /ratgeber/. Er stärkt die ganze Seite, nicht einen Abschnitt.

Ein Sonderfall sind Webanwendungen, die ganze Ansichten über Fragmente wie #/produkte wechseln. Google rät dort zur History-API, damit jede Ansicht eine eigene, auslesbare Adresse bekommt. Die Hintergründe stehen im Eintrag JavaScript-Links.

Kurz gesagt: Sprungmarken sind für Leser gedacht. Für die Indexierung und für Linksignale zählt die Seite, auf der sie stehen.

Sprunglinks in den Google-Suchergebnissen

Sprungmarken wirken trotzdem in die Suche hinein, und zwar in der Darstellung. Schon im September 2009 kündigte Google im Search Central Blog zusätzliche Links im Suchergebnis an, die direkt zu Abschnitten einer längeren Seite führen (Google: Using named anchors to identify sections on your pages). Im Englischen wurden sie als „Jump to“-Links bekannt.

Google erzeugte diese Links nach eigener Aussage vollständig algorithmisch aus der Seitenstruktur. Die Wahrscheinlichkeit steige, wenn lange Seiten in klare Abschnitte gegliedert sind, jeder Abschnitt einen Anker mit beschreibendem Namen hat und die Seite ein Inhaltsverzeichnis mit Links auf diese Anker enthält. Kaufen lassen sie sich nicht, und sie erscheinen nur bei passenden Suchanfragen.

Die heutige Dokumentation zu Snippets beschreibt Deeplinks vom Typ „Weitere Informationen“, die aus dem Snippet zu einem bestimmten Abschnitt führen. Google nennt dafür drei Empfehlungen:

  • Inhalte sind beim Laden sofort sichtbar und nicht in Akkordeons oder Tabs versteckt.
  • Kein JavaScript, das die Scrollposition beim Laden erzwingt, etwa zurück an den Seitenanfang.
  • Skripte, die beim Laden die Adresse verändern, dürfen das Hash-Fragment nicht entfernen, sonst funktioniert der Deeplink nicht.

Bei hervorgehobenen Snippets (Featured Snippets) scrollt Google laut eigener Dokumentation automatisch zur zitierten Stelle, ohne dass die Website dafür etwas auszeichnen muss. Eine Garantie für Sprunglinks gibt es in keinem der Fälle.

Inhaltsverzeichnisse mit Sprungmarken anlegen

Das häufigste Einsatzfeld ist das Inhaltsverzeichnis am Anfang eines langen Beitrags. Es hilft Lesern bei der Orientierung und liefert Google genau die Struktur, die der Blogbeitrag von 2009 beschreibt. So gehen Sie vor:

  1. Abschnitte gliedern: Jede H2 behandelt ein Thema, das man auch einzeln suchen würde.
  2. Sprechende ids vergeben: id="kosten-im-ueberblick" statt id="abschnitt-3". Kleinbuchstaben, Bindestriche, Umlaute ausgeschrieben, damit die Adresse beim Teilen lesbar bleibt.
  3. Inhaltsverzeichnis verlinken: eine Liste mit <a href="#kosten-im-ueberblick"> und einem Ankertext, der dem Abschnitt entspricht.
  4. Feste Kopfzeile beachten: Bei einem mitlaufenden Header verdeckt dieser sonst die Überschrift. Die CSS-Eigenschaft scroll-margin-top an den Zielen schafft Abstand.
  5. ids stabil halten: Ändern Sie eine Überschrift, lassen Sie die id stehen. Externe Links mit dieser Sprungmarke landen sonst am Seitenanfang.

In WordPress lässt sich die id im Block-Editor direkt setzen: Überschrift markieren, in der Seitenleiste unter „Erweitert“ das Feld „HTML-Anker“ ausfüllen. Viele Inhaltsverzeichnis-Plugins erzeugen ids automatisch aus dem Überschriftentext; dann ändert sich die id mit jeder Umformulierung. Wie Sprungmarken in die Gesamtstruktur einer Website passen, beschreibt der Beitrag Interne Verlinkung.

Textfragmente: Sprung zu einer Textstelle

Eine Erweiterung der klassischen Sprungmarke sind Textfragmente. Sie brauchen keine id auf der Zielseite. Stattdessen steht der gesuchte Text in der Adresse, nach dem Muster #:~:text=. Der Browser sucht die Stelle, scrollt dorthin und hebt sie meist farbig hervor.

Drei Arten von FragmentenSprungmarke#kostenbraucht id auf der Seitez. B. InhaltsverzeichnisTextfragment#:~:text=Förderungsucht den Text selbstz. B. Zitat belegenMedienfragment#t=10,20Startzeit in Video/Audioz. B. Szene teilen
Neben der klassischen id-Sprungmarke kennen Browser Text- und Medienfragmente; für die Indexierung ändern alle drei nichts an der Seite.

https://beispiel.de/ratgeber/#:~:text=Förderung%20beantragen

Die Syntax erlaubt außerdem einen Anfang und ein Ende sowie Text davor und danach, um eine Stelle eindeutig zu treffen. Unterstützt werden Textfragmente laut den Kompatibilitätsdaten von MDN in Chrome und Edge ab Version 80, in Safari ab 16.1 und in Firefox ab 131. Ältere Browser öffnen die Seite einfach am Anfang.

Für Website-Betreiber sind Textfragmente vor allem beim Zitieren nützlich: Sie können auf eine bestimmte Aussage in einer fremden Quelle verweisen, ohne dass diese ids vergeben hat. Steuern lässt sich ihr Einsatz durch Dritte nicht; ändert sich der Text auf der Zielseite, greift das Fragment ins Leere und die Seite öffnet oben.

Beispiel: ein Preisabschnitt, auf den andere verlinken

Eine fiktive Agentur hat auf ihrer Leistungsseite einen Abschnitt mit der id preise. Ein Partner verlinkt ihn in seinem Newsletter und auf seiner Website. Das Beispiel ist konstruiert und zeigt drei typische Stolperstellen.

  • Reihenfolge mit Parametern: Kampagnenparameter gehören vor das Fragment, weil die Abfrage in einer URL immer vor dem # steht: /leistungen/seo/?utm_source=newsletter#preise. Hinter dem # würden sie als Teil der Sprungmarke gelesen. Saubere Kampagnen-Links baut der UTM-Generator.
  • Linkwirkung: Der Backlink des Partners auf /leistungen/seo/#preise zählt für die Leistungsseite als Ganzes. Ein eigener Wert für den Preisabschnitt entsteht nicht.
  • Relaunch: Beim Umbau wird aus preise die id kosten. Der Link funktioniert weiter, landet aber am Seitenanfang. Ein Werkzeug, das nur Statuscodes prüft, meldet hier keinen Fehler, weil der Server die Seite korrekt ausliefert.

Der letzte Punkt ist der wichtigste: Kaputte Sprungmarken fallen in keinem Linkbericht auf. Wer wichtige Abschnitte von außen verlinkt bekommt, sollte deren ids wie Adressen behandeln und beim Umbau beibehalten. Für die Seiten selbst, also Statuscodes und Weiterleitungen, bleibt ein Link-Checker das richtige Werkzeug.

Häufige Fragen

Was ist eine Sprungmarke in HTML?

Eine Sprungmarke ist ein Element mit id-Attribut, auf das ein Link mit # verweist, etwa <a href="#kosten"> auf <h2 id="kosten">. Der Browser springt beim Klick an diese Stelle, ohne eine neue Seite zu laden.

Wie erstelle ich eine Sprungmarke in WordPress?

Im Block-Editor die Überschrift markieren und in der Seitenleiste unter „Erweitert“ das Feld „HTML-Anker“ ausfüllen, zum Beispiel mit kosten. Danach verlinken Sie mit #kosten auf diese Stelle, innerhalb der Seite oder von anderen Seiten aus.

Sind Sprungmarken gut für SEO?

Sie verbessern nicht das Ranking, aber die Nutzbarkeit langer Seiten. Google hat beschrieben, dass gut gegliederte Seiten mit Ankern und Inhaltsverzeichnis eher Links zu Abschnitten im Suchergebnis bekommen. Eine Garantie dafür gibt es nicht.

Zählt ein Backlink mit # als Link auf die Seite?

Ja. Die Google Suche unterstützt Fragmente laut eigener Dokumentation im Allgemeinen nicht, eine Adresse mit Sprungmarke ist deshalb keine eigene Seite. Der Link wirkt für die Seite ohne Fragment.

Warum funktioniert meine Sprungmarke nicht?

Meist passt die id nicht exakt, etwa wegen Groß- und Kleinschreibung oder weil ein Plugin sie nach einer Textänderung neu erzeugt hat. Weitere Ursachen sind Inhalte, die erst per Skript nachgeladen werden, und Skripte, die das Fragment beim Laden aus der Adresse entfernen.

Alle 327 Begriffe im Glossar