Anker und Verknüpfungen erzeugen im HTML

Anker im Seitenabschnitt eines Dokumentes

Einen Anker können Sie so ziemlich auf die gleiche Art erzeugen wie eine Verknüpfung, indem Sie nämlich die <a>-Kennung benutzen. Und wenn Sie sich schon gefragt haben, weshalb die Verknüpfungs-Kennung ein <a> enthält, anstelle eines <l> (für "link"), so wissen Sie es jetzt: Das "A" steht tatsächlich für "Anker" (anchor).

Als wir Verbindungen mit Hilfe der <a>-Kennung eingerichtet haben, bestanden die Tags aus zwei Teilen: dem href-Attribut in der einleitenden <a>-Kennung und jenem Text zwischen der einleitenden und der abschließenden Kennung, der als Verknüpfungs-Text diente.

Anker werden fast genauso erzeugt, mit der Ausnahme, dass Sie anstelle des href-Attributs in der <a>-Kennung das name-Attribut verwenden. Das name-Attribut besteht aus einem Kennwort (oder -wörtern), das gebraucht wird, um sich auf den Anker zu beziehen.

Anker können auch etwas Text zwischen der einleitenden und abschließenden <a>- Kennung enthalten, obwohl sie meistens nur zu einer Stelle mit einem einzigen Buchstaben führen. Dieser Text wird von manchen Browsern benutzt, wenn eine Verbindung zu diesem Anker ausgewählt wird; der Browser blättert durch das Dokument bis zu jenem Text, sodass dieser am oberen Rand des Bildschirms angezeigt wird, und er wird ihn auch optisch hervorheben.

Um zum Beispiel einen Anker im Seitenabschnitt, der html-info genannt wird, zu setzen, könnten Sie einen Anker namens html-info innerhalb der Überschrift einsetzen, und zwar folgendermaßen:

<h1>
	<a name="html-info">HTML Lernen - Grundlagen und Tutorials</a>
</h1>

Anders als Verknüpfungen werden Anker im fertigen Dokument nicht durch eine andere Schrift oder Farbe hervorgehoben. Ein Anker bleibt unsichtbar, bis Sie einer Verbindung folgen, die auf ihn verweist.

Um sich bei einer Verbindung auf einen Anker zu beziehen, verwenden Sie die gleiche Form einer Verknüpfung wie bei einer Verbindung mit dem Dokument als Ganzem, mit dem Datei-Namen oder der URL des Dokuments im href-Attribut. Auf den Namen des Dokuments selbst folgt jedoch ein Nummern-Zeichen (#) und der Name des Ankers in genau der Form, wie er im name-Attribut des Ankers steht (einschließlich der gleichen Groß- und Kleinschreibung), so wie hier:

<a href="html-lernen.html#html-info">Weiter zur HTML-Info</a>

Diese Verknüpfung veranlasst den Browser, aus dem Verzeichnis eine Ebene oberhalb des aktuellen Dokuments die Datei html-lernen.html zu laden und darin dann bis zu dem Anker namens "html-info" zu blättern, sodass der gewählte Text schließlich am oberen Rand des Bildschirms steht.

Verknüpfungen zu Ankern in demselben Dokument

Wie ist es nun, wenn Sie nur eine große Seite haben und zu Abschnitten innerhalb dieser Seite hin verknüpfen wollen? Sie können auch dazu Anker einsetzen, und bei größeren Seiten kann dies eine einfache Art und Weise sein, um zwischen Abschnitten hin- und herspringen zu können. Alles, was Sie tun müssen, um zu einem Abschnitt zu verknüpfen, ist, Ihren Anker wie gewohnt an jedem Abschnitt anzubringen. Wenn Sie dann zu diesem Anker hin verknüpfen, lassen Sie den Namen der Seite weg, fügen aber das Nummernsymbol und den Namen des Ankers ein. Wenn Sie also zu dem Anker mit dem Namen html-info hin verknüpfen würden, der sich auf dersel- ben Seite wie die Verknüpfung befindet, würde es so aussehen:

Weiter zur <a href=#html-info>HTML Lernen - Grundlagen und Tutorials</a>

Wenn Sie den Seitennamen weglassen, nimmt der Browser an, dass Sie sich mit der aktuellen Seite verbinden, und rollt zum entsprechenden Abschnitt.