Als Anchor wird allgemein eine Sprungadresse in einem HTML-Dokument bezeichnet, die auf eine Sprungmarke deutet. Der HTML-Anchor stellt einen Navigationsbezug zwischen verschiedenen Textstellen in einem Dokument dar. Genauer zu unterscheiden sind dabei der Link mit einem Fragmentbezeichner und das Zielelement mit einer eindeutigen ID. Der Begriff Anker – oder auch englisch Anchor (HTML) – steht in der Hypertext-Theorie außerdem für Anfang und Ende eines Hyperlinks.
Typische Beispiele für Anchor
Bei Sprungadressen handelt es sich um Bezugspunkte innerhalb einer Dokumentenstruktur, die ein direktes Springen zu bestimmten Stellen im Content – den Sprungmarken – erlauben. Als typisches Beispiel einer Verankerung kann die Verlinkung von Überschriften, die erst später im Text auftauchen, mit einem Inhaltsverzeichnis angesehen werden, das am Anfang der HTML-Datei steht. Klickt man den Verweis im Inhaltsverzeichnis, springt oder scrollt das Dokument automatisch an die entsprechende Textstelle. Der HTML-Anchor kann allerdings auch auf Fußnoten am Ende der HTML-Seite deuten oder Querverweise zwischen einem Begriff und einer anderen Textstelle im Dokument bilden.
Auch Tabellen, Bilder und andere Illustrationen können als Sprungziele dienen. Dafür erhält das jeweilige Element oder ein geeigneter umgebender Container eine eindeutige ID. Bei langen HTML-Dokumenten kann ein Anchor am Seitenende auf den Seitenanfang verweisen. Wichtig ist, dass das Ziel trotz fixierter Navigationselemente sichtbar bleibt und die Bezeichnung des Links verständlich erkennen lässt, welcher Abschnitt angesprungen wird.
Anchor: Aufbau und Syntax
Die URL-Codierung von Sprungadressen in HTML-Dokumenten erfolgt in der Regel mit einer Raute als Fragmentbezeichner innerhalb eines href-Attributs. Ein Link wie href="#beispiel" verweist auf ein Element mit id="beispiel". Der Fragmentbezeichner trennt die Dokumentadresse von der Sprungadresse. Bei vollständiger Übernahme des Links in die Adresszeile eines Browsers lädt der Browser das Dokument und springt anschließend an die angegebene Sprungmarke.
Beispiel: Link und Ziel müssen dieselbe Kennung verwenden. Hier führt der Link direkt zur Überschrift „Pflegehinweise“ auf derselben Seite.1
<a href="#pflegehinweise">Zu den Pflegehinweisen</a>
<h2 id="pflegehinweise">Pflegehinweise</h2>Die ID darf im Dokument nur einmal vorkommen.
Lokal adressierte Teile innerhalb der HTML-Struktur werden bei Aktivierung des Links nicht als eigener Dokumentpfad an den Server übermittelt. Befindet sich das Ziel auf der bereits geladenen Seite, ist deshalb in der Regel keine erneute Serveranfrage notwendig. Fragmentbezeichner sollten dennoch einfach und eindeutig aufgebaut sein. Eine HTML-ID darf keine Leerzeichen enthalten. Sonderzeichen können eine URL-Codierung erfordern und erschweren das manuelle Verlinken, während eine weitere nicht codierte Raute den Fragmentbezeichner nicht einfach fortsetzt. Robuste Anchornamen bestehen daher vorzugsweise aus lateinischen Kleinbuchstaben, Ziffern und Bindestrichen.
Beim Festlegen von einem Anchor und Verweisen sollte auf eine einheitliche Groß- und Kleinschreibung der Anchornamen Wert gelegt werden. Link und Ziel müssen zuverlässig zusammenpassen. Statt unterschiedliche Schreibweisen desselben Namens doppelt vorzudefinieren, sollte jede ID im Dokument genau einmal vorkommen. Aussagekräftige Bezeichnungen wie aufbau-und-syntax erleichtern zudem die Wartung und machen die Dokumentstruktur für Redakteure und Entwickler nachvollziehbar.
Ein Anchor sollte – vornehmlich, um bereits im Vorfeld Probleme zu vermeiden – am besten mit einem lateinischen Kleinbuchstaben beginnen. Nachfolgend sind auch arabische Ziffern erlaubt. Großbuchstaben sollten bestenfalls die Ausnahme bleiben. Theoretisch sind für Anchor auch zahlreiche Sonderzeichen möglich. Praktisch sind einfache Zeichenfolgen jedoch browserübergreifend leichter zu verwenden und müssen in URLs seltener codiert werden. Jeder Anchor sollte sich unabhängig von ähnlichen Schreibweisen nur einmal im Dokument ereignen. Das bedeutet in der Praxis, dass ein Anchor, der sich im Namen lediglich in Groß- und Kleinbuchstaben unterscheidet, nicht zusätzlich im jeweiligen HTML-Dokument notiert werden sollte, sofern es sich vermeiden lässt.
Beim Ankern von Sprungmarken spielen historisch zwei Attribute eine besondere Rolle: das name-Attribut und das id-Attribut. Das name-Attribut wurde einem a-Element zugeordnet. In modernem HTML wird für ein Sprungziel das id-Attribut verwendet, das beispielsweise direkt in einem Überschriften-Tag oder einem anderen geeigneten Element stehen kann. Das ältere name-Attribut kann in Bestandsdokumenten weiterhin vorkommen, sollte für neue Sprungmarken aber nicht mehr die bevorzugte Methode sein. Unabhängig von der Methode gilt: Keine doppelte Verwendung von Anchornamen beziehungsweise IDs. Diese Regel ist auch für die korrekte Verarbeitung des Dokuments wichtig.
Ein besonderer Fragmentwert ist top. Fehlt ein gleichnamiges Zielelement, können moderne Browser bei #top an den Anfang des Dokuments springen. Für eine verlässlich nachvollziehbare Struktur kann der Seitenanfang dennoch ausdrücklich mit einer passenden ID versehen werden. So hängt die Funktion nicht allein von einer Sonderbehandlung des Browsers ab.
HTML-Anchor in der Suchmaschinenoptimierung
Eine Zeit lang spielten Anchor (HTML) im Webdesign kaum noch eine nennenswerte Rolle. Inzwischen werden sie bei langen Dokumenten wieder häufiger für Inhaltsverzeichnisse und eine klarere Navigation genutzt. Auch für die Suchmaschinenoptimierung ist diese Technik relevant, weil sie Inhalte besser zugänglich und einzelne Abschnitte direkt verlinkbar macht.
Anchor-Strukturen können Google dabei helfen, relevante Abschnitte einer Seite zu erkennen und Nutzer direkt zu einer passenden Textstelle zu führen. In bestimmten Suchergebnissen kann Google entsprechende Links zu Abschnitten oder einen direkten Sprung zu einer Passage anzeigen. Ob und in welcher Form dies geschieht, entscheidet die Suchmaschine jedoch selbst. Eine erweiterte Darstellung oder höhere Klickrate lässt sich durch das Setzen von Anchors nicht garantieren.
HTML-technisch handelt es sich bei Anchors um Verlinkungen. Duplicate Content durch unterschiedliche Fragmentbezeichner muss allerdings in der Regel kein SEO fürchten, da sie dasselbe Dokument und keine eigenständigen Inhaltsseiten adressieren. Anchornamen sollten trotzdem nicht als unsichtbare Ablage für zusätzliche Suchbegriffe verwendet werden. Entscheidend sind eine verständliche Überschrift, ein beschreibender Linktext und ein tatsächlich hilfreicher Zielabschnitt. Die IDs unterstützen dabei Navigation und technische Adressierbarkeit, sind aber kein eigenständiger Hebel, mit dem sich das Ranking allein durch Keywords im Quelltext verbessern lässt.
Fazit
Somit bringen Anchor im HTML-Bereich einen klaren Nutzen: Sie eignen sich hervorragend, um gerade lange HTML-Dokumente mit viel Text inhaltlich zu strukturieren und dem Leser einen echten Mehrwert zu bieten. Der Leser kann über ein Inhaltsverzeichnis oder Querverweise direkt an für ihn interessante Stellen navigieren. Der Webseitenbetreiber macht einzelne Abschnitte gezielt verlinkbar und erleichtert Suchmaschinen das Erfassen der Seitenstruktur. Eine bessere Darstellung in Suchresultaten ist möglich, bleibt aber von Inhalt, Suchanfrage und Verarbeitung durch die Suchmaschine abhängig.
Zusammenfassung
Ein Anchor bezeichnet in einem HTML-Dokument eine Sprungadresse, die den Navigationsbezug zwischen verschiedenen Textstellen festlegt. Typische Beispiele für Anker sind die Verlinkung von Überschriften aus einem Inhaltsverzeichnis oder Querverweise innerhalb eines Textes. Beim Erstellen eines Anchors sind der Aufbau und die Syntax wichtig. In modernem HTML wird das Sprungziel vor allem mit einer eindeutigen ID ausgezeichnet und über einen href-Wert mit Fragmentbezeichner verlinkt.
In der Suchmaschinenoptimierung sind Anchor hilfreich, da sie Inhalte strukturieren und einzelne Abschnitte direkt erreichbar machen. Suchmaschinen können solche Sprungziele für die Darstellung von Abschnittslinks verwenden. Das gezielte Setzen von Ankern verbessert jedoch nicht automatisch das Ranking oder die Klickrate.
Zusammenfassend bieten Anchor sowohl dem Leser als auch dem Webseitenbetreiber Vorteile. Sie erleichtern die Navigation in langen Dokumenten, unterstützen barriereärmere Nutzung und schaffen direkt teilbare Verweise auf konkrete Inhalte.
Häufige Fragen und Antworten
Als Anchor wird allgemein eine Sprungadresse in einem HTML-Dokument bezeichnet, die auf eine Sprungmarke hinweist. Ein Link mit Fragmentbezeichner stellt dabei den Navigationsbezug zu einem Element mit einer eindeutigen ID her.
Typische Beispiele für Anchor sind die Verlinkung von Überschriften aus einem Inhaltsverzeichnis oder Querverweise innerhalb eines Textes. Auch Tabellen, Bilder und andere Illustrationen können über eine eindeutige ID als Sprungziele ausgezeichnet werden.
Sprungadressen werden üblicherweise mit einer Raute als Fragmentbezeichner im href-Attribut verlinkt, beispielsweise mit href="#ziel". Das Zielelement erhält die entsprechende Angabe id="ziel". Die ID muss eindeutig sein, darf keine Leerzeichen enthalten und sollte in Link und Ziel mit identischer Groß- und Kleinschreibung verwendet werden.
Anchor erleichtern die Navigation, machen einzelne Abschnitte direkt verlinkbar und verdeutlichen die Struktur langer Inhalte. Suchmaschinen können Sprungziele für Links zu Abschnitten verwenden. Eine verbesserte Suchergebnisdarstellung, höhere Klickrate oder bessere Position wird dadurch jedoch nicht automatisch erreicht.
SEO-Analyse kann die Struktur langer Seiten, Inhaltsverzeichnisse, Linktexte und technische Sprungziele prüfen. Dabei geht es um eindeutige IDs, funktionierende Verweise und eine sinnvolle Einbindung in die gesamte Seitenstruktur. Diese Arbeit verbinden wir mit hilfreichen Inhalten und einer technisch zugänglichen Website, damit Besucher relevante Abschnitte zuverlässig erreichen.
