Les pages « profondes » nécessitent des ancres nommées « TOP » (retour en haut de la page) à intervalles réguliers, pour éviter à l’internaute de passer son temps à remonter en haut de la page péniblement.

Il existe une solution simple en pur CSS (accessible aux écrans ayant désactivé les Javascripts), permettant à l’internaute d’avoir , en bas de la page affichée, un petit bouton CSS toujours visible bien pratique pour remonter en haut de la page sans scroller…

La première chose à faire est de déposer sur le serveur un petit fichier image avec la flèche « top » que vous souhaitez voir apparaitre en permanence en bas de l’écran. Par exemple >>

L’étape suivante consiste à créer le code CSS attaché au calque sur lequel nous allons ensuite déposer cette image.
Le but est de coller ce calque en bas à droite de l’écran de l’internaute :

#scroll_to_top {
  position: fixed;
  width: 25px;
  height: 25px;
  bottom: 50px;
  right: 30px;
}
#scroll_to_top img {
  width: 25px;
}
									

Il ne reste plus qu’à afficher notre image « TOP » dans ce calque positionné pour avoir ce bouton CSS toujours visible toujours en bas à droite des écrans :

<div id="scroll_to_top">
    <a href="#top"><img src="image/scrolltop.png" alt="Retourner en haut" /></a>
</div>
									

(lien annexe : Comment avoir un footer collé en bas de page ?)

Et voilà