Skip to main content

Der Unterschied zwischen href="home.html" und href="/home.html" liegt in der Art und Weise, wie der Browser den Pfad zur Datei interpretiert. Es handelt sich um den Unterschied zwischen einem relativen Pfad und einem pfadrelativen Pfad (oder wurzelrelativen Pfad).

 

href=“home.html“ (Relativer Pfad)

 

Dieser Pfad ist relativ zum aktuellen Standort. Der Browser sucht nach der Datei home.html im selben Ordner, in dem sich auch die HTML-Datei befindet, die diesen Link enthält.

  • Beispiel: Du befindest dich auf der Seite https://www.beispiel.de/produkte/details.html. Ein Link mit href="home.html" würde den Browser anweisen, nach der Datei unter https://www.beispiel.de/produkte/home.html zu suchen.

Dieser Pfad ist identisch mit href="./home.html". Der ./ verdeutlicht nur, dass im aktuellen Verzeichnis gesucht werden soll, wird aber oft weggelassen.


 

href=“/home.html“ (Pfadrelativer/Wurzelrelativer Pfad)

 

Der Schrägstrich / am Anfang des Pfades hat eine entscheidende Bedeutung: Er sagt dem Browser, er soll die Suche im Stammverzeichnis (Root) der Webseite beginnen. Das Stammverzeichnis ist die oberste Ebene deiner Domain.

  • Beispiel: Egal, ob du dich auf https://www.beispiel.de/produkte/details.html oder auf https://www.beispiel.de/ueber-uns/kontakt.html befindest, ein Link mit href="/home.html" wird den Browser immer anweisen, zur Datei unter https://www.beispiel.de/home.html zu navigieren.

 

Zusammenfassung

 

Pfadangabe Bedeutung Beispiel (aktuelle Seite: domain.de/unterordner/seite.html)
href="home.html" Sucht im gleichen Ordner Führt zu: domain.de/unterordner/home.html
href="/home.html" Sucht im Stammverzeichnis (Root) der Domain Führt zu: domain.de/home.html
href="./home.html" Identisch mit home.html (gleicher Ordner) Führt zu: domain.de/unterordner/home.html
href="../home.html" Geht einen Ordner nach oben Führt zu: domain.de/home.html

Fazit: Der / am Anfang ändert den Startpunkt der Suche vom aktuellen Verzeichnis zum Hauptverzeichnis (Root) deiner Webseite. Das ist besonders nützlich für Links, die von jeder Unterseite aus gleich funktionieren sollen, wie z.B. Links zur Startseite, zum Impressum oder zum Kontaktformular in einer Navigationsleiste.

Leave a Reply