Pfade¶
Damit der Browser Dateien wie Bilder, PDFs, JavaScript- oder CSS-Dateien findet, muss der genaue Pfad zu diesen Dateien angegeben werden. Der Pfad gibt an, wo sich die Datei auf deinem Rechner oder Server befindet. Es gibt zwei Arten von Pfaden:
relative Pfade - das Bild liegt auf dem gleichen Server
absolute Pfade - das Bild liegt auf einem anderen Server
relative Pfade¶
Relative Pfade werden verwendet, wenn sich die Datei auf dem gleichen Server wie der Website befindet. Der Pfad wird relativ zur aktuellen Datei angegeben, in der man den Pfad angibst.
Wichtige Fragen vor der Erstellung eines relativen Pfads
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?
Möglichkeiten für relative Pfade
Root-Verzeichnis (Wurzelverzeichnis): Der Pfad beginnt mit
/und verweist auf das Hauptverzeichnis deiner Website. Beispiel:<img src="/dateien/bild1.jpg" alt="Ein Bild">Ein Ordner höher: Der Pfad beginnt mit
../und bedeutet, dass du einen Ordner nach oben gehst. Beispiel:<img src="../dateien/bild1.jpg" alt="Das gleiche Bild">Muss mehrere Ordner nach oben gegangen, muss../mehrmals angewendet werden.Ein Ordner tiefer: Gib einfach den Namen des Ordners an. Beispiel:
<img src="dateien/bild1.jpg" alt="Und nochmal das Bild">
<img src="/dateien/bild1.jpg" alt="Ein Bild" />
<img src="../dateien/bild1.jpg" alt="Das gleiche Bild" />
<img src="../../dateien/bild1.jpg" alt="Wieder das Bild" />
<img src="dateien/bild1.jpg" alt="Und nochmal das Bild" />
<!-- Vom root Verzeichnis ausgehend -->
<img src="/bilder/ironman2.jpg" alt="Ironman" />
<!-- Von ironman.html ausgehend -->
<img src="../bilder/ironman2.jpg" alt="Ironman" />
<!-- Von ironman2.html ausgehend -->
<img src="../../bilder/ironman2.jpg" alt="Ironman" />
<!-- Von index.html ausgehend -->
<img src="bilder/ironman2.jpg" alt="Ironman" />
Achtung
Egal um welche Datei es sich handelt - Bild, PDF, Excel - es darf nie vergessen werden, die Dateiendung mit anzugeben.
absolute Pfade¶
Absolute Pfade werden verwendet, wenn sich die Datei auf einem anderen Server befindet. Hier muss die komplette URL angegeben werden, einschließlich des Protokolls (http:// oder https://) und des Domainnamens.
Eine Pfadangabe auf einen anderen Server beginnt immer mit http:// oder https:// (Hypertext Transfer Protokoll). Danach kommt der Domainname, zum Beispiel bilder.de. Protokoll und Domain ergeben zusammen: https://bilder.de.
Man befindet uns nun auf dem Server und es muss der Pfad angeben werden, in welchem Ordner sich die Datei befindet.
Beispiel für einen absoluten Pfad
https://bilder.de/assets/img/ironman.jpg
https://www.tiere.de/bilder/loewe.jpg