Quelle est la différence entre les chemins relatifs et absolus ?

Astuce par (Intégrateur du Dimanche, Strasbourg)
Créé le , mis à jour le (102081 lectures)
Tags : web, chemin, relatif, absolu, slash, path

Chemin relatif et absolu

Souvent source d'erreurs, de pages introuvables, d'images manquantes ou de styles non appliqués, le format d'écriture des liens est très important. Et pourtant, on ne prend pas forcément garde à la façon dont on fait pointer ces dernier vers les différents fichiers cible. Suivant la convention d'écriture utilisée, de nombreux problèmes peuvent survenir. En effet, deux types d'écritures cohabitent, chacune avec leur spécificité propre :

  • le chemin relatif (absence de slash initial)
  • le chemin absolu (slash en préfixe du chemin)

Sur le web

Chemin relatif

dossier/page.html

La cible (page.html) va être cherchée par le navigateur à partir de la page html ou de la feuille de style qu'il interprète, dans le sous-répertoire "dossier".

./dossier/page.html

./ : signifie que la page est cherchée à partir du répertoire courant.

../dossier/page.html

../ : signifie que la page est cherchée à partir du répertoire parent (on remonte d'un niveau).

Il est tout à fait possible de remonter plusieurs répertoires. Pour cela il faudra cumuler les ../ et ainsi pour remonter de deux niveaux, il sera possible d'écrire ../../dossier/page.html.

Chemin absolu

/dossier/page.html

Le slash initial précise que l'on ne se réfère plus à l'emplacement courant mais que l'on remonte directement à la racine pour ensuite préciser le chemin complet.

Dans bien des cas, le chemin absolu est la convention d'écriture la plus sûre, mais aussi la moins souple si l'arborescence est amenée à changer. La page cible sera cherchée par le navigateur à partir de la racine du site.

Dans notre exemple, le fichier page.html sera recherché directement à partir de la racine du domaine : http://www.mondomaine.fr/dossier/page.html.

En langage côté serveur (PHP, Ruby, Python...)

Le chemin relatif

dossier/page.php
./dossier/page.php
../dossier/page.php

La cible (page.php) va être cherchée à partir du fichier exécuté. Attention : si vous utilisez cette convention d'écriture pour un fichier inclus au moyen de la fonction include(), soyez conscient que le chemin relatif part non pas du fichier lui-même, mais du fichier dans lequel est placé son contenu : il s'agit du fichier exécuté par le serveur.

Chemin absolu

/dossier/page.php

La cible va être cherchée en partant de la racine du système de fichiers qui est représentée par le slash initial : /.

Par exemple sous Windows : include('/inc/menu.php'); équivaudrait à C:>inc\menu.php et non pas à http://www.domaine.fr/inc/menu.php qui n'est au fond qu'une vue "virtuelle" du répertoire qui héberge le site, et qui peut être placée n'importe où dans l'arborescence du système de stockage. Sous Linux, cela équivaudrait à remonter au premier niveau de l'arborescence du point de montage.

Pour obtenir la racine du serveur web, utilisez la variable PHP $_SERVER['DOCUMENT_ROOT'] en préfixe.

Voir en complément : Inclure un fichier dans un autre grâce à PHP.

Ressources

Commentaires

Groumphy a dit le

@ Raphael > Tu aurais pu rajouter que pour avoir la certitude que cela fonctionne sur les différents navigateurs, il est toujours bon de tester avec ces dits navigateurs (mais bon je l'accorde, tout le monde n'a pas un PC et un Mac sous la main, et parfois même Linux ou Windows installé sur le même PC) ... De plus, demander de tester son site par un public plus large (en version Test/Beta) est toujours bon à faire aussi, afin de reperer ce qui ne vas pas :)

Raphael a dit le

@Groumphy > oui je vais rajouter quelques liens, même si - en théorie - les 3 étapes sont suffisantes pour être compatible sur les navigateurs modernes.

LapinLove404 a dit le

J'ai quand même l'impression qu'il est encore difficile de faire l'étape 2 dans déjà avoir en tête l'étape 3. Certaine erreurs d'affichage des mauvais élèves rendent pratiquement inutilisables des effets CSS ou des type de mises en pages...

Xavier a dit le

Il y a une remarque dans cet aticle qui a l'air d'une petite remarque, mais qui me semble d'importance : "chaque navigateur a ses spécificités (marges différentes sur les éléments)".

Lorsque la mise en page nécessite un positionement plutôt strict, à cause d'éléments graphiques par exemple, ces histoires de marges et padding peuvent devenir douloureuses. Pour remettre les pendules à l'heure, ne peut-on pas conseiller de débuter son CSS par :
* {padding:0;margin:0}

Raphael a dit le

"Pour remettre les pendules à l'heure, ne peut-on pas conseiller de débuter son CSS par :
* {padding:0;margin:0}"

>> Je suis mitigé. Je suis assez peu enclin à utiliser (imposer?) ce sélecteur universel.
Il faudrait voir exactement ce que ça implique (une petite discussion sur le forum, peut-être?)

Xavier a dit le

Ah ? tu penses qu'il pourrait y avoir un problème ?
Pour ce qui me concerne, je ne voyais qu'une ombre au tableau : manque de performance de IE7 sur ce selecteur.
Quoi d'autre ?

Raphael a dit le

Discussion lancée : forum.alsacreations.com/t...

pickupjojo a dit le

Merci beaucoup pour les liens Raphaël, je cherchais justement une des plus anciennes versions d'Internet Explorer pour tester la v4 de mon site, actuellement en construction.

bobito a dit le

Hello, par exemple selon vous, qu'est-ce qui fait que www.chocolat.nestle.fr/ sous IE soit ok, mais ascenseur sous firefox par exemple ?

Raphael a dit le

@bobito > Je ne comprends pas ta question : j'ai le même rendu visuel sur IE6 que Firefox :-/

PS : dans tous les cas, ce n'est certainement pas une question à poser en commentaire de blog. Si tu as besoin d'assistance, il y'a un forum qui sera bien plus adapté qu'un blog : forum.alsacreations.com ;)

bobito a dit le

@RAPHAEL > désolé pour l'emplacement, tu as raison... Cela dit, pourquoi je vois un ascenseur sous Firefox à ton avis ? Suis-je le seul ?
J'ai testé d'autres résolutions, j'ai la toute dernière version, étrange... J'ai pris ce site en exemple au hasard, mais j'ai déjà eu ce problèlme en allant voir d'autres sites. Or je pense qu'il serait interessant de savoir ce qui déclenche ce "bug" (SP2 ?) qu'en penses-tu ?

blastmanu a dit le

bonjour tout le monde
j'en peut plus la mon site marche parfaitement sous firefox mais sur IE c'est la cata je debute et impossible a remedier a ce probleme pouvez vous m'aider svp ???
(mon site est un peu lent mais c'est normale en ce moment je l'heberge chez moi et avec une 512k et emule qui tourne c'est pas top)

blastmanu a dit le

bonjour tout le monde
j'en peut plus la mon site marche parfaitement sous firefox mais sur IE c'est la cata je debute et impossible a remedier a ce probleme pouvez vous m'aider svp ???
(mon site est un peu lent mais c'est normale en ce moment je l'heberge chez moi et avec une 512k et emule qui tourne c'est pas top)

MUmu a dit le

un lien intéressant pour installer plusieurs IE sur une même machine et faire des tests

labs.insert-title.com/lab...

Raphael a dit le

@blastmanu > un blog n'est pas vraiment fait pour servir de SAV. Il y'a un forum pour cela.
Et tu peux commencer par lire les billets importants du blog qui te dépanneront sans doute (les billets important sont en haut à droite dans le menu)

Chris a dit le

Vous vous rendez compte comme les webmasters doivent se prendre la tête ! tout ça parce que certains ne prennent pas la peine de tenir à jour leur navigateur... affligeant, moi, la personne qui a la flemme de faire ses mises à jour tant pis pour elle, je ne vais pas passer des jours à tout vérifier sur tous les navigateurs que ça marche parce que certains veulent pas perdre 5 mn pour leur m.a.j.