web-dev-qa-db-fra.com

Quel est le meilleur - un menu résumé ou un menu détaillé?

Je repense un menu de navigation pour une application Web. Le menu actuel est une liste de tâches, regroupées par service. La liste ne cesse de s'allonger au fur et à mesure que nous ajoutons de nouvelles fonctionnalités et maintenant les utilisateurs doivent faire défiler vers le bas pour tout voir. Nous souhaitons idéalement que la liste ne fasse qu'une seule page. Deux solutions ont été présentées:

  1. Présentez un menu de type accordéon qui s'élargira pour chaque service
  2. Regrouper les tâches pour réduire le menu

Par exemple, notre menu actuel présente des options telles que:

Utilisateur
- Éditer
- Supprimer
- Changer le mot de passe

Boites aux lettres
- Éditer
- Supprimer
- Définir les autorisations
- Gérer les paramètres de spam
- Recherche de spam

Avec la solution 1, vous ne verriez que l'utilisateur et la boîte aux lettres, puis cliquer sur l'un ou l'autre se développerait pour afficher les tâches décrites ci-dessus.

Avec la solution 2, le nouveau menu présenterait quelque chose comme:
Utilisateur
- Réglages

Boites aux lettres
- Réglages
- Autorisations
- Spam

La solution 1, tout en désencombrant l'interface au premier niveau, présentera toujours à l'utilisateur beaucoup de texte à lire au deuxième niveau.

Avec la solution 2, je crains que les utilisateurs ne trouvent pas ce qu'ils recherchent. Par exemple, un utilisateur qui cherche à changer son mot de passe ne saurait forcément savoir aller dans les paramètres utilisateur.

Les deux ont leurs avantages et leurs inconvénients - alors quoi de mieux? Présenter plus d'options à l'utilisateur afin qu'il puisse trouver la tâche exacte qu'il souhaite faire, ou regrouper les tâches sous une rubrique générale?

Edit : Comme demandé, j'ai inclus une maquette d'écran de l'application. Sur la gauche se trouve la liste des utilisateurs, la sélection d'un utilisateur fait apparaître la tâche d'un utilisateur sur le côté droit.
alt text

5
Tania Gobeil

Des deux options proposées, je choisirais le menu accordéon.

Une page séparée signifie deux clics et (généralement) un aller-retour sur le serveur, puis vous devez revenir en arrière.

Il n'y a aucun avantage à faire une "présélection" - à moins qu'il n'y ait trop d'options pour une seule page.

Une seule page (c'est-à-dire sans le menu "groupé", juste un seul lien) est correcte, si tous les cas d'utilisation courants impliquent plusieurs actions par utilisateur sélectionné.

Sinon, j'utiliserais des menus "accordéon", ou des menus popup/méga/en cascade javascript, et permettent d'épingler les commandes en haut de la liste.

2
peterchen

Il serait utile de voir l'espace dont vous disposez pour votre navigation ou l'espace que vous prévoyez d'utiliser. Sans le savoir, cependant, si vous voulez inclure toutes vos options parce que vous avez peur de générer de la confusion, vous pouvez appliquer une solution similaire à la tendance des méga menus . Voici un lien d'exemples sur le sujet:

http://designm.ag/inspiration/mega-menus-showcase/

Si vous voulez vraiment l'option résumée, cependant, vous voudrez peut-être repenser les titres des options de menu résumées. Vous pouvez lire cet article pour d'autres conseils sur la conception d'un système de navigation efficace

http://buildinternet.com/2009/09/principles-of-effective-web-navigation/

Pour résumer, je suggère quelques tests avec des utilisateurs aléatoires ou même simplement un simple sondage sur la clarté des étiquettes que vous avez utilisées. Il n'est pas nécessaire que cette étude soit aussi élaborée, mais elle pourrait vous fournir des informations utiles sur le sujet.

6
Pam Rdz

Au fil du temps, j'ai réalisé que plus il y a de paramètres, plus je préfère avoir un seul lien, par exemple comment Amazon.com a un seul lien qui dit "Votre compte". La raison en est très simple: après avoir cliqué sur le lien "Votre compte", une page apparaît contenant tous les choix possibles, et si ce que je recherche n'est pas immédiatement évident, je peux appuyer sur Control-F ou Cmd -F pour trouver ce que je veux sur la page.

Avec les menus, la seule option avec les applications Web est de les lire. Je trouve que cela devient fastidieux avec le temps. Et plus le menu est grand (le méga-er?!), Plus il devient fastidieux à lire, sans possibilité de recherche. (La situation est différente sur les applications de bureau où les menus sont plus "naturels" et proposent des raccourcis clavier.)

2
Hisham

Je trouve contre-intuitif qu'une "tâche" m'amène à un nouveau menu ou à une nouvelle page de paramètres. Une tâche est pour moi concentrée sur un seul sujet - comme "Gérer les rôles ...", "Changer le mot de passe ..." ou "Désactiver le compte" - pas "Gérer ceci et cela et en montrer plus ..." ^^ Mais c'est peut-être juste moi.

Idéalement, j'essaierais vraiment d'inclure toutes les tâches clairement écrites, une barre de défilement si nécessaire.

Mais pour le compresser, la façon dont la boîte à outils dans Visual Studio le fait est assez soignée. Dans ce cas, ce serait comme l'idée d'accordéon - mais avec une catégorie supplémentaire en haut qui est pré-développée qui répertorie les tâches les plus courantes ou les plus populaires.

v Basic
   Change password
   Edit user
   Search spam
> User
> Mailbox

Décider de ce qui est une tâche courante peut être une simple décision ou être pris de manière dynamique en fonction de ce que l'utilisateur connecté utilise le plus.

Les catégories pourraient également être un peu inversées s'il y a peu de catégories logiques contenant de nombreuses tâches, pour rendre chaque catégorie moins encombrée.

v Basic
   Change password
   Edit user
v Edit
   User
   Mailbox
   Permissions
v Spam
   Search
   Settings
v Delete
   User
   Mailbox
1
Oskar Duveborn

Utilisez les info-bulles.

Faites un menu résumé avec une liste de toutes les choses qui peuvent être faites sur chaque page dans une info-bulle qui montre quand l'utilisateur survole l'élément.

De plus, lorsque vous effectuez la transition pour la première fois, donnez des conseils à l'utilisateur. Par exemple, lorsque l'utilisateur clique sur l'option du menu utilisateur, une petite fenêtre contextuelle (comme celles utilisées sur ce site) explique les modifications apportées au menu.

0
Sruly