Les avantages des menus déroulants avec quelques inconvénients en moins.

Exemple sur www.bike-in-the-city.com

Pour qui ? Pour quoi ?
Appropriés pour les sites à fort contenu. Cette navigation quelque peu innovante dénote une volonté de
différenciation. Cette navigation illustre dynamisme et réactivité.

Cette navigation s’affiche généralement en haut à droite des sites internet. Elle utilise un espace fixe. Cet espace est séparé en deux parties. Sur la gauche, les catégories de niveau 1 sont toutes affichées les unes sous les autres. Par défaut, l’espace de droite peut être peuplé d’une description du site.

Lorsqu’un internaute passe sa souris sur une catégorie, les sous-catégories s’affichent dynamiquement sur la partie droite de la navigation.
L’internaute peut ainsi, sans avoir à cliquer, consulter l’ensemble des sous catégories du site. Si une catégorie de niveau 1 ne contient aucune sous-catégorie alors le système affiche une brève description de ce que l’on trouve dans la catégorie en question.

Attention au Royaume Uni
et aux sections recrutements :
Cette navigation est célèbre pour être quasiment impossible à rendre accessible selon les recommandations du W3C. Si vous y parvenez, je serais ravie de voir le résultat. Evitez cette navigation si votre site ou vos gabarits sont amenés à être utilisés pour un site UK.La réglementation britannique veut que tous les sites publics et privés soient accessibles selon un équivalent du niveau AA des recommandations du W3C. La réglementation française veut que tous aient accès aux offres d’emplois quel que soit le handicap.

Lorsque l’internaute clique sur une sous-catégorie, le système de navigation affiche le sous-arbre de la catégorie à l’écran.

Le danger de cette navigation est de perdre l’internaute lorsqu’il recommence à jouer avec la navigation sans pour autant cliquer sur un lien. Pour éviter cela, au bout de quelques secondes d’inactivité, réaffichez le menu des catégories actives en avant.

Trucs d’ergonome : la méthode du tri de carte (en anglais Card Sorting)
Pour créer votre arborescence,
demandez à quelques utilisateurs
représentant votre cible de le faire.
Pour cela, imprimez vos contenus sur
des fiches (ou cartes).
Demandez à votre groupe test de :
1- valider que le contenu :
- a sa place dans le site
- est correctement titré
2- regrouper les contenus
3- labelliser chacun des groupes
Cela vous permettra de comprendre
pourquoi ils ont titré le groupe de
cette manière.
Vous serez sûrement amené à
raccourcir et modifier les labels
pour créer vos catégories.

À ma connaissance, personne à ce jour n’a réussi à implémenter cette navigation afin qu’elle soit totalement accessible à tous. Le problème principal réside dans le fait que si un utilisateur désactive les couleurs de la page, les différents niveaux de menu s’affichert les uns sur les autres. Le menu devient illisible.

Pensez pour votre site à :