Les Liens
Faire un lien en XHTML
Le lien constitue une liaison entre une page et une autre. Un visiteur de la page peut se rendre sur une autre page ou un autre emplacement de la même page à l'aide d'un lien. Ceci est possible dès que le visiteur clique sur l'objet de lien qui est généralement un texte ou une image.
Différents contextes tournent autour de ce sujet. Nous allons d'abord voir la balise indispensable pour faire des liens. Il s'agit de la balise <a> </a> qui est de type inline. Dans son attribut href, on spécifie la cible, c'est-à-dire l'adresse de la page ou de la ressource vers laquelle sera dirigé le visiteur après son clic sur le lien.
On identifie la cible par une URL. L'URL ou "Localiseur de Ressource Uniforme" est une sorte de nomenclature pour situer un document et lui donner une adresse. C'est le chemin du document vers lequel le lien sera renvoyé.
Voici un exemple d'utilisation de la balise <a> pour faire un lien :
Aperçu :
StandaCreation : Création de sites Internet est une société de création de sites Internet qui respecte les standards.
Code XHTML :
<a href="http://www.example.com" title="Société de création de site web">StandaCreation : Création de sites Internet</a> est une société de création de sites web.
Généralement, on distingue 2 façons de faire des liens :
- Les liens internes au site : Normalement, un site est composé de plusieurs pages XHTML. Pour lier une page d'un site à un autre page du même site, on fait des liens relatifs.
- Les liens externes au site : Il vous arrive aussi parfois de vouloir faire des liens vers les autres sites. Dans ce cas, on parle de liens absolus.
Dans la suite nous allons voir plus en détail la différence entre les deux tout en illustrant par des exemples.
Les liens absolus
Vous utiliserez ce type de lien lorsque votre lien pointe vers un autre site. L'adresse du lien commence souvent par "http://" ou "ftp://", suivi de l'adresse du site cible. Autrement dit, dans un lien absolu, on précise entièrement le chemin.
<a href="http://www.domaine.com/xhtml.php">tuto xhtml</a>
Dès que le visiteur clique sur le texte, il sera renvoyé vers la page http://www.domaine.com/xhtml.php.
Les liens relatifs
Dans un lien relatif, le chemin part du répertoire courant. Il s'agit d'un lien relatif au répertoire dans lequel on se trouve. Il est souvent utile d'employer ce lien quand on fait référence à une page interne à votre site. Si vous décidez de changer par exemple l'hébergement, l'adresse de votre site ne sera peut être plus la même.
Dans ce cas, l'utilisation des liens relatifs ne vous oblige pas à modifier l'adresse des liens. Par contre, ceci n'a d'intérêt que si vous gardez les mêmes noms de fichiers et la même structure de répertoire
Cas 1 : les deux fichiers se trouvent dans le même répertoire :
wwwdossier1fichier1.html wwwdossier1fichier2.html
Dans ce cas, si fichier 2 est la cible, on met comme adresse de lien dans fichier1
fichier2.html
Cas 2 : Les deux fichiers se trouvent dans des répertoires différents :
wwwdossier1fichier1.html wwwdossier1dossier2 fichier2.html
Pour aller de fichier1 à fichier2 on met :
dossier2/fichier2.html
Cas 3 : La cible se trouve dans le rep parent :
wwwfichier2.html wwwdossier1fichier1.html
Pour aller de fichier 1 à fichier 2 on met :
../fichier2.html
Lien interne sur une même page
Il s'avère parfois fastidieux de lire une longue page XHTML sans les ancres. Une ancre est un point pour repérer une partie particulière de la page. Par exemple, si vous êtes au milieu de la page et que vous souhaitez revenir en haut de la page, c'est l'ancre qui vous servira de référence. L'ajout de l'attribut id à une balise nous permet de créer une ancre qui servira de repère. Ceci est valable pour n'importe quelle balise.
L'attribut id permet de donner un nom, un identifiant unique à un lien
Par exemple :
<h2 id="section1">section1 :Lien vers une ancre</h2>
Comme d'habitude, on utilise la balise a avec son attribut href , mais en mettant cette fois-ci le signe dièse (#) suivi du nom de l'ancre comme valeur de l'attribut. Ce signe dièse sert à marquer qu'il s'agit d'une ancre.
<a href="#mon_ancre">Aller vers l'ancre</a>
Quand on clique sur le lien, les barres de défilement se défileront automatiquement pour atteindre atteindre la section1
Lien vers une ancre qui se trouve dans une autre page
Là, on cherche à faire un lien qui permet d'ouvrir à la fois une nouvelle page et qui nous amène directement à une ancre sur cette page. Pour cela, il faut mettre après le nom de la page, le dièse et le nom de l'ancre. Par exemple :
<a href="page.html#section1">
Ce qui vous amènera sur la page page.html, au niveau de la section "section1".
