053 - Bandeau horizontal accessible

Si simple et pourtant si innovant !

Note 4/5, coût 1/5, accessibilité 5/5

Pour qui ?
Ce type de navigation est approprié pour un site présentant un petit nombre de catégories de niveau 1 mais un nombre plus important de sous-catégories (entre 5 et 7). Attention ce menu est limité par la largeur du site.

Le bandeau horizontal accessible est un bandeau de navigation présenté en haut de page. Le bandeau est composé de plusieurs lignes. Par ligne du bandeau, le système affiche les catégories principales ainsi que leurs sous-catégories. Les liens vers toutes les sections du site sont omniprésents sur toutes les pages du site. Le bandeau permet un accès direct à toutes les sections du site.

Cette navigation est appelée bandeau
horizontal accessible car elle est
une alternative au problème d’access-
ibilité que présente la navigation
020 –Menu horizontal déroulant. Ce
menu présente ses avantages (accès
direct aux sous-catégories) sans ses
inconvénients. De par la limitation
imposée par la largeur du site, les
éditeurs sont obligés de faire des
efforts pour être concis ce qui le
rend d’autant plus facile à décrypter.

Lors de l’implémentation de ce type de navigation :

allumez visuellement (couleur, gras, fond de couleur) la catégorie et la sous-catégorie en cours de consultation.

doublez l’allumage des sections par un élément non lié à la couleur (flèche orientée vers le bas ou autre) afin que les personnes qui ne voient pas les couleurs aient accès à cette information.

rendez non-cliquable la section en cours de consultation si cette section est composée
d’une seule page.

évitez d’utiliser des images pour ce type de navigation, préférez du texte.

Exemple sur www.un-milllieme.net

« Le menu donne une information
en soi (sans nécessité de clic) : ici,
l’étendue du champ des compétences. »
Nicolas Leduc, webdesigner
www.un-millieme.net

associez un code graphique par catégorie.

gardez les libellés de liens courts afin d’aider l’internaute à se faire une carte mentale du site rapidement.

assurez-vous que tous les liens sont bien visibles à un internaute qui naviguerait avec une résolution d’écran de 800×600. Limitez le menu à 760 pixels de largeur.

distinguez clairement à l’oeil les catégories des sous-catégories et par une imbrication logique de listes à puces, pour l’accès mobile et les internautes qui accèdent à la page de manière linéaire.

Laisser un commentaire

Les champs marqués * sont obligatoires