Comment créer des liens. Lien absolu ou relatif ?

C'est quoi un lien?

Un site est normalement composé de plusieurs pages XHTML. Un lien permet donc de relier les pages d'un site web entre elles. Un lien permet également de relier un site à d'autres sites.

Lien absolu ou relatif ? Quelle est la différence?

Un lien absolu est un lien qui contient une url entière, soit : http://creer-un-site.fr/comment-creer-des-liens.php
Un lien relatif est un lien qui contient uniquement une url sans le nom de domaine, soit : comment-creer-des-liens.php
-Si vous faites un lien vers un autre site, vous devez spécifier une URL absolue.
-Si vous faites un lien vers une page de votre site, vous pouvez spécifier une URL absolue ou relative.

Comment créer un lien?

Pour faire un lien, on utilise la balise <a> d'ouverture suivit de l'attribut href qui permet d'indiquer l'adresse d'une page puis on referme grâce à la balise </a>.
Supposons un lien vers cette même page :

<a href="comment-creer-des-liens.php">Comment créer des liens</a>
ou alors
<a href="http://creer-un-site.fr/comment-creer-des-liens.php">Comment créer des liens</a>

Le premier exemple est relatif tandis que le second est absolu. Les 2 donnent exactement le même résultat.
href="" : contient l'url de la page vers laquel on fait un lien.
"Comment créer des liens" : est le titre que je donne à mon lien. On appelle aussi ce titre : Anchor.
On peut également ajouter un attribut nomé title qui permet d'afficher une info bulle au passage de la souris sur un lien :

<a title="Créer des liens" href="comment-creer-des-liens.php">Comment créer des liens</a>

Comment créer un lien sur une image?

C'est très simple. Au lieu de mettre un texte à votre lien, vous le remplacez simplement par le code permettant d'afficher une image.

Pour afficher une image, le code est tout simple :

<img alt="mon image" src="exclamation.gif"/>

Résultat :mon image

Associons maintenant l'image au lien :

<a href="index.php"><img alt="mon image" src="exclamation.gif"/></a>

Résultat :mon image

Lien vers une ancre

C'est quoi une ancre ... le truc pour les bateaux? o0
Une ancre est également un lien mais un lien un peut particulier... Une ancre permet d'accéder rapidement à une partie précise d'une page. Pour créer une ancre, il suffit de rajouter simplement l'attribut id à une balise.

<h2 id="nom_de_mon_ancre">Titre</h2>
<p>Tient un paragraphe ^^.</p>

Pour accéder à mon ancre, il suffit de faire un simple lien vers le nom que j'ai donné à mon ancre précédé d'un #.

<h2 id="nom_de_mon_ancre">Titre</h2>
<p>Tient un paragraphe ^^.<br/>
<a href="#nom_de_mon_ancre">Allez sur mon ancre</a>
</p>

Dans cette exemple et bien que le code soit correcte, il ne se passera rien car le texte entre l'ancre et le lien vers l'ancre est trop court!

On peut également faire un lien vers une ancre situé dans une autre page.

Page A.html :
<h2 id="nom_de_mon_ancre">Titre</h2>
<p>Tient un paragraphe ^^.</p>
Page B.html :
<a href="pageA.html#nom_de_mon_ancre">Allez sur mon ancre</a>
Voir/déposer un commentaire (1) | Signaler un problème