Extensible Hypertext Markup Language/Liens hypertextes

Début de la boite de navigation du chapitre

Après le chapitre précédent (qui à dit logique ? Qui ?! ), dans lequel vous avez découvert comment créer une page web (moche, je vous l'acc… pas très belle), maintenant, nous allons apprendre à créer des liens.
Je suppose que vous savez ce qu'est un lien : un texte sur lequel on peut cliquer pour se rendre sur une autre page.
Nous allons voir que c’est (vraiment pas beaucoup) plus complexe que cela : rendez-vous dans quelques lignes !

fin de la boite de navigation du chapitre

Relatif ou absolu ?

Il faut savoir qu’il existe deux types de liens : les liens relatifs et absolus.
¿Quecequo ?
Les liens relatifs sont des liens internes au site ; ils sont courts, par exemple dossier/cible.html.
Les liens absolus sont des liens vers d’autres sites; ils sont plus longs et commencent généralement par http://.
Donc, pour faire un lien vers un site étranger, on mettra l'adresse complète : http://fr.wikiversity.org.
Par contre, et c’est là que ça se complique, si on veut faire un lien interne au site, il est inutile de mettre l'url complet :
Si la cible se trouve dans le même dossier, on mettra juste le nom de la cible.
¿Oui, mais si elle se trouve dans un autre dossier ?
Si la cible se trouve dans sous-dossier (par exemple, si le fichier est /site/index.html et la cible /site/dossier/cible.html), alors on mettra le nom du dossier et du fichier (ici /dossier/cible.html).
Si la cible se trouve dans un dossier parent (par exemple /cible.html), alors il faut remonter d'un dossier avec ../, donc ../cible.html

Les liens

Pour faire un lien, on utilise la balise <a>… jusque là, vous suivez, non ?
On doit également utiliser l'attribut href afin d'indiquer l'adresse du lien.
Un exemple sera sans doute plus parlant :

<a href="http://fr.wikiversity.org">texte sur lequel il faut cliquer pour aller sur le site</a>

Donnera :
texte sur lequel il faut cliquer pour aller sur le site
Si l'adresse inclut des &, il faut les remplacer par &amp.
Pour un lien relatif, on fonctionne de la manière expliquée ci-dessus :

<a href="../../index.php">texte sur lequel il faut cliquer pour aller sur la page</a>

texte sur lequel il faut cliquer pour aller sur la page
On remonte de deux dossiers : d’abord Extensible_Hypertext_Markup_Language, puis wiki (regardez dans la barre d'adresse).

Title

On peut utiliser l'attribut title pour créer une bulle d'aide sur le liens, c'est-à-dire un texte qui apparaitra lorsque vous passerez la souris devant :

<a href="http://fr.wikiversity.org" title="Wikiversité, communauté pédagogique libre à laquelle chacun peut prendre part !">Wikiversité</a>

Je ne peut pas vous le montrer à cause du "Wikicode", mais essayez !

Les mails

Eh oui ! On peut faire un lien qui envoie vers une adresse mail : dans l'attribut href, on écrira mailto: suivi de l'adresse mail. Par exemple :

<a href="mailto:jean.exemple@exemple.com">Exemple</a>

Les ancres

¡ Encore un nom incompréhensible ! C'est quoi ça ?
Une ancre est un lien interne à la page. Une sorte de point de repère, si vous préférez.
Pour implanter une ancre dans une page, il faut rajouter l'attribut id à n’importe quelle balise, généralement un titre. Le nom de l'ancre est précédé d'un dièse. Par exemple :

<h3 id="#mon_ancre">Une ancre</h3>

Il suffira après de faire un lien, relatif ou absolu vers la page et d'y ajouter le nom de l'ancre. Par exemple :

<a href="../fichier.html#mon_ancre">Ancre</a>

Si l'ancre est située dans le même fichier, il est inutile de marquer son nom : le nom de la balise suffit (<a href="#mon_ancre">Ancre</a>).

Faites ces exercices : Liens hypertextes.