Le fonctionnement classique des liens hypertexte est de pointer vers une page différente de celle en cours de consultation, pour naviguer dans le site. Il est également possible de créer un lien vers un endroit précis de la page courante, ou d’une autre page afin de positionner correctement le navigateur.
Créer une ancre est facile : il suffit d’attribuer à l’élément vers lequel on veut pouvoir pointer un identifiant (avec l’attribut HTML id) et d’y associer un lien débutant par le caractère dièse #, suivi du nom de cet identifiant.
Exemple :
<div id="dernieres-nouvelles">...</div>Il suffira alors de faire un lien vers cet ancre :
<a href="#dernieres-nouvelles">Les dernières nouvelles</a>Liens d’évitement
Pour bien comprendre l’utilisation des ancres internes, il peut être utile de travailler la question des liens d’évitement et liens d’accès rapide, qui peuvent améliorer l’accessibilité d’une page. La lecture de l’article suivant est fortement recommandée : Les liens d’évitement.
Lien de retour en haut de page
Un lien de retour en haut de page ne diffère pas des liens internes classiques. Il faut créer une ancre, puis pointer vers cette ancre à chaque fois que l’on veut faire un lien de retour. Pour créer l’ancre, on peut placer au début de l’élément body ou du premier div structurant le code suivant:
<a id="haut"></a>
<!-- On peut bien sûr choisir n'importe quel autre nom que "haut" -->On pourra ensuite faire un lien vers cette ancre en précisant dans l’attribut href le nom de l’ancre précédé de # :
<a href="#haut">haut de page</a>Avec la plupart des navigateurs, aucune ancre n’est nécessaire pour retourner en haut de page : le dièse # seul suffit à revenir au début du contenu.
<a href="#">haut de page</a>Attention cependant, jusqu’à Opera 9 inclus ce fonctionnement n’est pas compris nativement, il faudra lui préférer la méthode de création d’une ancre en bonne et due forme, puis faire pointer les liens de retour en haut de page vers cette ancre.