web-dev-qa-db-fra.com

Quel est le but et l'origine de la navigation sur la page

Ci-joint un exemple de navigation dans la page, les attentes des utilisateurs sont gérées par un aperçu visuel de la structure de la page sur le côté à droite de la fenêtre. Les utilisateurs peuvent accéder à différentes sections de la page en cliquant sur les points. Chaque point a un état de survol indiquant le titre de sa section.

D'où provient cet élément de navigation dans la page et quel est son objectif? Il semble que cela puisse en fait convenir à un utilisateur d'ordinateur portable à écran tactile, mais avec une précision améliorée du pouce. Mais je ne suis pas vraiment sûr. Quelqu'un pourrait-il m'éclairer?

De Change dot org

enter image description here

7
Uxfamltd

Une petite recherche a montré:

  1. Le site n'est pas réactif, c'est-à-dire qu'il ne fonctionne pas bien à petite résolution d'écran - essayez de réduire la fenêtre du navigateur et vous n'avez pas accès à ces points. Les points ne sont donc pas destinés à la navigation tactile.
  2. Les points eux-mêmes sont une sorte de table des matières. Regarder le code source et extraire une sémantique de l'attribut class de tout le bloc nav. Il s'agit d'un "défilement rapide", il permet donc simplement de passer à la section appropriée.

Compte tenu des résultats, je peux dire que c'est une bonne idée sur la navigation dans un contenu assez volumineux. Mais sa mise en œuvre n'est pas si bonne. L'inconvénient principal est les noms de liens invisibles.

2
Alexey Kolchenko

En regardant le site, il semble servir principalement à être un indicateur visuel de la position de la personne dans la page tout en essayant de servir de menu collant non intrusif spécifique à la page qui l'aide rapidement à naviguer vers les sections importantes de la page.

enter image description here

Cependant, le principal problème avec les menus collants est qu'ils ont tendance à occuper un espace immobilier important et un contenu obscur et cette conception essaie d'éviter cela en gardant les points comme indicateur visuel et en survolant en montrant qu'ils les utilisent pour naviguer vers des sections spécifiques dans la page.

Pour citer ceci article sur les menus collants

DÉTRUISANT ET INTRUSIF

Si ce n'est pas fait avec soin, la navigation collante peut être gênante. Certains éléments collants sont retardés lorsqu'ils rebondissent en position lorsque l'utilisateur fait défiler la page. D'autres sont si hauts ou larges qu'ils dominent la mise en page et entravent l'accès au contenu. La navigation doit être facilement accessible mais ne doit pas rivaliser avec le contenu pour attirer l'attention.

Cela dit, cela pourrait ne pas être vraiment efficace dans Mobile car le site n'est pas réactif (comme l'a souligné Alexey) mais les points obligent également les utilisateurs à les survoler pour trouver ce qu'ils indiquent.

2
Mervin

Ce genre de chose remonte aux "balises d'ancrage" proposées les premières ébauches du standard HTML. L'idée originale était que les documents traditionnels pouvaient être facilement marqués comme "hypertexte" pour la navigation numérique en transformant le contour ou la table des matières en une série de liens vers les sections pertinentes du contenu.

L'intention, alors comme maintenant, est d'empêcher les "fouilles", d'avoir à faire défiler le document (et avec un long la barre de défilement n'est pas très utile) pour accéder au contenu qui vous intéresse réellement. Maintenant, dans les jours des "applications web" générées dynamiquement et mises à jour dynamiquement, nous constatons qu'elle a toujours de la valeur en tant que fonction de "navigation rapide" qui vous emmène où vous allez, réduisant le taux de rebond, etc. Cette implémentation particulière est un peu étrange en ce que vous voient plus souvent ce type de contrôle dans une bannière ou à gauche comme un "contour", mais il a le même objectif de base qu'un TOC.

1
KeithS

La navigation par points (symbolique) est très utile lorsque vous naviguez sur des éléments discrets.

Dans les documents texte, vous pouvez utiliser la barre de défilement verticale pour naviguer ou vous pouvez utiliser une navigation raccourcie (page vers le haut/page vers le bas ou d'autres commandes) pour naviguer directement d'une page à l'autre. Une approche similaire a été utilisée dans les carrousels des pages Web. Au lieu d'une navigation continue d'un article à l'autre, les concepteurs/développeurs ont préféré qu'un seul article soit visible à tout moment (à l'exception des transitions). Il commence par la navigation de la flèche latérale (< et >) ce qui était bien pour la navigation linéaire. Pour des contrôles supplémentaires, les minuscules points ont été ajoutés près du bas du carrousel pour permettre aux utilisateurs de sauter entre les éléments.

enter image description here

D'après l'exemple que vous avez montré, ce modèle similaire a été adopté pour le défilement vertical. De nombreux sites Web à page unique utilisaient un menu fixe pour faciliter la navigation. Exemple. Votre exemple supprime le texte/les étiquettes et utilise simplement les points pour une navigation "minimaliste". Le résultat final est le même que dans le carrousel, vous passez d'un contenu à un autre plutôt qu'un défilement continu.

1
rk.