Les liens hypertextes sont l’un des fondements du HTML, et il ne faut pas oublier qu’il s’agit d’un langage de balisage hypertexte. Ils peuvent être liens externes ou liens internes. Mais comment créer des liens qui pointent les utilisateurs ou visiteurs d’un site vers d’autres pages du même site ?
Définition du lien HTML
Des liens HTML seront utilisés pour construire des ponts entre différentes pages d’un même site ou entre différents sites. Le principe du lien est le suivant : en cliquant sur l’ancre (la partie visible du lien, qui peut être du texte comme des images), nos utilisateurs seront redirigés vers la page cible. Les liens HTML sont également utiles pour naviguer dans la même page et faire référence à des emplacements spécifiques sur la page. Dans le cas de pages longues, cela est utile pour fournir un accès rapide ou des références à nos utilisateurs.
Les différents liens
Il existe deux principaux types de liens hypertextes en HTML :
- Liens internes permettant de naviguer d’une page à une autre sur un même site ;
- Un lien externe qui renvoie l’utilisateur vers une page d’un autre site.
Ces deux types de liens feront l’objet d’enjeux et d’impacts différents dans l’optimisation des moteurs de recherche (SEO), et peuvent être créés de différentes manières en HTML.
Il existe également un lien qui ramène à un autre endroit d’une même page qu’on appelle lien d’encre.
Création d’un lien interne
Les liens internes vous permettent de vous déplacer dans le même site ou vers un point spécifique dans une autre page d'un autre site (à condition qu’il s’agisse d’une ancre interne). Voici la balise de ce lien : <a href="#name"> le texte visible du lien interne</a>. Il a la même syntaxe que les liens externes, la différence est qu'il va falloir donner un nom (« Nom »). Il sera choisi arbitrairement, et le symbole « # » lui précédera.
Voici un exemple : <a href=" # end"> Fin du texte</a>. Afin de faire pointer le lien de face interne vers un point précis du document, vous devez définir un emplacement et lui donner le même nom que l’adresse : <a name=" name"> texte que nous pointons </a>. Pour reprendre l’exemple précédent, on mettra une position à la fin du texte : <a name=" end"> le texte sur lequel on pointe </a>
Il est important que le nom soit le même dans l’étiquette du lien [href] et dans l’étiquette indiquant l’emplacement en nommant [nom]. On appelle cette dernière partie l’ancre interne, et c’est dans cette ancre que va pointer le lien interne.