Pfade

Damit der Browser Dateien (zum Beispiel Bilder, PDFs, JavaScript- oder CSS-Dateien) finden kann, muss ihm der genaue Pfad angegeben werden. Der Pfad gibt den Ort des Bildes auf dem eigenen Rechner oder Server. Für die Angabe eines Pfades gibt es zwei Möglichkeiten.

  1. relative Pfade - das Bild liegt auf dem gleichen Server

  2. absolute Pfade - das Bild liegt auf einem anderen Server

relative Pfade

Bei relativen Pfaden liegt das Bild auf dem gleichen Server und der Pfad wird relativ von der jeweiligen Datei, in der gecoded wird, angegeben. Folgende Fragen müssen vorher geklärt werden um einen relativen Pfad zu erstellen.

  • Befindet sich die Datei in der gleichen Ebene wie die Datei, von der auf sie referenziert wird?

  • Befindet sich die Datei in einem Ordner eine Ebene höher?

  • Befindet sich die Datei in einem Ordner eine Ebene tiefer?

Um einen relativen Pfad zu erstellen, ist es wichtig zu wissen, von wo aus der Pfad referenzieren soll. Dazu gibt es vier Möglichkeiten:

  1. Der Pfad startet mit / und verweist damit auf das root-Verzeichnis (Wurzelverzeichnis) und startet von dort.

  2. Der Pfad startet mit ../ und bedeutet, gehe ein Verzeichnis höher und starte von dort.

  3. Der Pfad startet mit ../../ und bedeutet, gehe zwei Verzeichnisse höher und starte von dort (und so weiter…).

  4. Um bei einem Verzeichnis eine Ebene tiefer zu starten, muss der Ordnername angegeben werden.

1<img src="/dateien/bild1.jpg" alt="Ein Bild">
2
3<img src="../dateien/bild1.jpg" alt="Das gleiche Bild">
4
5<img src="../../dateien/bild1.jpg" alt="Wieder das Bild">
6
7<img src="dateien/bild1.jpg" alt="Und nochmal das Bild">
Pfad-Aufgabe

Warnung

Egal um welche Datei es sich handelt - Bild, PDF, Excel - es darf nie vergessen werden, die Dateiendung mit anzugeben.

absolute Pfade

Bei absoluten Pfaden liegt das Bild nicht auf dem gleichen Server, auf dem unsere Website liegt. Daher muss die gesamte Pfadadresse angegeben werden.

Eine Pfadangabe auf einen anderen Server beginnt immer mit http:// oder https:// (Hypertexttransportprotokoll). Danach kommt der Domainname, zum Beispiel bilder.de. Protokoll und Domain ergeben zusammen: https://bilder.de.

Wir befinden uns nun auf dem Server und müssen angeben, in welchem Ordner sich das Bild befindet. Als Beispiel nehmen wir an, das die Bilder auf der Website bilder.de sich in dem Ordner /assets/img befinden. Der absolute Pfad für das Bild ironman.jpg wäre:

1https://bilder.de/assets/img/ironman.jpg
Pfadangabe zu Dateien als grafische Darstellung