Mit HTML zu anderen Unterseiten verlinken

Eine Stärke von HTML und der Grund für die Bekannheit des Internets ist die Möglichkeit der HTML Verlinkung. Mit Hilfe eines HTML Befehls kannst du zwischen mehreren Unterseiten deiner Website wechseln oder einen Scroll erzwingen.

Die HTML Verlinkung

Es gibt zwei Arten von HTML Verlinkungen: Die eine bringt dich auf eine andere Unterseite. Diese ist dann sinnvoll, wenn du ein Menü, eine Sidebar oder eine Breadcrumb Navigation für deine Website bauen willst.

Mithilfe der anderen Methode der HTML Verlinkungen kannst du einen Sprung von Punkt A auf der selben Seite zu Punkt B, ebenfalls auf der selben Seite erzwingen. Es kommt dabei zu keinem Neuladen der Website. Oft genutzt wird diese Methode für OnePage-Webdesigns oder Unterseiten, die ein Inhaltsverzeichnis verbaut haben.

Um dir die Unterschiede zwischen den Arten näher bringen zu können dienen die nachfolgenden Beispiele.

HTML Verlinkung zu anderen Web- und Unterseiten

Wie bereits erwähnt kannst du von deiner Website auf eine andere Website verlinken – erst dadurch wurde das Internet so bekannt, wie es heutzutage ist. Um in HTML eine Verlinkung zur anderen Seite einzurichten dient dir folgender HTML Befehl:

Die HTML Verlinkung fängt mit dem HTML Befehl <a></a> an, gefolgt von dem Attribut „href“. Innerhlab dieses href Attributs wird die Website angegeben, auf die du verlinken möchtest. Zwischen dem öffnenden und schließendem HTML Befehl wird der Text der Verlinkung angegeben.

HTML Verlinkung als Sprungmarke nutzen

Eine weitere Methode der HTML Verlinkungen ist die Verlinkung als Sprungmarke. Ein anderer, geläufiger Begriff hierfür ist die HTML Anker Verlinkung. Mit Hilfe dieser wird mit einem (fast) normalen HTML Befehl ein Hyperlink gesetzt, der bei einem Klick auf die definierte Sprungmarke scrollt bzw. springt. Einen HTML Anker setzt du, indem du folgende Befehle einsetzt:

Wie du sehen kannst unterscheidet sich dieser HTML Befehl kaum von einer normalen Verlinkung. Der einzige Unterschied ist die Raute innerhalb des href Attributs (#). Mit dem #-Symbol wird HTML mitgeteilt, dass es sich hierbei um einen HTML Anker handelt, auf den verlinkt wird. Um nun den Sprung zu ermöglichen wird ein weiterer HTML Befehl benötigt: <a name="meine-erste-sprungmarke"></a>

Statt dem href Attribut wird hier auf das name Attribut zurückgegriffen. In diesem Attribut wird auch auf das #-Symbol verzichtet. Wenn du beide HTML Befehle in deinen Quellcode eingebaut hast und die Seite eine entsprechende Länge aufweisen kann, springt dein Scrollbalken bei einem Klick auf die HTML Verlinkung zur Sprungmarke.