Blog

Retour aux articles

Une expérience de navigation optimale ? Voici les clés !

Partager

Catégories

2560

Une expérience de navigation optimale ? Voici les clés !

La navigation est l’un des éléments les plus critiques et importants de la conception d’une interface. L’utilisateur compte sur la navigation pour trouver du contenu et des fonctionnalités précises. D’où l’intérêt d’en faire une priorité absolue pour chaque site web ou application 😉

Et après tout, quel que soit le temps que vous investissez dans la conception d’un contenu ou d’une fonctionnalité, si l’utilisateur ne parvient pas à le trouver, votre travail aura été inutile ! Mais ne parlons pas de malheur, on vous explique tout dans cet article !

Concevoir une application qui correspond aux modèles mentaux des utilisateurs

  • Déterminez comment les gens naviguent sur votre site Web. Il est important de savoir ce que l’utilisateur recherche sur votre site et pour cela, il vous faut examiner et analyser les parcours utilisateurs pour comprendre quels types de tâches l’utilisateur effectue.
  • Concevez une navigation cohérente. Sachez le… L’incohérence crée de la confusion, et ça, c’est pas bon ! Alors, un conseil, ne déplacez pas les éléments de navigation de premier niveau, et ne modifiez pas les options de navigation. Vous risquez de perdre vos utilisateurs.
  • Évaluez vos catégories de contenu. Lors des tests utilisateurs, plusieurs activités peuvent vous permettre de construire l’arborescence de votre site. Parlons du tri de cartes ! Lors de cette activité, l’utilisateur doit trier des cartes en fonction de plusieurs catégories selon sa propre logique, sa propre représentation. Alors, si vous voulez savoir si  le chapeau est considéré comme un vêtement ou un accessoire, organisez donc un petit tri de cartes 😉
  • Testez vos menus auprès de vos utilisateurs. Il peut être difficile d’évaluer objectivement son propre travail. Bah oui, vous n’êtes pas l’un de vos utilisateurs. Et c’est pour cette raison, qu’il est essentiel de procéder à des tests utilisateurs afin de déterminer les différents problèmes qui peuvent surgir lors de la navigation de vos utilisateurs. Et en cette période de Covid, sachez qu’il est tout à fait possible de réaliser des tests à distance 😉 Alors, n’hésitez plus !

Concevoir pour une bonne découvrabilité

  • Ne cachez pas votre menu. Au restaurant, vous aimez découvrir le menu immédiatement ! Eh bien, sur un site web c’est pareil ! Lorsque le menu est caché sous un bouton hamburger, l’utilisateur doit d’abord trouver le bouton pour ensuite découvrir le menu. Pas top pour la facilité de découverte !
  • Veillez à ce que le menu soit suffisamment visible. Le style visuel de votre menu doit le distinguer du reste de la page. Pour cela, utilisez les espaces blancs et le contraste des couleurs.
  • Utilisez des icônes pour donner plus de sens. Des icônes bien choisies peuvent aider l’utilisateur à comprendre certaines options du menu sans avoir à lire les intitulés. Toutefois, n’utilisez pas que des icônes ! Cela peut gêner la compréhension de l’utilisateur.
  • Placez les menus sur des emplacements familiers. N’oubliez pas que les utilisateurs passent la plupart de leur temps à vagabonder sur plein de sites. Et ils s’attendent à ce que votre site web fonctionne comme les autres ! Ainsi, placez votre menu là où l’utilisateur s’attend à le trouver : en haut de la page,  partie latérale gauche, et pied de page.

Donner le contrôle aux visiteurs

  • Utilisez des intitulés clairs. La conception de la navigation d’un site web doit être prévisible. L’utilisateur doit être en mesure de savoir ce que représente chaque option de navigation avant d’interagir avec elle. Pour ce faire, pour votre menu, laissez tomber les jargons un peu trop complexes, et utilisez des termes simples et connus de tous. Tout le monde sera content 🙂
  • Donnez aux liens du menu un aspect interactif. Les visiteurs ne peuvent pas toujours se rendre compte qu’il s’agit du menu si les options n’ont pas l’air interactives. L’idée c’est donc d’apporter des indicateurs visuels ! Les couleurs, les contrastes sont d’excellents moyens d’apporter un signal clair de ce qui est cliquable ou non.
  • Concevez des options de navigation de taille appropriée. Des options de navigation trop petites ou situées trop près les unes des autres peuvent pousser l’utilisateur à faire des erreurs ! Pensez alors à bien adapter la taille des boutons, notamment sur mobile.
  • Communiquez l’emplacement actuel de l’utilisateur. Cet élément renvoie à l’un de nos précédents articles dédié au principe de visibilité. Selon ce principe, il est très important d’indiquer à l’utilisateur où il se trouve sur l’interface ou sur l’application.
Le soulignage montre bien que l’utilisateur se trouve dans “Notre carte”, et le contraste de couleur signifie qu’il se trouve plus précisément dans les “Nouveautés”.
  • Proposez un fil d’Ariane. En ergonomie, le fil d’Ariane permet d’orienter l’utilisateur au sein de votre site web, notamment si son architecture se compose de plusieurs niveaux. En clair, il s’agit d’une aide à la navigation sous forme de signalisation de la localisation.
Decathlon indique à l’utilisateur où il se trouve via les étiquettes situées en haut à gauche : Decathlon > Homme > Vêtements > Pantalons.
  • Utilisez des “Sticky menus” pour le défilement de longue page. Avec un menu ordinaire, l’utilisateur, qui a atteint le bas de page, doit remonter jusqu’en haut pour naviguer. Un  “sticky menu” ou menu collant permet de rendre la barre de navigation toujours visible, et donc de pouvoir accéder directement aux différentes options de navigation. 
Sur Wexperience, une fois arrivé en bas de page, le menu de navigation est toujours visible et accessible.

Concevoir pour une lecture rapide et efficace

  • Affichez des intitulés de deux mots. Chaque élément du menu doit comporter un ou deux mots porteurs d’information. En clair, allez droit au but, cela ne sert à rien de palabrer !
  • Évitez les répétitions. Pour ne pas nuire à la lisibilité de votre menu, évitez d’utiliser les mêmes mots pour débuter vos listes.
  • Justifiez à gauche les éléments de navigation. Dans les pays occidentaux, on lit de gauche à droite. Alors, pour améliorer la lisibilité de votre site, utilisez des éléments de navigation justifiés à gauche comme le montre l’exemple de Zalando ci-dessous.
  • Faites attentions aux majuscules. Les majuscules permettent d’attirer l’attention de l’utilisateur. Toutefois, en majuscule, tous les mots ont une forme rectangulaire et uniforme, ce qui rend la lecture parfois difficile et votre page web illisible. Veillez donc à utiliser avec parcimonie les mots en majuscule.
  • Limitez le nombre d’options de navigation de premier niveau. Le psychologue George Miller a constaté que le nombre d’objets moyen qu’un être humain peut retenir est de plus ou moins 7. Il est alors important de retenir ce nombre, et si vous concevez un site complexe, avec plusieurs options de navigation, proposez des sous-menus afin de ne pas perdre l’utilisateur.
La Redoute propose ici un sous-menu pour présenter les différentes catégories existantes dans la rubrique “Maison” du menu principal.
  • Faites attention à l’ordre des options de navigation. Non seulement le nombre d’options est important, mais l’ordre l’est aussi. L’effet de position en série est le fait de mieux se souvenir des premiers et des derniers éléments d’une série. Les options que vous placez au début ou à la fin de la navigation sont donc plus marquantes, c’est pourquoi il faut les choisir avec réflexion.
  • Utilisez des méga-menus. Les méga-menus sont de grands menus déroulants comprenant plusieurs niveaux. Ils permettent à l’utilisateur d’avoir une vision globale du menu, et donc de pouvoir sauter des niveaux pour gagner du temps.

Réduire au minimum la charge cognitive de l’utilisateur

  • Privilégiez la navigation plate. La navigation plate est un système de navigation dans lequel l’utilisateur peut accéder à toutes les pages du site en un seul clic. L’idée est donc de limiter le nombre de niveaux pour ne pas perdre l’utilisateur.
  • Évitez les effets animés. Plus votre menu est soft, mieux c’est ! Les animations ou visuels sur votre menu peuvent distraire l’utilisateur. Il ne s’agit donc pas de l’endroit idéal !

On espère que cet article vous a plu et qu’il vous permettra de rendre la navigation de votre site la plus optimale et efficace possible 😉 Rien de mieux pour satisfaire vos utilisateurs, et surtout pour les inciter à revenir !

Via UX Planet : Practical Tips for Creating Smooth Website Navigation Experience.



Cet article vous a plu ? Abonnez-vous à notre newsletter et recevez notre actualité et plus de contenus sur l’expérience utilisateur.  😉


Auteur
Capitaine Commerce
Capitaine Commerce

Capitaine Commerce est un super héros du Web ! Après quelques années de vadrouille dans la galaxie du Web, il dépose ses collants verts sur la planète Wexperience ! Sa nouvelle mission : vous tenir informé des dernières actualités, des évènements et des articles de blog de votre agence UX préférée !