Absolute vs. relative Pfade
Verknüpfen von Resourcen im Web.
Wenn eine Datei verlinkt werden soll, bspw. ein Bild, CSS-Dokument, JavaScript-Dokument oder eine weitere HTML-Seite, muss der korrekte Pfad angegeben werden. Dabei gibt es zwei Möglichkeiten, absolute und relative Pfade.
Absolute Pfade geben den absoluten, spezifischen Pfad an, während relative Pfade in Relation zu ihrem Ausgangspunkt stehen.
Absolute Pfade
Ein absoluter Pfad ist vergleichbar mit der Aussage:
Ich bin in meinem Auto in Berlin
Der Pfad ist hier Berlin > Auto > Ich. Übertragen auf das web wäre Berlin eine Domain, bspw. https://octodex.github.com.
Auto ist der Ordner images und Ich ist die Datei daftpunktocat-thomas.gif. Der gesamte Absolute Pfad ist somit https://octodex.github.com/images/daftpunktocat-thomas.gif.
Wenn ich von meiner index.html auf diesen Pfad verweise wird die Datei angezeigt, solange sie in dem Ordner Images unter der Domain https://octodex.github.com liegt. Wo sich meine index.html Datei befindet ist egal.
Relative Pfade
Ein relativer Pfad ist in unserem Beispiel die Aussage:
Ich bin in meinem Auto.
Hier ist der Pfad Auto > Ich. Dieses Aussage ist korrekt, solange ich in meinem Auto bin. Ob mein Auto in Berlin oder Hamburg steht ist in diesem Fall egal, solange sich der Suchende im selben Ort befindet.
Übertragen aufs unser Beispiel wäre dieser Pfad /images/daftpunktocat-thomas.gif.
Wenn ich von meiner index.html auf diesen Pfad verweise, wird die Datei angezeigt, solange sie in dem Ordner images auf der selben Domain wie meine Datei index.html liegt und der Ordner images im selben Ordner wie meine index.html liegt.
Ob sich meine Dateien auf octodex.github.com oder einer anderen Domain befinden ist egal, solange sie bei auf derselben Domain liegen, also relativ zueinander sind.
Syntax für relative Pfade
Absolute Pfade sind einfach, im Grunde nur eine Domain, bei relativen Pfaden gibt es allerdings Besonderheiten.
Startpunkt
Relative Pfade sind immer relativ zu der Datei (bspw. index.html), von der aus auf eine andere Datei verwiesen wird. Wenn meine Datei (bspw. index.html) also im Ordner website liegt, so verweist bear.png auf die Datei bear.png im Ordner website.
In Unterordner verweisen
Um von dem momentane Ordner website in den Unterordner media zu verweisen, wird folgender Pfad genutzt media/eisbaer.jpeg
In übergeordnete Ordner verweisen
Um von dem aktuellen Ordner in einen höheren Ordner zu gelangen wird ../ genutzt, mit wiederholtem ../ kann man auch mehrere Ebenen (Ordner) nach oben gehen. So verweist base.css im Ordner /libs/css/ auf ein Bild, bear.png welches im gleichen Ordner wie der Ordner libs/ liegt mit ../../bear.png dabei geht der erste ../ aus dem order css/ (in welchem die base.css liegt, also unserem Startpunkt) in den order libs/ und der zweiter ../ geht einen weiteren Ordner nach oben in den Ordner week01/.
In den Root-Ordner verweisen
Root (engl. Wurzel) bezeichnet den obersten Ordner einer Ordnerstruktur. Um auf diesen Ordner zu verweisen wird die Notation / genutzt. Um also auf den Ordner media im Root-Verzeichnis zu verweisen kann die Notation /media/ genutzt werden.
Diese Notation ist mit Vorsicht zu genießen, da das jeweilige System bestimmt, welcher Ordner das Root-Verzeichnis ist. So kann es sein, dass ein Webserver den Ordner www als Root definiert obwohl es noch einen weiteren Überordner gibt. Auf Mac OSX ist root gleich der Ordner in welchem die jeweilige Datei liegt.
Zusammenfassung
Absolute Pfade beginnen mit der Domain und funktionieren nur solange nichts an dem Ort, an welchem die Datei liegt, geändert wird.
Relative Pfade beschreiben einen Pfad ausgehend von dem Ordner, in welchem die Datei (bspw. index.html) liegt, von der aus auf eine andere Datei verwiesen wird. Sofern ein komplettes Ordnerkonstrukt verschoben wird (bspw. wenn eine Webseite via FTP auf einen Server geladen wird) funktionieren diese Pfade weiterhin.
Ein Pfad, welcher mit einem Ordner oder einem Dateinamen beginnt, geht von dem aktuellen Ordner aus und folgt von hier dem angegebenen Pfad bspw. unterordner/bear.png
Ein Pfad, der mit einem ./ beginnt, startet aus dem Root-Verzeichnis, also zumeist der höchsten Hierarchie, bspw. ./unterverzeichnis
Ein Pfad, der mit einem oder mehreren ../ beginnt startet einen bzw. mehrere Ordner über dem aktuellen Ordner bspw. ../../verzeichnis
