Wie kann ich einen Link zu einem anderen Abschnitt innerhalb einer Seite erstellen?

Du möchtest nicht zu einer anderen Webseite sondern zu einer anderen Stelle auf derselben Seite verlinken? Die Gründe dafür sind vielfältig.

In unserem Beispiel wird auf die Vita eines Ensemble-Mitgliedes verwiesen, die weiter unten im Dokument steht. Man kann diese Technik aber auch für Fußnoten oder selbst erstellte Inhaltsverzeichnisse (siehe Beispiel ganz unten) benutzen. Eine weit verbreitete Anwendungsmöglichkeit ist ein "Nach-Oben-Link" am Ende einer langen Seite.

Es liegen immer die gleichen Prinzipien zugrunde.

Das Ziel: Bei Klick auf einen Link scrollt das Dokument an die richtige Stelle

Schritt 1: Anker auf der Seite festlegen

Damit Du auf eine bestimmte Stelle Deiner Seite verlinken kannst, musst Du zunächst einen Anker festlegen. Dazu bearbeitest Du den entsprechenden Textabschnitt.

Bearbeite den Textabschnitt und klicke im Editor auf den Button "Quellcode"

Bearbeite den Textabschnitt und klicke im Editor auf den Button "Quellcode"

Suche das erste öffnende HTML-Tag (in diesem Fall "<p>")

Suche das erste öffnende HTML-Tag (in diesem Fall &quot;&lt;p&gt;&quot;)

Gib dem HTML-Tag eine ID

Gib dem HTML-Tag eine ID

Achte darauf, dass die spitzen Klammen und erhalten bleiben und Du die ID in Anführungszeichen setzt. Die ID darf nur Buchstaben (Kleinschreibung) und Zahlen sowie die Sonderzeichen "-" und "_" enthalten.

Nun erstellst Du den eigentlichen Link.

Bearbeite den Textabschnitt, in dem der Link vorkommen soll und wähle die Wörter, die den Link bilden sollen. Klicke anschließend auf das Link-Symbol.

Trage die in Schritt 1 von Dir erstellte ID mit vorangestellter Raute in das Feld URL ein und bestätige mit OK.

Trage die in Schritt 1 von Dir erstellte ID mit vorangestellter Raute in das Feld URL ein und bestätige mit OK.

Fertig.

Ein Klick auf den Link bewirkt nun, dass das Dokument an den Abschnitt scrollt, in dem die Sängerin genauer vorgestellt wird. Du kannst diesen Anker auch übrigens direkt verlinken. Wenn Du http://www.lindafrank.de/sogni-d-oro#sarah-lewark eingibst oder als z. B. in einer E-Mail als Link weitergibst, wird die Seite direkt an der betreffenden Stelle geöffnet.

Anmerkung: Bitte beachte, dass das Linkziel nur dann ganz oben im Browserfenster angezeigt wird, wenn darunter genügend Inhalte vorhanden sind, um das Browserfenster zu füllen.  

Anwendungsbeispiel: Inhaltsverzeichnis

Der Musikpädagoge Ulf Hagemann hat für eine lange Seite mit Videoabschnitten ein Inhaltsverzeichnis in der Seitenleiste erstellt, durch das man schnell zu dem gewünschten Video gelangt.

Anwendungsbeispiel: Inhaltsverzeichnis