Ensemble d’éléments me permettant de savoir d’un coup d’oeil où je me trouve, où je suis allé, où je peux aller et comment m’y rendre, la navigation est une composante majeure d’un site web qu’il ne faut en aucun cas négliger. D’une navigation adéquate dépendent aussi bien la fidélisation de vos visiteurs que la transformation d’une visite en vente. Car ne vous y trompez pas, qu’il s’agisse d’un billet sur votre blog, du remplissage d’un formulaire de contact par un futur prospect ou d’un troupeau de zébus malgaches, si vous exposez sur le web, c’est que vous avez forcément quelque-chose à vendre.

Quelques principes simples

Comme vous l’avez vu plus haut, la navigation est :

Un ensemble d’éléments : la navigation ne se compose pas uniquement du menu, mais de tous les éléments permettant de… naviguer et de se retrouver sur le site. Nous reverrons cela en détails plus loin, mais on peut citer des éléments aussi divers que :

  • Le menu.
  • Le chemin de fer.
  • Les liens d’évitement.
  • Les titres de parties et sous parties dans un texte.
  • Les éléments contextuels.
  • Le pied de page.
  • Le plan du site (bien qu’on ne puisse pas vraiment parler de navigation à proprement parler).
  • Le titre de la page.

Me permettant de savoir où je me trouve : idéalement, l’arrivée sur une page d’un site devrait immédiatement me permettre de savoir où je me trouve, sans rien connaître du site, et surtout sans jamais avoir à réfléchir. Idéalement, si je me suis profondément enfoncé dans l’arborescence du site, je dois également pouvoir en visualiser les différentes étapes.

Me permettant de savoir où je suis allé : lorsque je tombe sur des éléments de navigation, je dois pouvoir reconnaître d’un seul coup d’oeil si je m’y suis déjà rendu ou non, et évidemment sans réfléchir. Pratiquement, cela passe le plus souvent par de la mise en forme. On pourra choisir de modifier la couleur de la police de caractères, traditionnellement en la rendant plus foncée. Pour des raisons d’accessibilité, il n’est cependant pas recommandé de supprimer le soulignement des liens afin de toujours les reconnaître pour ce qu’ils sont. En fonction de la typologie du site, on pourra également afficher la liste des derniers produits visualisés ou des derniers billets lus dans un encart contextuel.

Me permettant de savoir où je peux aller : l’ensemble des grandes rubriques du site doivent être clairement affichées, et cela passe notamment par :

  • Montrer de manière explicite qu’il s’agit d’un élément de navigation. En 1996, le menu de mon premier site web arborait crânement la mention “menu”. Quelques semaines plus tard, je me rendais compte à quel point c’était évident, et j’éliminais la mention menu au profit d’indications quant aux rubriques : Cyberpunk, Jeux de Rôles, Roller, Contact.
  • Séparer clairement la navigation du contenu.
  • Utiliser une nomenclature claire, unifiée et adéquate. Des deux listes suivantes, l’une est bien, l’autre moins :
    • Écrire, Gestion, Discussion, Personnaliser, Configuration.
    • Écrire, Gérer, Discuter, Personnaliser, Configurer.

Les niveaux de navigation

On distingue deux niveaux de navigation : la navigation globale et la navigation contextuelle.

Navigation globale

La navigation globale est présente sur l’ensemble du site. Elle ne change pas quel que soit la page du site sur laquelle l’utilisateur se trouve, qu’il soit authentifié ou non.

En ce qui concerne ce dernier point, j’avais la semaine dernière le cas de la conception d’un site dont la partie “espace authentifié” devait être particulièrement mise en avant, et notamment apparaître dans la navigation global. Afin de résoudre ce point, nous avons placé le formulaire d’inscription et d’authentification derrière l’onglet “mon espace personnel” quand l’utilisateur n’est pas authentifié. Cela nous a permis de libérer de l’espace dans la têtière en n’ajoutant pas de lien “identification” / “inscription”

On trouvera habituellement la navigation dite “globale” sur la têtière, à gauche, ou à droite, et sur le pied de page qui regroupe généralement l’ensemble des liens utilitaires :

  • Mentions légales.
  • Licence sous laquelle est publiée le contenu.
  • Contact.
  • Plan du site.
Navigation contextuelle

On voit souvent la confusion entre navigation contextuelle et contenus contextuels, l’un et l’autre étant relativement semblables.

La navigation contextuelle, comme son nom l’indique, se compose d’éléments de navigation contextuels à la partie du site visitée. Le contenu contextuel, lui, est un ensemble de contenus en rapport avec le contenu affiché.

Dans le contenu contextuel, on trouvera notamment :

  • Articles de la même famille que celui visité.
  • Articles achetés par les visiteurs ayant acheté l’article en cours de consultation.
  • Articles complémentaires de l’article consulté (des chaussettes si je regarde une paire de bottes en caoutchouc…).

Nomenclature

La nomenclature, aussi appelée wording est fondamentale en termes de navigation. Elle est d’autant plus délicate à mettre en place que celui qui la choisit est généralement profondément immergée dans le site. Ce qui lui semblera limpide comme de l’eau de roche pourra sembler parfaitement obscure pour le visiteur. Une fois le problème de clarté des libellés bien compris, reste le problème de l’efficacité. La navigation doit en effet inciter le visiteur à acheter cliquer, et pour cela, une seule solution : lui donner envie. Autre point à prendre en compte, les codes et standards généralement admis sur le web. Ces codes peuvent être aussi bien écrits que visuels (oui, je sais, on parle de nomenclature). Si ces codes peuvent sembler clairs pour les spécialistes, il n’en est pas forcément de même pour le grand public.

Exemple :

  1. Syndiquer ce site.
  2. feed
  3. Fil RSS.

Ces trois libellés veulent dire exactement la même chose, mais ne seront pas perçus du tout de la même manière par un non spécialiste :

  1. Syndicat ? Syndicat ? Qu’est-ce que ça vient faire là, j’ai déjà ma carte à la CGT moi.
  2. Fil RSS, j’ai lu ça dans le dernier Vieille et Moche, ça sert à suivre un blog sans avoir à revenir dessus tous les jours.

Ce site étant destiné à des spécialistes, le choix d’une icône colorée et mise en valeur, reconnue par les gens du sérail, s’imposait d’elle-même.

Pour résumer, le nomenclature de la navigation doit être :

  • Très claire : je dois comprendre où je me trouve, et où je peux aller.
  • Incitative : je dois avoir envie de cliquer.
  • Adaptée aux us et coutumes du public auquel mon site est destiné.

Typologie des sites étudiés

Bien qu’il existe un très grand nombre de sites différents, nous étudierons dans la seconde partie de cet article des mode de navigations en rapport avec 5 typologies de site qui m’ont semblé les plus pertinents :

  1. Le site portail institutionnel.
  2. Le site marchand.
  3. Le site marketing produit.
  4. Le blog.
  5. L’application web.

À suivre…

l'île de la cité

Perry the Platypus wants you to subscribe now! Even if you don't visit my site on a regular basis, you can get the latest posts delivered to you for free via Email: