Suite au billet sur Estée Lauder, je me suis dit que c’était sans doute une bonne idée de creuser un peu plus cette histoire de menus de navigation dans les catégories.

Donc, la question, c’est comment présenter les catégories, pour que l’utilisateur s’y retrouve.

La question devient de plus en plus critique quand le nombre de références augmente : on risque d’avoir alors des « listes à la Prévert »…

Une première question est : ou mettre ces menus.

Le standard de fait est de les mettre en haut de la page, sur une barre :

On peut également mettre ces catégories sur deux lignes :

Sur ce sujet, Amazon innove, en plaçant ce menu en colonne, à gauche :

De plus en plus, les boutons des catégories sont en fait actifs, et permettent d’afficher un menu plus complet (Merci Javascript).

Quelques exemples :

L’étude attentive de ces exemples est super intéressante, et mine de rien, les différences sont nombreuses :

  • Certains menus font pro, d’autres non (je vous laisse vous faire votre opinion…) ;
  • Pour certains sites, il faut cliquer pour ouvrir le menu. Sur d’autres sites, le menu s’ouvre tout seul.
  • Certains menu s’ouvrent avec une mise en scène : comme un rideau, … Alors que d’autres s’affichent d’un coup.
  • Certains menus présente une simple liste, alors que d’autres sont beaucoup plus structurés, avec des espaces différents, …
  • Sur certains sites, les menus ne s’ouvrent pas tout de suite : il faut charger des éléments. Sur d’autres, les éléments ont été pré-chargés.
  • Quand on déplace la souris sur les lignes, la ligne peut être mise en valeur… ou pas.

Voilà, je pense que ma démonstration est faite : pour un résultat de bonne qualité, il faut un savant mixe entre plusieurs métiers :

  • Une bonne analyse du catalogue, pour faire les bons regroupements et créer les bonnes catégories. Bonne pour le Web !
  • Une bonne conception, ergonomique, avec un travail précis sur la dynamique des menus.
  • Une excellente réalisation technique, qui ne doit pas être traité à la fin… mais au fil de l’eau, avec une approche eXtreme programming, pour que la réalisation de très bonne qualité sorte, après nécessairement plusieurs itérations.

Actuellement, on ne peut pas décoreler les différents métiers. Il faut assurer une cohérence globale pour avoir un résultat … qui transforme.