Les catégories de menu sont à la fois sur la page et le menu hamburger .. est-ce redondant?
Je crée la version responsive d'un site Web et j'ai rencontré un problème. Le site Web comprend 3 catégories principales (disons Cat 1, Cat 2 et Cat 3).
J'ai d'abord pensé à mettre les 3 catégories sur la page pour un accès facile et pour que les utilisateurs sachent que ce sont les catégories principales sans avoir à cliquer sur quoi que ce soit:
Cependant, lorsque les gens font défiler la page, ils ne pourront pas accéder aux 3 catégories à moins qu'ils ne remontent. J'ai donc décidé de les mettre aussi dans le menu hamburger:
Les deux ont leur raison d'être, mais je me demande si c'est une bonne pratique ou s'il y a redondance?
Dois-je simplement conserver les 3 catégories principales dans le menu hamburger?
Ne répétez pas les catégories à 2 endroits différents. Vous devez en sélectionner un. Vous pouvez tester ce qui est le mieux pour vos utilisateurs, mais si vous êtes sûr qu'il est très important que les catégories soient toujours visibles pour vos utilisateurs, le meilleur composant est les onglets fixes (car les utilisateurs verront toujours les catégories sans avoir besoin de savoir où elles sont).
Ce que vous avez onglets . Vous pourriez envisager de les ajouter à une barre inférieure si l'utilisateur les utilisera constamment.
Il est étrange que la barre supérieure ne contienne pas ces onglets . Cela entraîne le défilement des onglets, comme s'ils faisaient partie du contenu de la page spécifique, tandis que la barre supérieure reste. Dans cette situation, vous avez le problème auquel vous êtes confronté. Comme vous l'avez maintenant Je dirais que le contenu n'est pas redondant car il n'est pas réellement vu deux fois lors de l'activation/désactivation de la barre latérale . Uniquement dans le cas de scrollTop = 0.
Vérifiez le fonctionnement des applications matérielles Google. Dans certains d'entre eux, ils ont une barre supérieure qui comprend le menu hamburger et une icône de recherche. Lorsque l'utilisateur fait défiler vers le bas, toute la barre supérieure se cache. Lorsque l'utilisateur fait défiler vers le haut (un peu), la barre supérieure s'affiche. Lorsque vous cliquez sur l'icône du hamburger, vous ne verrez pas une action de recherche car elle est dans la même vue (basculez simplement la barre latérale pour la voir). Mais dans votre cas, ces fonctions ne sont pas visibles lors du basculement de la barre latérale.
Je voudrais suggerer:
- Coller ces onglets sur la barre supérieure ou une barre inférieure
- Masquer la barre supérieure si nécessaire lorsque l'utilisateur fait défiler
- Si la barre latérale a une section pour les catégories car il y en a plus que ces 3, alors seulement incluez ces 3 (il peut être étrange de voir cat 4, cat 5, mais pas les autres).
- Si la barre latérale n'a pas cette section et qu'elle est fixe (vue) lorsque la barre latérale est fermée, ne les répétez pas dans la barre latérale
La réponse à "devrais-je inclure cette chose redondante, juste au cas où?" est toujours "non", à moins qu'il n'y ait une raison clairement définie pour laquelle les deux sont nécessaires (auquel cas ils ne sont probablement pas vraiment redondants).
Chaque élément que vous mettez à l'écran augmente la charge cognitive de l'utilisateur. La navigation redondante signifie que l'utilisateur peut ne pas reconnaître immédiatement qu'il est en fait redondant - si vous incluez à la fois le hamburger et la barre de navigation, l'utilisateur devrait les examiner tous les deux afin de déterminer qu'ils sont en fait les même chose.
Voilà donc la partie facile à faire. La question la plus difficile est, étant donné que vous devez faire un choix sur la façon d'afficher la navigation, quel est le meilleur choix?
Dans tous les cas, vous devez consacrer un espace d'écran à tout ce qui devrait être le plus utile à vos utilisateurs à tout moment. Les moments où l'utilisateur est le plus susceptible d'avoir besoin d'accéder à la navigation sont
- quand ils arrivent sur le site pour la première fois, et ne savent pas encore quel contenu est disponible
- quand ils ont fini de lire une page de contenu et sont prêts à trouver autre chose à lire.
Le moment auquel l'utilisateur est le moins susceptible d'avoir besoin de navigation est
- lorsqu'ils sont au milieu de la page, à mi-chemin de la lecture d'un contenu.
Par conséquent: placez la navigation en haut de la page, car c'est là que les utilisateurs s'attendent à la voir, et c'est là qu'ils se trouvent lorsqu'ils arrivent sur le site.
Vous pouvez également placer la navigation à la fin de la page, car c'est là qu'ils se trouvent lorsqu'ils ont fini de lire une page de contenu - mais cela est souvent inutile parce que les utilisateurs sont habitués à revenir en haut de la page pour trouver la navigation, car c'est là c'est toujours; et parce que tous les principaux navigateurs mobiles prennent en charge le défilement par simple pression vers le haut de la page (car c'est là que la navigation est toujours). La navigation dans le pied de page est généralement préférable pour les liens vers des liens liés à cette page (qui ne cadreraient pas bien dans la navigation principale) ou pour les éléments standard ou accessoires tels que les crédits, le jargon juridique, les plans du site, etc. (qui idem.)
Dans votre cas particulier, vous n'avez que trois catégories de navigation, qui peuvent être répertoriées en haut de la page (ce qui a l'avantage de la visibilité par rapport à les ranger dans un menu.) Les seuls autres éléments à l'intérieur du hamburger sont votre "connexion" et liens "enregistrer" (qui sont également redondants les uns avec les autres: vous n'avez besoin que d'un seul d'entre eux, ce qui conduit à une page de connexion/création de compte combinée.) Cela aussi pourrait facilement être représenté en ligne en haut de la page, plutôt que niché dans un menu.
Par conséquent: utilisez une barre de navigation en haut de la page avec un lien de connexion au-dessus. N'utilisez pas du tout le hamburger, car il ne sert à rien (le faire flotter est contre-productif, comme décrit ci-dessus; statique en haut de la page est juste redondant.) Ne le ramenez que si vous ajoutez plus de catégories de contenu de sorte que la navigation en ligne serait ne s'adapte plus confortablement (et utilisez-le à la place de la navigation en ligne, pas en plus). Ne faites rien flottant ou collant; ayez confiance que l'utilisateur sait comment trouver le haut de l'écran si et quand il en a besoin.
TL; DR:
En général, quel est le plus important? Votre contenu ou votre navigation?
Si c'est le contenu, l'écran immobilier doit prioriser le contenu. N'encombrez pas la fenêtre d'affichage avec des barres de navigation collantes ou des onglets fixes, en particulier sur les appareils mobiles où l'espace d'écran est si limité, car tout ce qui accomplit est de gêner ce que l'utilisateur essaie de faire.
Si c'est la navigation, écrivez un meilleur contenu. :)