Links in HTML: Grundlagen, Arten und wichtige Attribute

Samuel Becker

Links gehören zu den wichtigsten Bausteinen des Webs. Ohne sie gäbe es keine einfache Möglichkeit, von einer Seite zur nächsten zu gelangen, innerhalb einer langen Seite zu springen oder Inhalte logisch miteinander zu verbinden. In HTML werden Links mit dem <a>Element erstellt. Dieses Element macht aus Texten, Bildern oder anderen Inhalten klickbare Verweise und bildet damit die Grundlage für die Navigation im Internet.

Ein einfacher Link sieht so aus:

<a href=„beispielseite.html“>Auf zur Beispielseite…</a>
Alles, was zwischen dem öffnenden und schließenden Tag steht, wird für Besucher anklickbar. In Browsern wird ein Link häufig standardmäßig unterstrichen dargestellt. Beim Anklicken öffnet sich das Ziel, das im Attribut href definiert wurde. Genau dieses Attribut ist der zentrale Bestandteil eines Hyperlinks, denn es legt fest, wohin der Verweis führt.

Links verbinden Inhalte miteinander. Sie können auf andere Seiten derselben Website verweisen, auf externe Webseiten führen oder den Besucher direkt zu einer bestimmten Stelle innerhalb eines Dokuments bringen. Dadurch verbessern sie sowohl die Benutzerführung als auch die Struktur einer Website. Wer Inhalte sinnvoll verlinkt, hilft Besuchern dabei, sich schneller zurechtzufinden und relevante Informationen leichter zu entdecken.

Besonders wichtig ist, dass Linktexte klar und verständlich formuliert sind. Statt ungenauer Formulierungen wie „hier klicken“ ist es besser, direkt zu benennen, was den Nutzer erwartet, etwa „Zur Kontaktseite“ oder „Mehr über HTML-Attribute lesen“. So werden Links nicht nur benutzerfreundlicher, sondern auch besser für Suchmaschinen und Screenreader.

Lesen:  Kosten der Homepageerstellung 2025: Welche Ausgaben wirklich auf Unternehmen zukommen

In HTML gibt es verschiedene Arten von Linkzielen. Welche Form genutzt wird, hängt davon ab, ob auf interne oder externe Inhalte verwiesen werden soll.

Ein relativer Link zeigt auf eine Datei innerhalb derselben Website. Ein Beispiel dafür ist datei.html. Dieser Verweis funktioniert, wenn sich die Datei im gleichen Verzeichnis befindet wie das aktuelle Dokument. Soll auf eine Datei in einem übergeordneten Verzeichnis verwiesen werden, kommt meist eine Schreibweise wie ../pfad/datei.html zum Einsatz.

Daneben gibt es absolute Pfade ohne Domain, etwa /pfad/datei.html. Diese beginnen am Stammverzeichnis der Website und bleiben innerhalb derselben Domain. Externe Links hingegen enthalten die vollständige Adresse, zum Beispiel https://example.com/. Sie führen auf eine andere Website. Wird zusätzlich ein konkreter Unterpfad angegeben, spricht man häufig von einem Deep-Link, etwa https://example.com/pfad/datei.html.

Wichtige Attribute des <a>Elements

Das wichtigste Attribut eines Links ist href. Es bestimmt das Ziel des Verweises. Ohne href ist ein <a>Element zwar formal möglich, erfüllt aber meist keine klassische Linkfunktion.

Ebenfalls bekannt ist das Attribut target. Damit wird festgelegt, wo das Linkziel geöffnet werden soll. Besonders verbreitet ist target="_blank", wodurch sich das Ziel in einem neuen Tab oder Fenster öffnet. target="_self" lädt die neue Seite im aktuellen Fenster. Weitere Werte wie _parent oder _top stammen aus der Arbeit mit Framesets und spielen heute kaum noch eine Rolle.

Das Attribut title kann zusätzliche Informationen über einen Link liefern. In vielen Browsern erscheint dieser Hinweis als Tooltip, wenn man mit der Maus über den Link fährt. Sinnvoll ist das vor allem dann, wenn der sichtbare Linktext allein nicht ausreicht, um das Ziel genau zu erklären.

Lesen:  TYPO3 Tutorial – Der Einstieg

Darüber hinaus existieren weitere Attribute wie rel, hreflang, type oder charset. Sie geben zusätzliche Informationen über die Beziehung zum Ziel, die Sprache des Zieldokuments oder dessen Inhaltstyp. In modernen Projekten ist besonders rel wichtig, etwa bei externen Links mit target="_blank".

HTML Links

Anker und Sprungmarken innerhalb einer Seite

Links müssen nicht immer auf andere Seiten verweisen. Sie können auch innerhalb eines Dokuments zu einer bestimmten Stelle springen. Dafür wird im hrefAttribut eine Raute mit einem Namen oder einer ID verwendet, zum Beispiel #kontakt.

Der Link könnte so aussehen:

<a href=„#kontakt“>Zum Kontaktbereich</a>
Damit der Sprung funktioniert, muss es im Dokument ein passendes Ziel geben, etwa ein Element mit id="kontakt". Früher wurde dafür oft das nameAttribut in einem Link verwendet. Heute ist die Verwendung von IDs der übliche Standard.

Technisch gesehen lässt sich ein Link sehr schnell einbauen. Gute Verlinkung bedeutet jedoch mehr als nur funktionierenden Code. Links sollten verständlich beschriftet, logisch platziert und für Besucher hilfreich sein. Wer interne Verweise sauber aufbaut und Anker gezielt nutzt, verbessert Übersicht, Bedienbarkeit und Professionalität einer Website deutlich.

Wenn du möchtest, formatiere ich dir den Text im nächsten Schritt auch direkt als fertigen Magazin- oder Wiki-Artikel mit Einleitung, Zwischenüberschriften und Schlussabschnitt.

Samuel Becker