Menu hamburger : la bonne recette !

Menu hamburger - ergonomie des sites web

Le menu hamburger est l’outil de navigation par excellence de la version mobile de votre site.
On l’appelle ainsi car il ressemble (avec un soupçon d’imagination) au pictogramme d’un burger !

Mais son utilisation est loin d’être évidente et il est intéressant d’analyser et de comprendre de manière plus précise ce qui vous permettra de proposer une expérience de navigation fluide et intuitive à tous vos visiteurs.

“Connu mais pas toujours reconnu”

LE SMARTPHONE, UN ÉLÉMENT DÉCLENCHEUR ?

Avec l’arrivée des smartphones (et des tablettes dans certains cas), l’affichage des pages mobiles a dû être adapté au support avant de s’adapter automatiquement. C’est ce que l’on appelle “avoir un site responsive”.
Pour aller plus loin, le remplacement de la barre de menu “classique” à petit à petit cédé sa place au menu mobile ; notre fameux menu hamburger.

Mais cette icône est née bien avant la naissance du web, puisque l’on retrouve son existence dans une interface Xérox au début des années 80 avant d’être reprise des années plus tard dans l’IOS mobile. Elle s’impose vraiment avec l’intégration du fameux pictogramme dans Facebook.

Au menu dE VOTRE site internet:
3 traits dans un coin

Finalement c’est la solution de facilité, mais il faut éviter de tomber dans la facilité si l’on souhaite optimiser l’ergonomie et la navigation de ses visiteurs.
Ce pictogramme résout bien des soucis d’intégration du menu car il permet d’alléger son header.
Mais quid des visiteurs qui ne connaissant pas la signification des ces 3 petits traits ?
Et bien, ils vont tout simplement passer à côté !
Et pour parer à ce soucis, on sait que le simple fait d’ajouter “menu” à côté vous permettra d’augmenter de 50 à 60 % les taps sur le menu !
C’est simple, il suffisait d’y penser !

Menu hamburger sur le web

Du coup, on adopte le menu hamburger alors ?

Oui mais non en fait … Disons que ça n’est pas aussi simple que ça.
Finalement cela dépend de pas mal d’éléments.
Prenons l’exemple de Facebook. Il a adopté le fameux menu à 3 barres, avant de s’en défaire pour proposer ce que l’on appelle une “tap bar”, c’est-à-dire un espèce de menu secondaire donnant accès à des fonctionnalités spécifiques qui est situé en bas de l’écran.
Ce même menu est parfois utilisé sur des “versions bureau” pour rendre la page beaucoup plus épurée.

Pour certains sites, on trouve même des alternatives avec des menus dont les items se retrouvent automatiquement dans un menu secondaire. En fonction de la résolution de l’affichage et de leur importance dans le menu initial, le menu s’adapte.

 

Et moi, je choisis quoi finalement sur mon site ?

Et bien tout va dépendre du nombre d’items de votre menu, mais également du type de site proposé.
En effet, sur un site e-commerce, on affiche plus facilement le contenu de la boutique + un menu burger permettant d’accéder aux autres parties du site.
Sur un blog, par exemple, on propose des pictogrammes thématiques. Ils amènent aux catégories d’articles et dans le menu des infos plus secondaires.
N’oubliez pas que votre lecteur est souvent pressé, distractible, et surtout qu’il doit trouver l’information le plus vite possible.

A votre écoute pour discuter de votre site internet !

Vous voulez un bonus ?

Pour pallier le manque d’intérêt du visiteur concernant votre joli petit hamburger et pour que sa navigation ne devienne pas indigeste… n’hésitez pas à intégrer dans vos contenus du maillage interne (ou liens internes).  Engager votre lecteur sur d’autres pages est important. N’oubliez pas que Google aime qu’un visiteur passe du temps à lire et aille voir d’autres contenus que celui sur lequel il a atterri en sortie de SERP.

Bon appétit ! (bah oui, aujourd’hui c’est la journée mondiale du hamburger !)

Partager l'actualité
Aller au contenu principal