XOVI Glossar

Was ist ein Anchor Tag?

Hinter jedem Hyperlink im Internet verbirgt sich ein HTML-Code, der sogenannte Anchor Tag. Dieser umfasst alle klickbaren Wörter des Links. Suchmaschinen nutzen diese Wörter innerhalb des Anchor Tags um den Link thematisch zuordnen zu können. So sieht der Anchor Tag hinter einem Hyperlink aus:

<a href="http://www.musteradresse.de" >Musterwebsite</a>

Der Anchor Tag wird mit einem <a> geöffnet und mit einem </a> geschlossen. Innerhalb dieses Tags tauchen Attribute auf, von denen jedes einzelne eine ganz bestimmte Bedeutung hat, bzw. einen ganz bestimmten Befehl auslöst: das href-Attribut, das name-Attribut und das target-Attribut. Im folgenden sollen alle drei Attribute kurz erläutert werden.

href-Attribut: Der Link

Merkmal eines Hyperlinks ist die Webadresse, bzw. URL auf die der Link verweist. Diese URL wird im href-Attribut definiert. Es muss sich dabei nicht zwingend um eine Website handeln, der Link kann auch auf eine Datei bzw. ein Dokument verweisen, das allerdings ebenfalls eine eindeutige Zieladresse benötigt. Dementsprechend sähe der Anchor Tag für einen Link zu Wikipedia mit dem Wort Enzyklopädie folgendermaßen aus:

<a href="http://www.wikipedia.org" >Enzyklopädie</a>

Die Bedeutung des href-Attributs lässt sich sehr leicht merken: href steht für Hypertext Reference, darin steckt also das Wort Referenz. Letztendlich ist ein Link ja nichts anderes als eine Referenz, bzw. ein Verweis. Das Gleichzeichen (“=”) verbindet das Attribut mit seinem zugehörigen Wert. Die Adresse wird zusätzlich von Hochkommas eingeschlossen. Die klickbaren Wörter im Text werden auch Linktext oder Anchor Text genannt. Dieser sollte immer gut gewählt werden, denn wie bereits erwähnt, stellen die Suchmaschinen einen thematischen Zusammenhang zwischen Linktext und Zieladresse her. Wer websiteintern verlinken möchte, sollte nicht die komplette URL, sondern nur die betreffende Unterseite angeben, denn das beschleunigt den Aufbau der Seite.

name-Attribut: Der interne Verweis

Mithilfe des name-Attributs, kann man Verweise innerhalb der aufgerufenen Website definieren. Mit einem Klick auf den Link springt die Ansicht direkt auf eine bestimmte Zeile. Man spricht auch vom Setzen eines Ankers oder einer Sprungmarke. Bekanntes Beispiel: Wikipedia. Lange Wikipedia-Artikel haben ein Inhaltsverzeichnis. Der Klick auf ein bestimmtes Sub-Thema im Inhaltsverzeichnis lässt die Seite umgehend zum diesem Abschnitt springen, ohne, dass der Nutzer scrollen muss. Um auf einen Anker zu verweisen, muss dieser zunächst definiert werden. Das ganze sieht dann z. B. folgendermaßen aus:

<a name="start" >Kapitel Eins</a>

Im vorangestellten Code wurde Kapitel Eins als Anker mit dem Namen “start” definiert. Ans Ende der Seite setzt man nun zum Beispiel folgenden Link:

<a href="#start" >zurück zum Anfang</a>

Am Ende der Seite stände also “zurück zum Anfang” als klickbarer Text. Der Klick sorgt dafür, dass man wieder am oberen Ende der Seite angekommen ist, ohne scrollen zu müssen. Dank der Raute, bzw. des Hashtags, weiß der Computer sofort, dass es sich um einen Verweis innerhalb der Seite handelt, folglich muss diese nicht neu geladen werden. Längere Texte lassen sich so zum Beispiel in Kapitel unterteilen, die über ein oben stehendes Inhaltsverzeichnis direkt aufgerufen werden können. Das ist allerdings nicht alles: Auch die Kombination aus externem Link und Anker ist möglich. So kann man auf eine bestimmte Stelle auf einer Website verlinken, dafür muss die Zielseite allerdings einen Anker enthalten. Das folgende Beispiel verlinkt den Text “Social Media Anwendungen” auf die Wikipedia-Seite zum Thema Social Media, und innerhalb dieser Seite direkt auf das Kapitel “Unternehmerische Anwendungsfelder”:

<a href="http://de.wikipedia.org/wiki/Social_Media#Unternehmerische_Anwendungsfelder" >Social Media Anwendungen</a>

target-Attribut: Neues Fenster bitte!

Ein Link-Code muss nicht zwingend ein target-Attribut enthalten, er funktioniert auch ohne. Mithilfe dieses Attributs kann allerdings festgelegt werden, wie die Zieladresse oder Zieldatei aufgerufen wird. In der Regel wird das Attribut mit target=”blank” definiert, um eine Website in einem neuen Fenster bzw. einem neuem Tab zu öffnen. Früher, als es noch nicht möglich war, mehrere Tabs innerhalb eines Fensters zu öffnen, wurde mit diesem Wert stets ein neues Fenster geöffnet. Heutzutage öffnen die meisten Browser den Link mit diesem Befehl in einem neuen Tab. Der Code sieht mit target-Attribut folgendermaßen aus:

<a href="http://www.musterseite.de" target="blank" rel="noopener noreferrer">Zur Musterseite</a>

title-Attribut: Zusatzinformationen liefern

Das title-Attribut gehört ebenfalls zu den optionalen Inhalten des Link-Codes. Der Nutzer bekommt das title-Attribut zu sehen, wenn er mit der Maus über den Link fährt, allerdings ohne ihn anzuklicken. So kann dem Nutzer ein zusätzlicher Hinweis gegeben werden, was sich hinter dem Link verbirgt. Gleichzeitig ist der title-Tag auch für Suchmaschinen relevant. Der Code sieht mit title-Attribut wie folgt aus:

<a href="http://www.musterseite.de" title="Weitere Infos finden Sie auf dieser Seite">Zur Musterseite</a>

Die Relevanz des Anchor Tags für die Suchmaschinenoptimierung

Der Anchor Tag hat eine große Bedeutung für die Suchmaschinenoptimierung. So basiert z. B. das Google-Ranking einer Seite maßgeblich auf Verlinkungen der Seite von Extern. Mit den unterschiedlichen Attributen kann die Qualität des Links verbessert werden, denn die Suchmaschine bekommt durch den title-Tag und den Linktext genauere Infos über den Inhalt und den thematischen Zusammenhang von Webseiten. Für die Suchmaschinenoptimierung ist es daher unabdingbar, den Linktext wie das title-Attribut mit den gewünschten Keywords zu versehen.