web-dev-qa-db-fra.com

menu hamburger vs alternatives pour les sites

Dans son article Zoltan Kollin propose plusieurs alternatives aux menus hamburger. Suppression des solutions d'application qui nous restent:


Plus

Afficher les options principales, masquer les autres sous "plus".

enter image description here


Effondrement progressif

Sur des écrans plus petits, affichez tout ce que vous pouvez et cachez tout le reste sous "plus". Plus l'écran est grand, plus les éléments sont visibles.

enter image description here


Navigation avec défilement

Balayez vers la droite pour voir plus d'options.

enter image description here


Maintenant, la question est-il une recherche (tests A/B, etc.) sur lequel de ces derniers fonctionne le mieux sur les sites Web? Existe-t-il des recherches sur la façon dont ces hamburgers sont meilleurs (ou pire encore?).

3
Runnick

Le groupe Nielsen/Norman a fait des recherches à ce sujet:

https://www.nngroup.com/articles/hamburger-menus/

Résumé: La découvrabilité est presque réduite de moitié en masquant la navigation principale d'un site Web. De plus, le temps de tâche est plus long et la difficulté de tâche perçue augmente.

Nos tests d'utilisabilité quantitative des menus cachés (tels que les icônes de hamburger) et des menus visibles (tels que les liens en haut des pages) révèlent que:

  • La navigation cachée est moins détectable que la navigation visible ou partiellement visible.

    • Lorsque la navigation est masquée, les utilisateurs sont moins susceptibles d'utiliser la navigation.
    • Si les gens utilisent la navigation cachée, ils le font plus tard dans la tâche que si elle était visible.
  • La navigation cachée offre une expérience utilisateur pire que la navigation visible ou partiellement visible, à la fois sur les téléphones mobiles et les interfaces utilisateur de bureau. Cette constatation s'applique à plusieurs métriques UX, y compris l'évaluation par les utilisateurs de la difficulté des tâches, du temps passé sur la tâche et de la réussite de la tâche.

  • Sur les ordinateurs de bureau, masquer la navigation dégrade davantage l'expérience et la découverte de la navigation que sur les téléphones.

  • Masquer la navigation affecte principalement le contenu qui n'est pas directement accessible via un lien sur la page.

3
SteveD

Les menus de hamburger sont souvent moins efficaces que les autres types de menu, voir cet article par exemple.

J'ai remarqué dans mon travail personnel que le menu hamburger n'est jamais la solution, une barre de navigation inférieure est principalement celle qui fonctionne le mieux pour les sites Web sur lesquels je travaille, mais vous devrez tester cela sur votre propre site pour déterminer ce qui fonctionne le mieux pour vos visiteurs.

Voir aussi cette réponse sur une question connexe ici sur UX.SE

Une bonne alternative serait un menu inférieur avec un maximum de 5 éléments. Voici quelques exemples:

Menu Spotify

enter image description here

Menu Facebook

enter image description here

Divers autres menus

enter image description here

0
MJB