Conception d'un menu

IV.III.I. Regroupement d'éléments de menus

Figure IV.5 Regroupement d'éléments dans un menu à l'aide de séparateurs

Les séparateurs de menu sont des lignes horizontales qui séparent visuellement des groupes d'éléments logiquement reliés entre eux dans un menu déroulant, un sous-menu ou un menu contextuel. Par exemple, les séparateurs sur la Figure IV.5 divisent en cinq groupes de fonctionnalités communes. Un bon usage des séparateurs aide à regrouper l'information dans un menu et le rend plus facile à parcourir et mémoriser.

Conseils
  • La meilleure taille pour un groupe est d'environ 2 à 5 éléments. Il vaut mieux placer les groupes à un seul élément au sommet ou en bas d'un menu sinon essayez de les regrouper avec d'autres éléments uniques du même type dans le même menu.
  • Ordonnez les éléments dans un groupe de manière logique, numériquement, dans l'ordre des tâches ou classés par fréquence d'utilisation attendue, selon les circonstances.
  • Ne mettez qu'un seul type d'élément de menu dans chaque groupe — commande, mutable, case à cocher ou bouton radio. Par exemple, ne mettez pas des commandes (comme Affichage ▸ Recharger) et des paramètres (comme Affichage ▸ Barre d'outils) dans le même groupe.

IV.III.II. Types d'élément de menu

IV.III.II.I. Éléments commande

Figure IV.6 Un groupe d'éléments commande dans un menu

Les éléments commandes sont des éléments de menu qui lancent une commande ou réalisent une action telles que Enregistrer, Imprimer ou Quitter. Ils agissent sur le document actuellement actif dans une application basée sur les documents ou sur l'application elle-même.

Conseils
  • Associez un raccourci clavier pour les éléments commandes souvent utilisés. Consultez la Section X.II.III ― Choix des touches de raccourcis pour plus d'informations sur le choix des touches de raccourci.
  • Ne supprimez pas les éléments commandes du menu lorsqu'ils ne sont pas disponibles, rendez-les plutôt inactifs. Cela permet à l'utilisateur de déduire la fonctionnalité que l'application fournit même si elle n'est actuellement pas disponible et de conserver une structure de menu statique qui rend plus facile leur mémorisation.
  • Ne mettez des points de suspension (« ... ») à la fin de l'étiquette que si la commande a besoin d'entrées supplémentaires de la part d'utilisateur avant d'être exécutée. N'ajoutez pas de points de suspension aux éléments qui n'affichent qu'une boîte de dialogue de confirmation (tel que Supprimer) ou qui ne nécessitent pas d'entrée supplémentaire (tel que Propriétés, Préférences ou À propos).

IV.III.II.II. Éléments modifiables

Un élément de menu mutable change de dénomination lorsqu'il est sélectionné. Par exemple, Affichage ▸ Recharger dans un navigateur peut devenir Arrêter pour permettre à l'utilisateur d'interrompre l'opération si cela prend trop de temps.

Notez qu'un élément de menu mutable peut poser des problèmes car l'utilisateur ne voit jamais le changement ; il ne lui est donc pas évident qu'une fonction différente est maintenant à sa disposition.

Conseils
  • Si vos éléments de menu mutables sont des éléments commandes et que vous avez suffisamment de place dans votre menu, songez plutôt à fournir deux éléments de menu adjacents pour les commandes. Ensuite rendez les éléments actifs ou inactifs en fonction du contexte. Ceci permet également à l'utilisateur de savoir si des raccourcis différents sont disponibles pour chaque commande, par exemple Ctrl+R pour Recharger et Échap. pour Arrêter.
  • N'utilisez pas d'élément de menu mutable pour un paramètre à deux états (par exemple Afficher la barre d'outils et Masquer la barre d'outils). Affichez plutôt ces éléments comme un simple élément case à cocher.

IV.III.II.III. Éléments case à cocher

Figure IV.7 Un ensemble d'éléments case à cocher dans un menu

Un élément de menu case à cocher affiche l'état actuel d'un paramètre à deux états et permet à l'utilisateur de le modifier en sélectionnant l'élément de menu.

Conseils
  • Utilisez un élément de menu case à cocher seulement si la signification des états activé et désactivé est évidente d'après la dénomination de l'élément. Cela signifie que les deux états sont logiques et naturellement opposés, tels que « Marche » et « Arrêt ». Si ce n'est pas le cas, utilisez plutôt deux éléments bouton radio.
  • Ne modifiez jamais la dénomination d'un élément de menu case à cocher lorsque l'utilisateur le sélectionne.

IV.III.II.IV. Éléments bouton radio

Figure IV.8 Un ensemble d'éléments bouton radio dans un menu

Les éléments de menu bouton radio affichent quel réglage, parmi deux (ou plus) s'excluant mutuellement, est actuellement sélectionné et permettent à l'utilisateur de choisir un réglage différent en sélectionnant l'élément de menu.

  • Si vous devez proposer un choix parmi deux réglages qui s'excluent mutuellement à l'utilisateur, utilisez deux éléments bouton radio au lieu d'un unique élément de menu case à cocher si les réglages ne sont pas clairement opposés. Par exemple, représentez Vue en icônes et Vue en liste comme deux éléments bouton radio.
  • Ne modifiez jamais la dénomination d'un élément bouton radio lorsque l'utilisateur sélectionne ou dé-sélectionne l'élément.