Extensible Hypertext Markup Language/Liens hypertextes
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 !
Relatif ou absolu ?
[modifier | modifier le wikicode]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
[modifier | modifier le wikicode]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 &
.
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
[modifier | modifier le wikicode]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
[modifier | modifier le wikicode]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
[modifier | modifier le wikicode]¡ 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. |