Comment créer des liens vers des ancres dans une page web ?

Vous avez peut-être un jour eu envie de faire un lien vers un point précis de votre article ? Où d’inviter vos lecteurs à aller sur une page, à un paragraphe donné ? Faire ce genre de liens est très simple.

  • La structure de la balise <a>

Comme vous le savez probablement, pour faire un lien, on utilise la balise <a> avec la syntaxe suivante :

<a href="http://le-chemin-vers-ma-page.html" 
title="texte affiché au survol" rel="dofollow" > Le texte de mon lien </a>

Avec les attributs :

 title="texte affiché au survol" 
rel="dofollow ..." suivi par les moteurs de recherche, etc
  • Lien vers une ancre dans une même page <a>

 

Pour faire un lien vers une partie d’un article, il suffit de remplacer l’adresse de destination par une ancre du type :

 
<a href="#destination" > Le texte de mon lien</a>

et de placer

id="destination"

dans une balise à l’endroit où on veut amener le visiteur.

Par exemple :

 <p id="destination"> Le texte qu'il faut absolument lire </p>

Ce texte est placé en bas de page.
Pour y accéder, cliquez sur le lien

balise a href


  • Lien vers une ancre dans une autre page <a>

Pour aller à un endroit précis d’un autre article, il suffit de rajouter l’id de l’ancre ou l’on souhaite se rendre, à la suite de l’adresse de la page et précédé de #.
Par exemple :
Cliquez sur ce lien, pour aller au résultat final de l’article précédent
La syntaxe du lien est la suivante :

<a href="http://outils-web.fr/comment-enlever-le-fond-dune-image/ 
  #destination2" >Cliquer ici pour aller au résultat final de 
l'article précédent</a>

N’oubliez pas l’espace entre l’adresse et #destination2

Un espace jusqu’à la fin de l’article

Le texte qu’il faut absolument lire

Vous venez d’être dirigé vers cette partie de l’article.
Pour remonter, on peut faire la même chose, avec un autre lien.

<p id="retour"> Retour vers le haut de page </p>
<a href="#retour">Retour vers le haut de page</a>

Un id= »retour » a été placé dans une balise en début d’article.
Retour vers le haut de page

Les recherches qui vous ont mené ici

  • html a href aller à un endroit précis d\une nouvelle page (3)
  • Ancre pour faire de recherche html dans une page (1)
  • ancre wordpress (1)
Ces articles pourraient vous intéresser :

Add a Comment

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Lire plus :
smilebox
Un logiciel de création de montages photos animés avec musique.

Vous avez des photos brutes que vous souhaiteriez partager de façon originale, par exemple en ajoutant de la musique et...

décoder liens
7 sites et 2 extensions pour décoder et vérifier des liens courts.

250 milles comptes Twitter hackés récemment. Il s'agissait de liens courts dans des messages personnels. Les liens courts peuvent être...

css
Les 3 méthodes pour insérer un style CSS dans une page HTML

Les feuilles de style ou CSS (Cascading Style Sheets) sont indispensables pour les documents HTML. Elles apportent les couleurs, la...

Fermer