Materialien zum Unterricht

Verknüpfungen

Verknüpfungen (Links) sind das Salz in der Suppe des Internet. Der Wert einer Seite in der Suchmaschine Google richtet sich u.a. danach, wie viele andere Seite einen Link auf die Seite gesetzt haben.

Link sind möglich

Links werden schlicht und ergreifend mit dem Tag <a> </a> eingefügt. Das a steht für ancor (Anker). Der Text, der zwischen <a> und </a> steht, erscheint auf dem Bildschirm als Link.

Innerhalb von <a> wird mit href (Hypertext Reference) auf die Stelle verwiesen, wo der Link hingehen soll.

1. Link auf eine Stelle der gleichen Seite

Bei großen Seiten ist günstig, am Anfang ein Inhaltsverzeichnis zu erstellen, mit dem man auf der Seite navigieren kann.
Beispiel

Die Stelle, die durch einen Link angesprungen werden soll, muss mit einem benannten Ankerpunkt gekennzeichnet werden:

  <a name="anfang"></a>

Der Link zu dieser Stelle hat dann folgendes Aussehen

 <a href="#anfang">zur&uuml;ck zum Anfang</a>

Die Referenz beginnt mit einem # gefolgt vom Namen des Ankerpunktes.

2. Link auf eine andere Seite des gleichen Internetauftritts 

<a href="html4.htm">Klassen</a>

Die Referenz ist einfach der Name der Seite. Der Beispiellink führt auf die Seite Klassen dieses Kurses.

Häufig werden in einem Internetauftritt die Seiten in verschiedenen Ordnern abgelegt. Der Link von der Startseite dieser Website zum HTML-Kurs sieht so aus

<a href="html/index.htm">HTML-Kurs</a>

Es steht zuerst der Ordner, dann ein / und zum Schluss die HTML-Seite.

Will man auf eine Seite, die in einem übergeordneten Ordner steht, schreibt man

<a href="../index.html">Startseite</a>

Die beiden Punkte bezeichnen den übergeordneten Ordner. 

<a href="../../index.html">Startseite</a>

bedeutet, dass um zwei Ordner zurückgesprungen wird.

3. Link auf einen anderen Internetauftritt

Bei einem Link auf eine andere Seite steht in der Referenz vor der Adresse http://

Link zu google

<a href="http://google.de">Link zu google</a>

http steht für Hypertext Transfer Protocol

Möchte man, dass der Link ein neues Fenster im Browser (oder Tabulator) öffnet, schreibt man

<a href="http://google.de" target="_blank">Link zu google</a>

Link zu google im neuen Fenster

Zusatz: Es lässt sich auf einer anderen Seite auch ein benannter Ankerpunkt anspringen.

Eilenburger Chemiewerk

<a href="eilenburg.htm#ecw" target="_blank">Eilenburger Chemiewerk</a>

Aufgaben: Es werden weitere Seiten erstellt und verknüpft.

  1. Zu jedem Inernetauftritt gehört ein Impressum. Das Impressum enthält Name und Anschrift des Betreibers. Weitere Informationen sind möglich.
    Erweitere die Startseite um eine Fußzeile (footer).

    Dort hinein kommt der Link auf die Seite impressum.htm.
    Die Seite imressum.htm wird als Kopie der Startseite erstellt. Die Bereich bleiben erhalten, nur der Bereich inhalt wird geändert.
    Damit sieht die Seite impressum.htm genau so aus wie die Startseite, außer dass der Inhalt jetzt ein anderer ist.
  2. Erstelle wieder als Kopie der Startseite eine neue Seite. Auf ihr sollen historische Gebäude von Eilenburg vorgestellt werden. Die Seite heißt historisch.htm. Von der Startseite aus führt ein Link auf diese Seite.
  3. Von der Startseite aus soll ein weiterer Link auf die Hompepage von Eilenburg führen (www.eilenburg.de). Diese Seite wird in einem neuen Fenster geöffnet.
zurück