Anchor Tag


Definition: Ein Anchor Tag (deutsch auch: Ankertext oder Linktext) ist ein HTML-Tag, das Anfangs- und Endpunkt eines Hyperlinks definiert, der eine Website mit einer anderen verlinkt oder intern Unterseiten auf der gleichen Domain miteinander verlinkt. Das Anchor Tag ist im HTML-Code als

<a> … </a>

festgelegt. In der Regel wird der Ankertext als sogenannter „sprechender Text“ verfasst. Das erleichtert es Suchmaschinen und Usern gleichermaßen, die Thematik des verlinkten Ziels einzuordnen. Somit verbessern Anchor Tags auch die Usability einer Website.

Attribute innerhalb des Anchor Tags

Alle Attribute im Anchor Tag werden mit Hilfe des „=“-Zeichens mit dem Attributwert verknüpft. Vor und nach dem Attributwert werden Hochkommas gesetzt. Der definierte Text ist der sogenannte Linktext; das eigentliche Anchor Tag also.

Das wichtigste Attribut innerhalb des ausgehenden Links

  • ein nicht geklickter Link ist unterstrichen und blau
  • ein geklickter Links ist unterstrichen und lila
  • ein aktiver Link ist unterstrichen und rot.

Diese Eigenschaften können im CSS-Stylesheet individuell definiert werden. Einzelne Links können außerdem händisch mittels anderer Attribute verändert werden. Anchor Tags unterstützen auch globale und Event-Attribute.

Die wichtigsten Attribute im Anchor Tag

Von den aufgelisteten Attributen ist ausschließlich das href-Attribut obligatorisch. Ohne das href-Attribut ist das Anchor Tag GoogleLinkpopularität

Attribute Zweck Beispiel
href Gibt die Ziel-URL des Links an a href="domain.com"
target Legt fest, ob das Linkziel im gleichen oder in einem neuen Tab oder Fenster geöffnet wird target="_blank" 
rel Gibt die Beziehung zwischen dem Quell- und dem Zieldokument an rel="nofollow noopener noreferrer"

rel="sponsored" rel="ugc"

title Definiert den Text, der einem User beim Mouseover angezeigt wird title="Hallo! Ich bin ein Link"

href-Attribut im Anchor Tag

href ist die Abkürzung für hypertext reference. Das bedeutet, das href-Attribut legt das Sprungziel eines Links fest. Das kann eine interne oder externe Website sein. Ebensogut kann aber auch ein PDF-Dokument oder ein Bild das Sprungziel eines Hyperlinks sein. Beispiel für ein Anchor Tag, das auf eine externe URL verweist:

<a href="domain.com">externe Domain</a>

Beispiel für ein Anchor Tag, das auf eine interne URL verweist:

<a href="MeineSeite.html">interne Domain</a>

target-Attribut im Anchor Tag

target (deutsch: Ziel) legt fest, wie eine Zielseite oder ein Zieldokument geöffnet werden soll:

Beispiel, um einen Link im neuen Tab zu öffnen:

<a href="domain.com" target="_blank">Link im neuen Tab öffnen</a>

Beispiel, um einen Link im übergeordneten Fenster zu öffnen:

<a href="domain.com" target="_parent">Link im übergeordneten Fenster öffnen</a>

Beispiel, um einen Link vollflächig im Vordergrund des Fensters zu öffnen:

<a href="domain.com" target="_top">Link im gesamten Fensterbereich öffnen</a>

Beispiel, um einen Link in einem definierten Frame zu öffnen:

<a href="domain.com" target="framename">Link in eigens benannten Rahmen öffnen</a>

Des weiteren besteht die Möglichkeit, ein Zieldokument im gleichen Tab zu öffnen, wie die Seite, von der aus der Verweis erfolgt. Die Wichtigkeit dieses Attributes ist vernachlässigbar, da dies der Standardeinstellung entspricht:

Beispiel, um einen Link im gleichen Tab zu öffnen:

<a href="domain.com" target="_self">Link im gleichen Tab öffnen</a>

rel-Attribut im Anchor Tag

rel ist die Abkürzung für das englische Wort relation und beschreibt damit die Beziehung, in der Quell- und Zieldokument zueinander stehen. Es handelt sich um ein beschreibendes Attribut, das einem Hyperlink beigefügt wird, um die Link-Art oder eben die Link-Beziehung zu beschreiben.

Beispiele für rel-Attribute sind unter anderem:[1]

  • rel="nofollow" – um Suchmaschinen anzuweisen, den Link nicht zu tracken
  • rel="canonical" – um die bevorzugte URL für das aktuelle Dokument festzulegen
  • rel="stylesheet" – um ein Stylesheet zu importieren

Beispiel, um Google anzuweisen, einem Link nicht zu folgen:

<br /><a href="domain.com" rel="nofollow“>diesem Link nicht folgen</a>

 

title-Attribut im Anchor Tag

Das title-Attribut ist vor allen Dingen, ein Usability-Faktor. Denn informiert den Nutzer darüber, wohin er weitergeleitet wird, wenn er einen Link anklickt. Um diese Information einzublenden, muss er Maus über den Linkverweis bewegen:

<br />…wird die <a href="schokoladenkenner.html" title="100 Zubereitungsarten von Schokolade“>Zubereitung</a> von Schokolade…

 

Das title-Attribut kann auch bei Bildern und Grafikdateien verwendet werden, um eine kurze Beschreibung dessen zu geben, was auf dem Bild dargestellt wird.

<br /><img src="beispielbild.png" alt="Beispielbild" title="Hier sehen Sie ein Beispielbild“>

 

Bedeutung für die Suchmaschinenoptimierung

Die Zeichenkette „Zubereitung“ im oberen HTML-Verweis ist der Linktext, der im Fließtext einer Website sichtbar ist und je nach Layout beispielsweise als unterstrichener, blauer Text erscheint. Dieser Linktext ist aus Sicht der Suchmaschinenoptimierung besonders wichtig. Der Anchor Text ist ein Teil des Anchor Tags.

Anchor Tags sind ein grundlegendes Werkzeug, um gezielt HTML-Dokumente für Suchmaschinen zu optimieren. Verwendet man bei internen Links die komplette Webadresse, kann es dazu führen, dass die Seite langsamer geladen wird. Somit haben Anchor-Tags auch Einfluss auf den Site Speed.

Anchor Texte und title-Attribute werden verwendet, um Suchmaschinen und Nutzern einen Mehrwert an Informationen zu geben. Das title-Attribut hat allgemein keine direkten Auswirkungen auf die SEO. Es kann allerdings die Klickrate erhöhen und somit indirekt die Nutzersignale beeinflussen, die Google von der Website erhält. Anders beim Anchor-Text: So wie bei der Benennung von sprechenden URLs, ist auch bei Anchor Texten ein sorgfältig recherchiertes Keywording für die interne Verlinkung essentiell, da dort platzierte Keywords dem User und dem Ranking zu Gute kommen können.

Bei internen Links können Webmaster und SEOs etwa einzelne Keywords direkt verlinken, ohne dabei mit Sanktionen durch Suchmaschinen rechnen zu müssen. Im Gegenteil, durch die Verlinkung spezifischer Keywords auf der Webseite kann die thematische Relevanz einer Unterseite gestärkt und somit das Ranking beeinflusst werden. Bei Backlinks hingegen kann die übermäßige Verwendung von Keyword-Links spätestens im Zuge des Penguin Udates 2013 zu einer Penalty durch Google führen.[2]

Einzelnachweise

  1. HTML Attribut: rel MDN Web Docs. Abgerufen am 24.07.2021
  2. Matt Cutts über das Penguin 2.0 Update im Mai 2013 YouTube. Abgerufen am 24.07.2021

Weblinks