Ein Link verweißt auf eine andere Webseite oder eine andere Stelle in der gleichen Webseite.
Um auf eine Webseite zu verweisen braucht man ihre Adresse oder URL.
URL steht für "Uniform Resource Locator" und bedeutet "vereinheitlichter Ressourcen
Verweis".
Am einfachsten ist eine URL auf eine Seite im gleichen Vereichnis, hier reicht der Dateiname.
Liegt die Ziel-Seite in einem Unterverzeichnis so kann man mit einem relativen Pfad
./verzeichnis/name.html auf die Seite verweisen.
Der Punkt ist das aktuelle Verzeichnis und die Schrägstriche trennen die Verzeichnisse und den Dateinamen.
Ist es eine Seite auf einem anderen Webserver (z.B. www.fls-ulm.de), so braucht man die vollständige URL,
sie besteht aus:
dem Protokoll: http
es folgt ://
der Domainname www.fls-ulm.de
der Pfad /language/de/startseite/
die Datei index.php
Die komplette URL ist somit: http://www.fls-ulm.de/language/de/startseite/index.php.
Um einen Link in die Webseite einzubetten, verwendet man das Anker-Tag (<a>). Die Ziel-URL gibt man als
Wert des href-Attributs an.
Der angezeigte Text kommt zwischen das öffnende und schließende a-Tag.
Beispiel:
Eine Schule: <ahref="http://www.fls-ulm.de/language/de/startseite/index.php">Friedrich-List-Schule Ulm</a>
Man kann in HTML5 zu jedem Tag springen, der ein id-Attibut hat. Ids müssen eindeutig sein.
Die Ziel-URL beginnt hier mit einem #, z.B. <ahref="#oben">Seitenanfang</a> verweist auf die id oben, welche auf dieser Seite in der obersten Überschrift ist: Probieren sie es
aus href="#oben".
Wenn man auf eine Id einer anderen Seite verweißt, so fügt man #id an die URL an.
Bsp.: http://www.holzers-familie.de/schule/html/html05.html#oben
Links in neuem Fenster oder Tab öffnen
Manchmal will man, dass ein Link in einem neuen Fenster geöffnet wird (z.B. das Impressum).
Hierfür kann man dem Link das Attribute target mit dem Wert _blank mitgeben.
Beispiel:
<ahref="http://fls-ulm.de"target="_blank">FLS</a>
Ergebnis:
Dieser Link öffnet einen neuen Tab bzw. neues Fenster: FLS
Links als Download festlegen
Wenn ein Link auf ein Bild oder Dokument zeigt, öffnet es der Browser im Browser-Fenster, wenn er das Link-Ziel
darstellen kann.
Will man jedoch, dass das Ziel als Download angeboten wird, dann kann man das Attribute download in den
Link einfügen.
Beispiel:
<ahref="html05.html"download">Webseite über Links</a>
Erstellen Sie in einem Verzeichnis zwei HTML-Dateien. Benennen Sie die erste a.html und die
zweite b.html.
Kopieren Sie in jede das HTML-Grundgerüst.
Fügen Sie in beide Dateien eine Überschrift ein, welche sagt "Ich bin a.html" bzw. "Ich
bin b.html".
Jetzt fügen Sie in a.html einen Link auf b.html ein und in b.html einen auf a.html.
Probieren Sie es aus, Sie sollten im Browser von a auf b und von b auf a und von a wieder auf b und
...
im BODY von a.html: <h1>Ich bin
a.html</h1> <ahref="b.html">zu b</a>
im BODY von b.html: <h1>Ich bin
b.html</h1> <ahref="a.html">zu a</a>
Öffnen Sie die Datei a.html im Browser.
Verschieben Sie b.html in ein neues Unterverzeichnis sub.
Klicken Sie im Browser auf den Link zu b - was passiert?
Passen Sie den Link in a.html an.
Um den Link in b.html zu korrigieren, müssen sie ihm sagen, dass a.html ein Verzeichnis höher liegt.
Dies erreicht man mit ../ vor a.html.
in a.html: <h1>Ich bin
a.html</h1> <ahref="sub/b.html">zu b</a>
in b.html: <h1>Ich bin
b.html</h1> <ahref="../a.html">zu a</a>
Erstellen Sie eine Seite mit einer Liste von Suchmaschinien.
Folgende könnten Sie verwenden: