Guichet Du Savoir
http://www.guichetdusavoir.org/

Afficher lien d'ancrage sous bandeau via URL
http://www.guichetdusavoir.org/viewtopic.php?f=2&t=82885
Page 1 sur 1

Mast0d0nte [ 10/03/2020 à 14:09 ]

Bonjour,

Certains sites (prenons l'exemple de celui de l'ANSSI) intègrent des ancres pour une meilleure navigation (prenons l'exemple du glossaireglossaire). Malheureusement, il arrive que le développeur ajoute un bandeau en haut du site et oublie d'ajouter une marge de la même taille au-dessus des ancres (qui permettraient de ne pas masquer le contenu pointé)…

Ma question est la suivante : est-il possible pour un internaute de partager un lien d'ancrage (comme celui précédemment indiqué) en ajoutant un paramètre dans l'URL afin de forcer cette marge lors d'un clic sur le fameux lien ?

Merci pour votre excellent service !

Réponse attendue le 13/03/2020 - 14:03


bml_ecm [ 13/03/2020 à 09:56 ]

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.

Réponse attendue le 17/03/2020 - 09:03