Afficher lien d'ancrage sous bandeau via URL

Réponse de l’espace numérique :


Bonjour,

Une page Web
Une page Web est un fichier structuré, rédigé dans le langage HTML, avec d’autres ressources telles que la feuille de Style (fichier CSS) permettant de gérer l’identité graphique de la page.
A l’intérieur de ce document structuré, le développeur qui créé la page, ajoute des ancres permettant à l’utilisateur de se positionner directement sur un point précis de la page.
Le langage HTML est un standard publié par le Consortium W3C, qui édicte les règles et syntaxes de publication sur le web. Le respect de ces règles permet de maximiser les chances d’un affichage optimal sur l’ensemble des navigateurs.

Dans votre exemple
Dans l’exemple que vous donnez, on voit le code de l’ancre avec la balise « <a> ».
Le lien est https://www.ssi.gouv.fr/particulier/glo ... pouet-toot donc doit permettre d’aller directement au mot pouet-toot en utilisant l’ancre codée de la façon suivante« <a name="pouet-toot"> »
Cependant, on n’accède pas directement au mot « Pouet-Toot », qui est caché sous un bandeau apparaissant de manière fixe en haut de page. Il faut donc déplacer légèrement la souris vers le bas de la page pour voir apparaitre la définition du mot recherché.
Pour résoudre ce problème, il nous semble qu’il faille passer par une modification du code. Nous n’avons pas trouvé de paramètre qu’il serait possible de rajouter dans l’URL afin de décaler le point d’ancrage en fonction de la taille du bandeau.

Une solution de développement informatique
Dans point de vue informatique, la solution consiste à placer les ancres de manière relative par rapport au bandeau. Il faut ainsi décaler le point d’ancrage d’une taille donnée (identique à la taille du bandeau), et ce paramètre ne peut pas se définir dans l’URL.
Dans le code, cela fonctionne de la façon suivante :
Donnez un nom à votre ancre.
<a class="anchor" id="top"></a>
Vous pourrez ensuite positionner votre nom d’ancre en fonction de votre bandeau.
a.anchor {
display: block;
position: relative;
top: -250px;
visibility: hidden;
}

Des ressources disponibles à la BmL et sur le Web
De nombreuses ressources relatives aux standards du Web sont disponibles à la Bibliothèque Municipale de Lyon, par exemple HTML5 et CSS3 de Christophe Aubry ou Premiers pas en CSS3 & HTML5 de Francis Draillard.
Les espaces numériques de la BmL mettent à disposition des ressources de formation, notamment celui de la bibliothèque de la Part-Dieu : cours en ligne HTML5 et CSS …mais aussi tout un ensemble d’autres ressources numériques.
Enfin, de nombreuses ressources web sont disponibles, par exemple sur Open Class Room.