Wat is een padnaam?

Een padnaam geeft aan waar een bestand of map staat op je computer of in de cloud. Het laat de route zien vanaf een bepaald startpunt naar het bestand. Er zijn twee soorten paden: absolute paden en relatieve paden.

Absolute padnaam:

Een absolute padnaam beschrijft de volledige route naar een bestand.

• Windows: C:\Users\Naam\Documents\project\index.html
• macOS / ChromeOS: /Users/Naam/Documents/project/index.html
• OneDrive (online): https://onedrive.live.com/…/Documents/project/index.html

Relatieve padnaam:

Een relatieve padnaam beschrijft de route ten opzichte van de map waarin je nu werkt.

• Voorbeeld: als je bestand index.html in de map project staat en je wilt een afbeelding uit images/logo.png tonen, dan schrijf je in HTML: <img src="images/logo.png">
• Relatief pad is korter en verandert mee als je het hele project verplaatst.

Wanneer gebruik je wat?

• Absolute paden: handig om een exact bestand op een vaste plek te vinden. Nadeel: werkt niet goed als je het project naar een andere computer of map verplaatst.
• Relatieve paden: handig bij websites en projecten. Het blijft werken zolang de structuur van je project hetzelfde blijft.

Voorbeeld mappenstructuur:

project/
├── index.html
├── css/
│   └── style.css
└── images/
    └── logo.png

Absolute pad:

Windows: C:\Users\Naam\Documents\project\images\logo.png

macOS: /Users/Naam/Documents/project/images/logo.png

Relatief pad (vanuit index.html):

<img src="images/logo.png">

Relatief pad (vanuit style.css):

background-image: url("../images/logo.png");