Anker-Links: Sprungmarken in HTML und im CMS erstellen und was sie für SEO bringen

Ein Anker-Link, auch Sprungmarke oder Sprunglink genannt, gehört zu den ältesten Funktionen von HTML und zu den nützlichsten bei langen Inhalten. Er lässt den Leser direkt zur gesuchten Antwort springen, statt zu scrollen. Google behandelt Links als zentrales Signal dafür, wie Seiten zusammenhängen, und seine Best Practices für Links betonen, dass Links echte a-Elemente mit einem href sein müssen. Dieser Leitfaden zeigt, wie Sie Anker-Links in reinem HTML und in den wichtigsten CMS erstellen, was sie für SEO und KI-Antworten bringen und wie sie mit dem Ankertext zusammenhängen.

Was ist ein Anker-Link?

Ein Anker-Link ist ein Hyperlink, dessen Ziel eine Stelle innerhalb einer Seite ist. Die URL endet mit einer Raute und einer Kennung, dem sogenannten Fragment: beispiel.de/leitfaden#schritt-3. Beim Klick lädt der Browser die Seite (oder bleibt auf ihr) und scrollt zum Element mit der id schritt-3.

Drei Einsatzzwecke sind üblich:

• Navigation auf derselben Seite: ein Inhaltsverzeichnis am Anfang eines Artikels oder ein Link „nach oben“.
• Deep Links von einer anderen Seite: von einem Artikel auf einen genauen Abschnitt eines anderen verlinken, etwa eine Definition im Glossar.
• Eine genaue Passage teilen: einen Kollegen direkt zum Absatz schicken, der seine Frage beantwortet.

Suchmaschinen behandeln beispiel.de/leitfaden und beispiel.de/leitfaden#schritt-3 als dieselbe Seite. Das Fragment erzeugt nie eine neue URL zum Indexieren, daher können Anker-Links keinen Duplicate Content verursachen.

Wie erstellen Sie einen Anker-Link in HTML?

Zwei Codestücke genügen: eine id am Ziel und ein Link, der darauf zeigt.

1. Dem Ziel eine id geben: <h2 id="preise">Preise</h2>. Verwenden Sie Kleinbuchstaben, Zahlen und Bindestriche, ohne Leerzeichen und Umlaute, und halten Sie jede id auf der Seite eindeutig.
2. Auf derselben Seite verlinken: <a href="#preise">Preise ansehen</a>.
3. Von einer anderen Seite verlinken: <a href="/leitfaden#preise">Preisabschnitt des Leitfadens</a>.
4. Testen: Klicken Sie den Link und prüfen Sie, ob die Überschrift oben im Bildschirm erscheint und nicht unter einem fixierten Header verschwindet (die CSS-Eigenschaft scroll-margin-top behebt das).

Die alte Methode, <a name="preise"></a>, funktioniert in Browsern noch, ist in HTML5 aber veraltet. Setzen Sie die id direkt an die Überschrift. Eine verwandte Funktion, Textfragmente, lässt einen Link eine Passage ohne id hervorheben, mit der Syntax #:~:text=, wie MDN dokumentiert. Google nutzt diesen Mechanismus, wenn es Besucher zu der in manchen Featured Snippets zitierten Passage scrollt.

Wie fügen Sie Anker-Links in WordPress, Shopify, Webflow oder Wix ein?

Jedes große CMS erlaubt es, eine id zu setzen, ohne das Template anzufassen. Nur der Name des Feldes unterscheidet sich.

Wenn Ihr CMS ids automatisch erzeugt, prüfen Sie sie: Manche übernehmen den gesamten Überschriftentext, was lange, instabile Fragmente ergibt, die brechen, sobald Sie den Titel ändern.

Helfen Anker-Links bei SEO?

Anker-Links sind zuerst eine Funktion für die Nutzerfreundlichkeit. Ihr SEO-Wert ist indirekt, bei langen Inhalten aber real:

• Sprunglinks in den Ergebnissen: Bei langen, gut gegliederten Seiten zeigt Google manchmal Links zu Abschnitten unter dem Ergebnis, was Sichtbarkeit und Klicks steigern kann. Google entscheidet selbst, wann sie erscheinen.
• Bessere Zuordnung von Passagen: Klare Überschriften mit ids helfen Suchmaschinen und KI-Assistenten, eine genaue Antwort in einer langen Seite zu finden, dieselbe Logik wie bei Featured Snippets.
• Engagement: Ein Inhaltsverzeichnis führt Leser zum gesuchten Teil, statt dass sie die Antwort woanders suchen.
• Barrierefreiheit: Sprunglinks und seiteninterne Navigation helfen Nutzern mit Tastatur oder Screenreader, ein Prinzip der Barrierefreiheitsrichtlinien des W3C.
• Präzise interne Links: Ein Link auf #definition in einem anderen Artikel führt Leser zur genauen Passage und stärkt Ihre interne Verlinkung.

Was Anker-Links nicht leisten: Sie übertragen keine zusätzliche Autorität, denn ein Link auf seite#abschnitt zählt als Link auf die Seite, und sie ersetzen keinen guten Inhalt. Eine technische Warnung stammt direkt aus Googles Grundlagen zu JavaScript-SEO: Verwenden Sie Fragmente nicht, um andere Seiteninhalte zu laden, weil der Googlebot diese URLs nicht zuverlässig auflösen kann. Nutzen Sie Fragmente nur zum Scrollen innerhalb von Inhalten, die bereits auf der Seite stehen.

Was ist der Unterschied zwischen Anker-Link und Ankertext?

Die beiden Begriffe liegen nah beieinander und werden oft verwechselt. Beim Anker-Link geht es darum, wohin ein Link führt (ein Abschnitt). Beim Ankertext geht es darum, was der Link sagt (die klickbaren Wörter). Unser Glossareintrag zum Ankertext behandelt das zweite Thema ausführlich.

Welche Best Practices gelten für Anker-Links und ihren Text?

Jeder Anker-Link hat auch einen Ankertext, deshalb gelten beide Regelwerke gemeinsam.

• Kurze, lesbare ids: #preise, #installation statt #abschnitt-1 oder eines Fragments mit 12 Wörtern.
• Beschreibender Linktext: Google empfiehlt Text, der beschreibend, möglichst kurz und relevant ist, und rät von allgemeinen Formulierungen wie „hier klicken“ ab.
• Ein Inhaltsverzeichnis auf langen Seiten: ab etwa 1500 Wörtern die H2-Abschnitte oben auflisten, jeweils mit ihrer id verlinkt.
• Überschriften als Fragen: Überschriften, die wie echte Suchfragen formuliert sind, machen Sprunglinks nützlicher und leichter zitierbar.
• Stabile ids: Ändern Sie eine id nach der Veröffentlichung nicht, wenn andere Seiten oder Websites darauf verlinken.
• Struktur prüfen: Ein Analyse-Tool für die Überschriftenstruktur zeigt, ob Ihre H2- und H3-Ebenen sauber sind, bevor Sie Anker hinzufügen.

Welche Fehler sollten Sie vermeiden?

• Doppelte ids: Zwei Elemente mit derselben id lassen den Link nur zum ersten springen.
• Versteckte Ziele: Eine Überschrift in einem geschlossenen Tab oder Akkordeon ist für den Link eventuell nicht erreichbar.
• Fixierte Header über der Überschrift: Fügen Sie scroll-margin-top in CSS hinzu.
• Routing über Fragmente: Single-Page-Apps, die Inhalte über #/seite-URLs wechseln, sind für Google schwer zu crawlen.
• Überoptimierter Ankertext: Dasselbe exakte Keyword in jedem Link wirkt wie Manipulation.

Fazit

Ein Anker-Link führt Leser über ein #id-Fragment zu einem genauen Abschnitt einer Seite. Sie erstellen ihn, indem Sie der Überschrift eine id geben und darauf verlinken, in HTML oder über die Einstellungen Ihres CMS. Sein SEO-Nutzen ist indirekt, bei langen Inhalten aber konkret: Inhaltsverzeichnisse, mögliche Sprunglinks bei Google, klarere Passagen für KI-Antworten und präzisere interne Links, solange der Ankertext beschreibend bleibt. Wenn Sie nicht jeden Artikel von Hand gliedern möchten: Sorank, unsere SEO- und GEO-Software im autopilot, schreibt strukturierte Artikel mit Fragen als Überschriften und internen Links und veröffentlicht sie in Ihrem CMS. Sehen Sie sich den KI-Generator für Blogartikel an und testen Sie ihn 3 Tage kostenlos.