Kort vraagje. Stel ik heb deze directorystructuur en ik wil plaatje.png aanroepen...


.../public_html/afbeeldingen/plaatje.png

Als ik een relatief pad gebruik dan kan ik dit doen:

<img src="afbeeldingen/plaatje.png">

maar ook dit:

<img src="/afbeeldingen/plaatje.png">

Het werkt allebei, maar ik vraag me af of er verschil in zit. Wat is de juiste manier?
Geen Windows of Linux, maar HTTP/1.1. URL's zijn gestandaardiseerd in paragraaf 3.2 van RFC 2616. Een relatief pad moet door de webserver inderdaad worden behandeld als een absoluut pad met / voor de root:

“Note that the absolute path cannot be empty; if none is present in the original URI, it MUST be given as "/" (the server root).”
Bedankt voor de reacties, maar nu weet ik nog steeds het antwoord niet. Als we uitsluitend deze 2 opties bekijken, welke optie heeft dan de voorkeur. Optie 1 of 2?

optie 1


.example {
  background: url('/afbeeldingen/plaatje.jpg');
}


optie 2


.example {
  background: url('../afbeeldingen/plaatje.jpg');
}


(Die laatste optie weet ik eigenlijk niet zeker of die klopt. Ik ga er dan vanuit dat je in de css map zit, en dan 1 map omhoog gaat, en dan de afbeeldingen map ingaat.)
Optie 1, want / voor de root verwijst altijd naar hetzelfde bestand. Bij optie 2 werkt het CSS-bestand niet meer foutloos als je het zou verplaatsen naar een subdirectory.

Maar omdat in CSS gebruikte afbeeldingen geen content maar presentatie zijn én omdat de CSS-code bepaalt hoe en wanneer ze worden getoond, zou ik ze dus in de directory met de bijbehorende CSS-bestanden opslaan.
(Die laatste optie weet ik eigenlijk niet zeker of die klopt. Ik ga er dan vanuit dat je in de css map zit, en dan 1 map omhoog gaat, en dan de afbeeldingen map ingaat.)

En daarom is optie 1 dus beter. Niet omdat de een 'een heeeeeel erg klein beetje' sneller is dan de ander, maar omdat de één veel duidelijker is dan de ander.
@Ward: oké! Ik laat de afbeeldingen wel in een aparte map staan. Dat vind ik persoonlijk handiger dan css en afbeeldingen door elkaar. Kwestie van persoonlijke voorkeur.

@Wouter: helder :)

Reageren