Start Magazin Tipp: Was ist ein Anker Link und wie setzt man ihn?

Tipp: Was ist ein Anker Link und wie setzt man ihn?

435
0
Anker Icon | Android-User.de
Designed by rawpixel.com / Freepik

In der letzten Woche haben wir erfahren, dass Google das Verlinken auf einzelne Textstellen vereinfachen möchte. Die sogenannten Anker-Links können bisher nur mit ein wenig Aufwand gesetzt werden. In unserem heutigen Tipp-Artikel erklären wir dir, was ein Anker Link ist und wie man ihn setzt (trotz der baldigen Vereinfachung durch Google Chrome).

Tipp: Was ist ein Anker Link?

Ein Anker- oder auch im englischen Anchor-Link wird dazu genutzt, um andere Dokumente oder Webseiten zu verlinken. Bei einer Verlinkung innerhalb eines HTML-Dokumentes nennt man das Ganze Sprungmarke. Ein Anker bildet den Anfangs- und Endpunkt eines Hyperlinks. Jedes Element kann zu solch einer Sprungmarke werden und dadurch, dass eine solche Sprungmarke auch innerhalb einer URL-Adresse vorkommen beziehungsweise gesetzt werden kann, lässt sich damit auf eine Textstelle innerhalb der Webseite verlinken.

Ein Anker ist also ein Teil des HTML-Quellcodes einer Seite. Er kann mit Informationen über einen Link angereichert werden.

Wie setze ich einen Anker Link in einer HTML-Datei?

Zuerst schaust du, auf welche Stelle du in einem Text verlinken möchtest. Geht es zum Beispiel um ein Kapitel, welches von einer Überschrift eingeleitet wird, könntest du den Anker in die Überschrift setzen:

<h2 id=“Ankername“>Überschrift</h2>

<h2> ist der zweite Header, die zweite Überschrift, könnte aber auch durch <h1> oder <h3> beliebig angepasst werden. Es ist einfach nur die “Einfassung” für deine Überschrift.

id=”Ankername” <- hier gibst du einen Namen für deinen Anker an

(bei einer älteren HTML-Version heißt es dann <a name=“Ankername“>

>Überschrift</h2> <- hier gibst du die Überschrift für deinen Text an.

Wie verweise ich auf einen Anker-Link in der gleichen HTML-Datei?

Um mit einem Anker auf einen Abschnitt in der gleichen Datei zu verlinken erstellst du diesen Verweis:

<a href=“#Ankername“>Link</a>

bei #Ankername <- hier schreibst du den Namen deines Ankers hin

<a href=“#Ankername“> und </a> <- das und ersetzt du durch die Bezeichnung, mit der du auf den Anker verweisen möchtest, zum Beispiel Link.

Wie verweise ich auf einen Anker Link in einer anderen HTML-Datei?

Um mit einem Anker auf einen Abschnitt in einer anderen HTML-Datei zu verlinken erstellst du diesen Verweis:

<a href=“dokument.html#Ankername“>Link</a>

bei “dokument.html gibst du den Namen des HTML-Dokumentes ein, auf das du verweisen möchtest

bei #Ankername gibst du den Namen des Ankers ein

<a href=“dokument.html#Ankername“> und </a> <- das und ersetzt du wieder durch die Bezeichnung für den Verweis

Die einzelnen Elemente eines Anker Links

  • href=”” Mit diesem Befehl weiß der Browser, dass er eine Seite außerhalb des Dokuments aufrufen muss. Dies ist die sogenannte Hypertext Referenz, welche eine Adresse des außerhalb zu öffnenden Dokuments enthält.
  • target=““ Dieser Befehl ist optional. Mit ihm kannst du festlegen, in welchem Fenster ein Link geöffnet werden soll. Gibt es kein definiertes Target oder steht dort target=”_self” wird die verlinkte Seite im aktuellen Browserfenster/Tab geöffnet.
  • Oftmals siehst du target=”_blank”. Damit sagst du dem Browser, dass er die verlinkte Seite in einem neuen Fenster/neuem Tab öffnen soll
  • title=””  Du kannst einem Link einen Title geben, musst es jedoch nicht. Hat ein Link einen Titel bekommen wird dieser immer dann angezeigt, wenn du mit der Maus über den Link fährst.
  • rel=“nofollow„ Sofern dieser Teil in einem Link vorkommt weiß Google, dass es sich dabei um einen Link handelt, dem kein Vertrauen geschenkt werden soll. Das bedeutet, dass Google diesem Link nicht folgt und kein Vertrauen über diese Verlinkung weitergibt.

Fazit

Ist ein Dokument besonders lang kann es sinnvoll sein, dieses in mehrere Abschnitte zu gliedern. Damit der Leser des Dokuments dann direkt auf die einzelnen Abschnitte des Dokuments zugreifen kann setzt man sogenannte Anker Links. Somit springt man direkt, ohne langes Suchen auf die einzelnen Abschnitte.

Kommentiere den Artikel

Please enter your comment!
Please enter your name here