Anchors – auch Anker-Links oder Sprungmarken genannt – sind HTML-Elemente, mit denen Besucher gezielt zu einer bestimmten Stelle auf einer Webseite springen können. Besonders bei langen Seiten sorgen sie für eine bessere Navigation und Nutzerführung.
Was sind Anchors?
Ein Anchor besteht technisch aus zwei Teilen:
- Zielmarke: Ein HTML-Element mit einer
id, z. B.<div id="kontakt">. - Link dorthin: Ein Verweis, der mit
#kontaktauf genau diese Stelle springt.
Wenn Sie etwa auf einer Landing Page einen Button mit der Aufschrift „Jetzt Kontakt aufnehmen“ haben, der nach unten zur Kontaktsektion führt – dann nutzen Sie einen Anchor.
Wo kommen Anchors zum Einsatz?
- In Inhaltsverzeichnissen oder Glossaren wie diesem
- Auf Onepager-Websites für Navigation zwischen Sektionen
- Bei „Zurück nach oben“-Links
- Für barrierefreies Surfen per „Skip to Content“-Link
Vorteile von Anchors
- Bessere Nutzerführung, vor allem bei langen Seiten
- Mehr Übersicht und Struktur
- Verbesserte User Experience auf mobilen Geräten
- Nützlich für Barrierefreiheit, wenn richtig eingesetzt
Der Klicklounge-Tipp:
Achte darauf, dass Anker-Links korrekt funktionieren – und nicht durch Sticky-Header verdeckt werden. Außerdem sollte jedes Ziel-Element eine eindeutige id haben. In Kombination mit Responsive Design sind Anchors ein starkes Werkzeug für moderne Websites.