Menu Hamburger pour un portefeuille réactif
Dans une conception Web de portefeuille qui se concentre sur la conception de la version mobile (en raison du scénario dans lequel les utilisateurs l'utiliseront) est-il logique de conserver un menu hamburger pour la version de bureau? C'est une page Web réactive, et quand je suis sur la version bureau, le menu semble inexistant. (Il est également situé sur le côté droit, ce qui le rend plus déroutant car il est mélangé entre les images colorées. Dans la version mobile, il semble plus intuitif et mis en évidence.)
Le menu hamburger ... je suis déchiré.
Le menu hamburger diminue la découvrabilité car il cache ce que l'utilisateur va probablement utiliser pour ... eh bien ... découvrir
En un coup d'œil, l'utilisateur peut dire où et comment trouver ce qu'il recherche. Être caché sous un endroit n'est pas idéal pour la numérisation. Cela dit, évitez de le garder sur le site de bureau.
La raison pour laquelle les gens ressentent le besoin de le garder sur mobile est qu'il n'y a pas beaucoup d'espace pour un menu complet. Fais attention. Le menu hamburger est ambigu, il a été testé pour constater que les gens ne le comprenaient pas . Si vous souhaitez incorporer le menu hamburger, assurez-vous au moins d'y ajouter une étiquette (ou tout simplement retirer complètement l'icône et laisser l'étiquette comme "menu").
Pour ajouter à cela, des sites comme Twitter ont complètement éliminé l'utilisation du menu hamburger et ont lancé un menu de navigation au bas de leur application.
Même chose avec Facebook, mais ils ont toujours un menu hamburger, mais dans un but différent.
Comment c'était:
Pour ce qu'il est devenu:
Comme Evil Closet Monkey l'a dit, cela n'a aucun sens que l'icône de hamburger soit utilisée sur une version de bureau du site. Si vous utilisez un framework réactif, comme Bootstrap ou Foundation , ils devraient ajuster automatiquement le style du menu en fonction de la taille de l'écran comme dans l'image ci-dessous.
Si vous regardez cet article où j'ai récupéré l'image , vous verrez comment fonctionne la navigation lors de l'utilisation de Bootstrap. Il vous montre également le code HTML pour configurer une barre de navigation fluide.
Le contexte est tout. Peut-être que cela compte, peut-être que non. Le fait qu'il s'agisse d'un site de portfolio n'a pas vraiment d'incidence en soi.
De manière générale, devez-vous conserver le menu hamburger sur des écrans plus grands? Traditionnellement, nous ne l'avons pas fait. Mais cela devient une option de plus en plus populaire. Certains sites qui conservent le menu hamburger même sur de grands écrans:
Que ce soit bon ou mauvais, encore une fois, cela dépend du contexte. Pour certains sites, vous voulez un système de navigation toujours robuste et très visible. Parfois, la navigation sur le site est secondaire par rapport au contenu de la page d'accueil. C'est un appel au jugement.
Arguments pour pas en utilisant un menu hamburger sur de grands écrans:
- masquer la navigation est généralement une mauvaise idée, alors pourquoi la cacher?
- alors que les gens les connaissent mieux sur de petits écrans, ils ne les recherchent peut-être pas sur de grands écrans
Arguments pour en utilisant un menu hamburger sur un grand écran:
- de nombreux grands écrans sont désormais des appareils tactiles. Les menus hamburger vous permettent d'exposer une version tactile beaucoup plus grande de la navigation sur le site que si elle était à l'écran à tout moment.
- peut faciliter le développement et la maintenance de cette partie du site dans toutes les fenêtres.
- peut offrir une certaine cohérence aux utilisateurs qui utilisent votre site sur plusieurs appareils.
Je suis d'accord avec la réponse et les commentaires ci-dessus, c'est comme UX 101 et je ne contesterai pas cela, mais ... permettez-moi d'ajouter un point de vue différent à considérer.
Vous dites que c'est pour un portfolio. Les portfolios sont destinés à afficher votre travail, mais aussi qui vous êtes. C'est une façon de dire au monde "Hé, je suis moi. Et en plus, je peux faire tout ça!". Personnellement, je sais quelles sont les bases de l'UX, de l'interface utilisateur, des tendances de conception, etc. Maintenant, je veux que VOUS me montriez autre chose, peu importe si c'est bien ou mal, je veux que vous montriez que vous pouvez penser hors de la boîte. Tout le monde et sa mère peuvent suivre les règles d'un livre, ce que je veux voir, c'est si vous pouvez enfreindre les règles (à condition de les connaître d'abord). Gardez à l'esprit que rien n'a jamais été créé sans enfreindre les règles. Par définition. C'est absolument impossible.
Et au fait, si vous êtes un designer avec un artiste Edge, vous savez probablement comment ce menu fastidieux prend cet espace précieux même sur cet écran géant, non? Vous ne voulez probablement pas polluer votre superbe design avec cette navigation ennuyeuse
Ce que je veux dire par là c'est ... ouais, pourquoi pas? Mais aussi ... qu'est-ce qui vous empêche de faire autre chose? Quelque chose de vraiment fou? Vous aurez beaucoup d'espace pour devenir créatif, alors ... pourquoi pas vous?
PS: J'ai fait un site de bureau avec des menus cachés basés sur une mise en page plein écran avec des onglets fous qui ont donné au client 225% plus d'affaires (consultation et conception). Je ne sais pas, peut-être qu'avec le menu normal, cela pourrait fonctionner encore mieux, mais croyez-moi, ce n'est pas exactement un problème. Et en cas de doute ... TEST!