Mit relativen Pfadangaben verlinken

Ein Web-Projekt besteht typischerweise aus mehreren bis vielen einzelnen Webseiten, die miteinander verlinkt sind. Das nachfolgende Beispiel geht davon aus, dass Sie mit statischen HTML-Dateien arbeiten. Um Verweise auf andere Projektdateien zu definieren, empfiehlt es sich, relative Angaben zum Verweisziel zu machen. Das Projekt bleibt dadurch flexibler, und die Verweise funktionieren auch in anderen Umgebungen (z.B. solange Sie das Projekt lokal auf Ihrem PC erstellen und austesten wollen, oder wenn Sie es mal auf CD-ROM präsentieren möchten).

Beispiel: Datei index.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Relative Verweise zu Dateien oder Quellen im Projekt</title>
</head>
<body>
<h1>Homepage</h1>
<p>Dies ist eine ganz einfache Homepage mit einem
  <a href="zweiteseite.html">Verweis zu einer anderen Seite des Projekts</a>.
  Das <a href="../lehrer2/">Projekt eines Kollegen</a> ist ebenfalls
  aufrufbar.
</p>
</body>
</html>

Beispiel: Datei zweiteseite.html

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Relative Verweise zu Dateien oder Quellen im Projekt</title>
</head>
<body>
  Navigation: <a href="index.html">Startseite</a>
<hr>
<h1>Zweite Seite</h1>
<p>Hurra, geschafft!</p></body>
</html>

Erläuterung

Alle Hyperlinks in HTML werden nach dem Schema <a href="[Verweisziel]">[anklickbarer Verweistext]</a> markiert (a = anchor = Anker, href = hyper reference).

Das Beispiel zeigt zwei kleinere HTML-Dateien. Die erste — mit Namen index.html — enthält mit <a href="zweiteseite.html">Verweis zu einer anderen Seite des Projekts</a> einen Verweis zur zweiten Datei. Der Dateiname der zweiten Datei lautet zweiteseite.html. Beide Dateien sind im gleichen Verzeichnis abgelegt. Deshalb genügt bei href die Angabe des Dateinamens ohne weitere Zusätze.

Die zweite Datei im Beispiel (zweiteseite.html) enthält einen typischen „Rückverweis“ auf die index.html. Ein Rückverweis ist kein spezieller Verweis, sondern einfach wieder ein Verweis auf die gewünschte Datei. Da beide Dateien im gleichen Verzeichnis liegen, genügt auch in diesem Fall wieder die Angabe des Dateinamens, also href="index.html".

Im obigen Beispiel der Datei index.html ist noch ein zweiter Verweis notiert. Darin wird gezeigt, wie Verweise zu Dateien in anderen Verzeichnissen definiert werden. Diese Form der relativen Adressierung ist innerhalb von Web-Projekten sehr zu empfehlen. Der Grund ist, dass Sie das Web-Projekt auf diese Weise problemlos an eine andere Adresse verschieben können, und trotzdem funktionieren noch alle projektinternen Verweise und Grafikreferenzen. Gerade wenn Sie Ihr Projekt auch mal auf CD-ROM oder anderen Medien veröffentlichen wollen, ist die relative Adressierung ein Muss.

Referenzinformationen

HTML2.0XHTML1MSIEFFOXCHROMESAFOP

 


Korrekturen, Hinweise und Ergänzungen
Bitte scheut euch nicht und meldet, was auf dieser Seite sachlich falsch oder irreführend ist, was ergänzt werden sollte, was fehlt usw. Dazu bitte oben aus dem Menü Seite den Eintrag Diskutieren wählen. Es ist keine Anmeldung erforderlich, um Anmerkungen zu posten. Unpassende Postings, Spam usw. werden allerdings kommentarlos entfernt.