Barres d’outils Windows 7

Les barres d’outils permettent de regrouper les commandes pour un accès efficace.

Certaines barres d’outils classiques.

Utilisez des barres d’outils en plus ou à la place des barres de menus. Les barres d’outils peuvent être plus efficaces que les barres de menus, car elles sont directes (toujours affichées au lieu d’être affichées sur un clic de souris), immédiates (au lieu d’exiger une entrée supplémentaire) et contiennent les commandes les plus fréquemment utilisées (au lieu d’une liste complète). Contrairement aux barres de menus, les barres d’outils n’ont pas besoin d’être complètes ou explicites simplement rapides, pratiques et efficaces.

Certaines barres d’outils sont personnalisables, ce qui permet aux utilisateurs d’ajouter ou de supprimer des barres d’outils, de modifier leur taille et leur emplacement, et même de modifier leur contenu. Certains types de barres d’outils peuvent être décompressés, ce qui entraîne une fenêtre de palette. Pour plus d’informations sur les variétés de barres d’outils, consultez modèles d’utilisation dans cet article.

Est-ce l’interface utilisateur appropriée ?

Pour décider, tenez compte de ces questions :

• La fenêtre est-elle une fenêtre principale ? Les barres d’outils fonctionnent bien pour les fenêtres principales, mais sont généralement écrasantes pour les fenêtres secondaires. Pour les fenêtres secondaires, utilisez boutons de commande, boutons de menuet liens à la place.
• Existe-t-il un petit nombre de commandes fréquemment utilisées ? Les barres d’outils ne peuvent pas gérer autant de commandes que les barres de menus. Elles fonctionnent donc mieux pour accéder efficacement à un petit nombre de commandes fréquemment utilisées.
• La plupart des commandes sont-elles immédiates ? Autrement dit, sont-elles principalement des commandes qui ne nécessitent pas d’entrée supplémentaire ? Pour être efficaces, les barres d’outils doivent avoir une sensation directe et immédiate. Si ce n’est pas le cas, les barres de menus sont mieux adaptées aux commandes qui nécessitent une entrée supplémentaire.
• La plupart des commandes peuvent-elles être présentées directement ? Autrement dit, les utilisateurs interagissent avec eux à l’aide d’un seul clic ? Bien que certaines commandes puissent être présentées à l’aide de boutons de menu, la présentation de la plupart des commandes de cette façon sape l’efficacité de la barre d’outils, ce qui rend une barre de menus un meilleur choix.
• Les commandes sont-elles bien représentées par les icônes ? Les boutons de barre d’outils sont généralement représentés par des icônes plutôt que par des étiquettes de texte (même si certains boutons de barre d’outils utilisent les deux), tandis que les commandes de menu sont représentées par leur texte. Si les icônes de commande ne sont pas de haute qualité et ne sont pas explicites, une barre de menus peut être un meilleur choix.

Si votre programme dispose d’une barre d’outils sans barre de menus et que la plupart des commandes sont accessibles indirectement par le biais de boutons de menu et boutons fractionnés, cette barre d’outils est essentiellement une barre de menus. Appliquez les menus de barre d’outils modèle dans les instructions menus à la place.

Concepts de conception

Une bonne barre de menus est un catalogue complet de toutes les commandes de niveau supérieur disponibles, tandis qu’une bonne barre d’outils offre un accès rapide et pratique aux commandes fréquemment utilisées. Une barre d’outils ne tente pas d’entraîner les utilisateurs pour les rendre productifs. Une fois que les utilisateurs ont appris à accéder à une commande dans une barre d’outils, ils continuent rarement à accéder à la commande à partir de la barre de menus. Pour ces raisons, la barre de menus d’un programme et sa barre d’outils n’ont pas besoin de correspondre directement.

Barres d’outils et barres de menus

Traditionnellement, les barres d’outils sont différentes des barres de menus de la manière suivante :

• Fréquence. Les barres d’outils présentent uniquement les commandes les plus fréquemment utilisées, tandis que les barres de menus cataloguent toutes les commandes de niveau supérieur disponibles dans un programme.

• Instantanéité. Cliquer sur une commande de barre d’outils prend effet immédiatement, tandis qu’une commande de menu peut nécessiter une entrée supplémentaire. Par exemple, une commande Imprimer dans une barre de menus affiche d’abord la boîte de dialogue Imprimer, tandis qu’un bouton Imprimer la barre d’outils imprime immédiatement une seule copie d’un document sur l’imprimante par défaut.

  

  Dans cet exemple, le fait de cliquer sur le bouton Imprimer la barre d’outils imprime immédiatement une seule copie d’un document sur l’imprimante par défaut.

• Franchise. Les commandes de barre d’outils sont appelées en un seul clic, tandis que les commandes de barre de menus nécessitent la navigation dans le menu.

• Nombre et densité. L’espace d’écran requis par une barre d’outils est proportionnel au nombre de ses commandes et cet espace est toujours utilisé, même si les commandes ne le sont pas. Par conséquent, les barres d’outils doivent utiliser leur espace efficacement. En revanche, les commandes de barre de menus sont normalement masquées de l’affichage et leur structure hiérarchique permet de n’importe quel nombre de commandes.

• Taille et présentation. Pour packer de nombreuses commandes dans un petit espace, les barres d’outils utilisent généralement des commandes basées sur des icônes (avec des étiquettes basées sur des info-bulles), tandis que les barres de menus utilisent des commandes basées sur du texte (avec des icônes facultatives). Bien que les boutons de barre d’outils puissent avoir des étiquettes de texte standard, ils utilisent beaucoup plus d’espace.

  

  Les boutons de barre d’outils étiquetés prennent au moins trois fois plus d’espace que les boutons non étiquetés.

• Évident. Les barres d’outils bien conçues nécessitent des icônes qui sont principalement explicites, car les utilisateurs ne peuvent pas trouver efficacement des commandes simplement à l’aide d’info-bulles. Toutefois, les barres d’outils fonctionnent toujours correctement si quelques commandes moins fréquemment utilisées ne sont pas explicites.

  

  Dans cet exemple, les icônes les plus fréquemment utilisées sont explicites.

• Reconnaissable et reconnaissable. Pour les commandes fréquemment utilisées, les utilisateurs se souviennent des attributs de bouton de barre d’outils tels que l’emplacement, la forme et la couleur. Avec des barres d’outils bien conçues, les utilisateurs peuvent rapidement trouver les commandes même s’ils ne se souviennent pas du symbole d’icône exact. En revanche, les utilisateurs se rappellent des emplacements de commandes de barre de menus fréquemment utilisés, mais s’appuient sur les étiquettes de commandes pour effectuer des sélections.

  

  Pour les commandes de barre d’outils, l’emplacement distinctif, la forme et la couleur aident à rendre les icônes reconnaissables et identifiables.

  

  Pour les commandes de barre de menus, les utilisateurs dépendent finalement de leurs étiquettes.

Efficacité

Compte tenu de leurs caractéristiques, les barres d’outils doivent être conçues principalement pour l’efficacité. Une barre d’outils inefficace n’a aucun sens.

Si vous ne faites qu’une seule chose...

Assurez-vous que vos barres d’outils sont conçues principalement pour une efficacité. Concentrez les barres d’outils sur les commandes fréquemment utilisées, immédiates, directes et rapidement reconnaissables.

Masquage des barres de menus

En règle générale, les barres d’outils fonctionnent très bien avec les barres de menus : de bonnes barres d’outils offrent une efficacité et de bonnes barres de menus offrent une exhaustivité. Avoir à la fois des barres de menus et des barres d’outils permet à chacun de se concentrer sur ses forces sans compromis.

Étonnamment, ce modèle se décompose avec des programmes simples. Pour les programmes avec seulement quelques commandes, l’utilisation d’une barre de menus et d’une barre d’outils n’est pas logique, car la barre de menus finit par être une version redondante et inefficace de la barre d’outils.

Pour éliminer cette redondance, de nombreux programmes simples dans Windows Vista se concentrent sur la fourniture de commandes uniquement via la barre d’outils et le masquage de la barre de menus par défaut. Ces programmes incluent Windows Explorer, Windows Internet Explorer, Windows Media Player et Windows Photo Gallery.

Ce n’est pas un petit changement. La suppression de la barre de menus modifie fondamentalement la nature des barres d’outils, car ces barres d’outils doivent être complètes et modifiées de la manière suivante :

• Fréquence. La suppression de la barre de menus signifie que toutes les commandes non disponibles directement à partir d’une fenêtre ou de ses menus contextuels doivent être accessibles à partir de la barre d’outils, quelle que soit leur fréquence d’utilisation.

• Instantanéité. La suppression de la barre de menus rend la barre d’outils le seul point d’accès visible pour les commandes, ce qui oblige la barre d’outils à disposer des versions entièrement fonctionnelles. Par exemple, s’il n’existe aucune barre de menus, une commande Imprimer dans une barre d’outils doit afficher la boîte de dialogue Imprimer au lieu d’imprimer immédiatement. (Bien que l’utilisation d’un bouton fractionné soit un excellent compromis dans ce cas. Consultez menu Standard et les boutons fractionnés pour le bouton de fractionnement d’impression standard.)

  

  Dans cet exemple, le bouton De la barre d’outils Imprimer dans la galerie de photos Windows a une commande Imprimer qui affiche la boîte de dialogue Imprimer.

• Franchise. Pour économiser de l’espace et empêcher l’encombrement, les commandes moins fréquemment utilisées peuvent être déplacées vers des boutons de menu, ce qui les rend moins directes.

Les barres d’outils utilisées pour compléter une barre de menus sont conçues différemment des barres d’outils conçues pour une utilisation avec une barre de menus supprimée ou masquée. Et comme vous ne pouvez pas supposer que les utilisateurs affichent une barre de menus masquée pour effectuer une seule commande, le masquage d’une barre de menus doit être traité de la même façon que la suppression complète lors de la prise de décisions de conception. (Si vous masquez la barre de menus par défaut, ne supposez pas que les utilisateurs pensent à afficher la barre de menus pour trouver une commande ou même déterminer comment l’afficher.)

La conception d’une barre d’outils pour fonctionner sans barre de menus implique souvent des compromis. Mais pour l’efficacité, ne compromissez pas trop. Si le masquage de la barre de menus entraîne une barre d’outils inefficace, ne masquez pas la barre de menus !

Accessibilité du clavier

À partir du clavier, l’accès aux barres d’outils est tout à fait différent de l’accès aux barres de menus. Les barres de menus reçoivent le focus d’entrée lorsque les utilisateurs appuient sur la touche Alt et qu’ils perdent le focus d’entrée avec la touche Échap. Une fois qu’une barre de menus a le focus d’entrée, elle est parcourue indépendamment du reste de la fenêtre, gérant toutes les touches de direction, Accueil, Fin et Tabulation. En revanche, les barres d’outils reçoivent le focus d’entrée lorsque les utilisateurs appuient sur tabulation tout au long du contenu de la fenêtre. Étant donné que les barres d’outils sont en dernier dans l’ordre de tabulation, elles peuvent prendre un effort significatif pour s’activer sur une page occupée (sauf si les utilisateurs savent utiliser Maj+Tab pour revenir en arrière).

L’accessibilité présente un dilemme ici : alors que les barres d’outils sont plus faciles pour les utilisateurs de la souris, elles sont moins accessibles pour les utilisateurs du clavier. Ce n’est pas un problème s’il existe à la fois une barre de menus et une barre d’outils, mais c’est si la barre de menus est supprimée ou masquée.

Pour des raisons d’accessibilité, préférez conserver la barre de menus plutôt que de la supprimer complètement en faveur d’une barre d’outils. Si vous devez choisir entre supprimer la barre de menus et simplement la masquer, préférez la masquer.

Modèles d’utilisation

Les barres d’outils ont plusieurs modèles d’utilisation :

Usage	Exemple
barres d’outils principales une barre d’outils conçue pour fonctionner sans barre de menus, masquée ou supprimée.	Les barres d’outils principales doivent équilibrer le besoin d’efficacité avec l’exhaustivité, de sorte qu’elles fonctionnent mieux pour les programmes simples. capture d’écran Barre d’outils principale de l’Explorateur Windows.
barres d’outils supplémentaires une barre d’outils conçue pour fonctionner avec une barre de menus.	les barres d’outils supplémentaires peuvent se concentrer sur l’efficacité sans compromis. Barre d’outils supplémentaire de Windows Movie Maker.
menus de barre d’outils une barre de menus implémentée en tant que barre d’outils.	Les menus de barre d’outils sont des barres d’outils composées principalement de commandes dans boutons de menu et de fractionnement, avec seulement quelques commandes directes, le cas échéant. Menu de barre d’outils dans la galerie de photos Windows.
barres d’outils personnalisables barre d’outils qui peut être personnalisée par les utilisateurs.	Les barres d’outils personnalisables permettent aux utilisateurs d’ajouter ou de supprimer des barres d’outils, de modifier leur taille et leur emplacement, et même de modifier leur contenu. Barre d’outils personnalisable de Microsoft Visual Studio.
fenêtres palette boîte de dialogue sans mode qui présente un tableau de commandes.	les fenêtres de palette sont des barres d’outils non attachées. Fenêtres de palette à partir de Windows Paint.

Les barres d’outils ont ces styles :

Style	Exemple
icônes sans étiquette une ou plusieurs lignes de petits boutons d’icône sans étiquette.	utilisez ce style s’il existe trop de boutons pour étiqueter ou si le programme est fréquemment utilisé. avec ce style, les programmes avec des fonctionnalités complexes peuvent avoir plusieurs lignes, et par conséquent, il s’agit du seul style qui doit être personnalisable. avec ce style, certains boutons de commande peuvent être étiquetés s’ils sont fréquemment utilisés. Barre d’outils des icônes non étiquetées à partir de WordPad.
icônes non étiquetées une seule ligne de boutons d’icône non étiquetés volumineux.	utilisez ce style pour les utilitaires simples qui ont des icônes facilement reconnaissables et qui sont généralement exécutés dans de petites fenêtres. Grandes barres d’outils d’icônes sans étiquette à partir de Windows Live Messenger et de l’outil Windows Snipping.
icônes étiquetées une seule ligne d’icônes étiquetées de petite taille.	utilisez ce style s’il existe peu de commandes ou si le programme n’est pas fréquemment utilisé. ce style a toujours une seule ligne. Barre d’outils des icônes étiquetées à partir de l’Explorateur Windows.
barres d’outils partielles une ligne partielle de petites icônes utilisées pour économiser de l’espace lorsqu’une barre d’outils complète n’est pas nécessaire.	utilisez ce style pour les fenêtres avec des boutons de navigation, une zone de recherche ou des onglets pour éliminer le poids inutile en haut de la fenêtre. Les barres d’outils partielles peuvent être combinées avec des boutons de navigation, une zone de recherche ou des onglets.
barres d’outils partielles volumineuses une ligne partielle d’icônes volumineuses utilisées pour économiser de l’espace lorsqu’une barre d’outils complète n’est pas nécessaire.	utilisez ce style pour les utilitaires simples qui ont des boutons de navigation ou une zone de recherche pour éliminer le poids inutile en haut de la fenêtre. Barre d’outils partielle volumineuse de Windows Defender.

Enfin, les contrôles de barre d’outils ont plusieurs modèles d’utilisation :

Usage	Exemple
boutons d’icône de commande Cliquer sur un bouton de commande lance une action immédiate.	Exemples de boutons de commande d’icône à partir de la télécopie et de l’analyse Windows.
boutons d’icône mode Cliquer sur un bouton de mode entre en mode sélectionné.	capture d’écran Exemples de boutons de mode à partir de Windows Paint.
boutons d’icône de propriété L’état d’un bouton de propriété reflète l’état des objets actuellement sélectionnés, le cas échéant. Cliquer sur le bouton applique la modification aux objets sélectionnés.	Exemples de boutons de propriété de Microsoft Word.
boutons d’icône étiquetés un bouton de commande ou un bouton de propriété étiqueté avec une icône et une étiquette de texte.	ces boutons sont utilisés pour les boutons de barre d’outils fréquemment utilisés dont l’icône n’est pas suffisamment explicite. ils sont également utilisés dans les barres d’outils qui ont si peu de boutons que chaque bouton peut avoir une étiquette de texte. Barre d’outils avec ses boutons les plus fréquemment utilisés étiquetés.
boutons de menu bouton de commande utilisé pour présenter un petit ensemble de commandes associées.	Un triangle pointant vers le bas indique qu’un clic sur le bouton affiche un menu. Bouton de menu avec un petit ensemble de commandes associées.
boutons Fractionner un bouton de commande utilisé pour consolider les variantes d’une commande, en particulier quand l’une des commandes est utilisée la plupart du temps.	un bouton fractionné dans son état normal. Comme un bouton de menu, un triangle pointant vers le bas unique indique que cliquer sur la partie la plus à droite du bouton affiche un menu. un bouton fractionné supprimé. dans cet exemple, un bouton fractionné est utilisé pour consolider toutes les commandes liées à l’impression. la commande d’impression immédiate est utilisée la plupart du temps, de sorte que les utilisateurs n’ont normalement pas besoin de voir les autres commandes. contrairement à un bouton de menu, le fait de cliquer sur la partie gauche du bouton effectue directement l’action sur l’étiquette. Les boutons fractionnés sont efficaces dans les situations où la commande suivante est susceptible d’être identique à la dernière commande. dans ce cas, l’étiquette est remplacée par la dernière commande, comme avec un sélecteur de couleurs : Dans cet exemple, l’étiquette est remplacée par la dernière commande.
listes déroulantes une liste déroulante (modifiable ou en lecture seule) utilisée pour afficher ou modifier une propriété.	Dans cet exemple, les listes déroulantes sont utilisées pour afficher et définir des attributs de police. Une liste déroulante dans une barre d’outils reflète l’état de l’objet actuellement sélectionné, le cas échéant. La modification de la liste modifie l’état de l’objet sélectionné.

Lignes directrices

Présentation

• Choisissez un style de barre d’outils approprié en fonction du nombre de commandes et de leur utilisation. Consultez le tableau de style de barre d’outils précédent pour obtenir des conseils sur la façon de choisir. Évitez d’utiliser une configuration de barre d’outils qui prend trop d’espace à partir de la zone de travail du programme.

• Placez les barres d’outils juste au-dessus de la zone de contenu, sous la barre de menus et la barre d’adresse, le cas échéant.

• Si l’espace est à un niveau premium, économisez de l’espace par :

  • Omettre les étiquettes d’icônes connues et les commandes moins fréquemment utilisées.
  • Utiliser uniquement une barre d’outils partielle au lieu de la largeur entière de la fenêtre.
  • Consolidation des commandes associées avec un bouton de menu ou un bouton fractionné.
  • L’utilisation d’un chevron de dépassement de capacité pour révéler des commandes moins fréquemment utilisées.
  • Affichage des commandes uniquement lorsqu’elles s’appliquent au contexte actuel.

  

  La barre d’outils Windows Internet Explorer permet d’économiser de l’espace en omettant des étiquettes d’icônes connues, en utilisant une barre d’outils partielle et en utilisant un chevron de dépassement de capacité pour les commandes moins fréquemment utilisées.

• Pour le modèle de barre d’outils icônes sans étiquettes, utilisez une configuration par défaut sans plus de deux lignes de barres d’outils. Si plus de deux lignes peuvent être utiles, personnalisez les barres d’outils. À compter de plus de deux lignes, les utilisateurs peuvent surcharger les utilisateurs et prendre trop d’espace à partir de la zone de travail du programme.

  Incorrect :

  

  Une configuration par défaut avec plus de deux lignes de barres d’outils entraîne un encombrement visuel trop important.

• Désactiver les boutons de barre d’outils individuels qui ne s’appliquent pas au contexte actuel, au lieu de les supprimer. Cela rend le contenu de la barre d’outils stable et plus facile à trouver.

• Désactivez les boutons de barre d’outils individuels si vous cliquez dessus pour provoquer une erreur. Cela est nécessaire pour maintenir une sensation directe.

• Pour le modèle de barre d’outils des icônes non étiquetées, supprimez les barres d’outils entières si elles ne s’appliquent pas au contexte actuel. Affichez-les uniquement dans les modes applicables.

  capture d’écran

  Dans cet exemple, la barre d’outils Debug est affichée uniquement lorsque le programme est en cours d’exécution.

• Afficher les boutons de barre d’outils à gauche alignés. L’icône d’aide, le cas échéant, est alignée à droite.

  

  Tous les boutons de barre d’outils sont alignés à gauche, à l’exception de l’aide.

  Exception : barres d’outils de style Windows 7 alignent à gauche les commandes spécifiques au programme, mais alignent à droite les commandes standard, connues telles que Options, Affichage et Aide.

• Ne modifiez pas dynamiquement les étiquettes des boutons de barre d’outils. Cela est déroutant et inattendu. Toutefois, vous pouvez modifier l’icône pour refléter l’état actuel.

  

  Dans cet exemple, l’icône est modifiée pour indiquer la commande par défaut.

Contrôles et commandes

• Préférer les commandes les plus fréquemment utilisées.

  • Pour les barres d’outils principales, fournissez des commandes complètes. Les barres d’outils principales ne doivent pas être aussi complètes que les barres de menus, mais elles doivent fournir toutes les commandes qui ne sont pas facilement détectables ailleurs. Les barres d’outils principales n’ont pas besoin de commandes pour :
    • Commandes directement sur l’interface utilisateur elle-même.
    • Les commandes sont généralement accessibles via des menus contextuels.
    • Commandes standard, connues telles que Couper, Copier et Coller.
  • Pour les barres d’outils supplémentaires, fournissez des commandes qui sont utilisées le plus fréquemment. Les commandes de barre de menus sont un super-ensemble des commandes de barre d’outils. Vous n’avez donc pas à tout fournir. Concentrez-vous sur l’accès rapide et pratique aux commandes et ignorez le reste.

• Préférez les contrôles directs. Utilisez les boutons de barre d’outils dans l’ordre de préférence suivant :

  • Bouton d’icône. Direct et prend un espace minimal.
  • Bouton icône étiquetée. Direct, mais prend plus d’espace.
  • Bouton Fractionner. Direct pour la commande la plus courante, mais gère les variantes de commande.
  • Bouton de menu. Indirect, mais présente de nombreuses commandes.

• Préférez les commandes immédiates. Pour les commandes qui peuvent être immédiates ou avoir une entrée supplémentaire pour une flexibilité :

  • Pour les barres d’outils principales, utilisez les versions flexibles des commandes (telles que Print...).
  • Pour les barres d’outils supplémentaires, utilisez les versions immédiates de la barre d’outils (par exemple, Imprimer) et utilisez des versions flexibles dans la barre de menus (par exemple, Imprimer...).

• Fournir des étiquettes pour les commandes fréquemment utilisées, en particulier si leurs icônes ne sont pas des icônes connues.

  acceptable :

  

  Mieux :

  

  La barre d’outils Télécopie et Analyse Windows comporte peu de commandes, de sorte que les meilleures étiquettes de version soient les plus importantes.

• Ne placez pas de commandes dans les menus de barre d’outils qui sont également directement dans la barre d’outils.

  Incorrect :

  

  Dans cet exemple, l’impression se trouve directement dans la barre d’outils. Il n’est donc pas nécessaire d’être dans le menu.

Organisation et commande

• Organiser les commandes dans une barre d’outils en groupes associés.

• Placez d’abord les groupes les plus fréquemment utilisés. Dans un groupe, placez les commandes dans leur ordre logique. Dans l’ensemble, les commandes doivent avoir un flux logique pour les rendre faciles à trouver, tout en ayant toujours les commandes les plus fréquemment utilisées apparaissent en premier. Cela est le plus efficace, surtout s’il y a un dépassement de capacité.

• Utilisez des séparateurs de groupes uniquement si les commandes entre les groupes sont faiblement couplées. Cela rend les regroupements évidents et les commandes plus faciles à trouver.

  

  

  Exemples de barres d’outils groupées à partir de Windows Mail.

• Évitez de placer des commandes destructrices en regard des commandes fréquemment utilisées. Utilisez l’ordre ou le regroupement pour obtenir la séparation. En outre, envisagez de ne pas placer de commandes destructrices dans la barre d’outils, mais uniquement dans la barre de menus ou les menus contextuels à la place.

  acceptable :

  

  Mieux :

  

  Dans le meilleur exemple, la commande Delete est physiquement séparée de Print.

• Utilisez le chevron de dépassement de capacité pour indiquer que toutes les commandes ne peuvent pas être affichées. Mais utilisez le dépassement de capacité uniquement s’il n’y a pas suffisamment de place pour afficher toutes les commandes.

  Incorrect :

  

  Le chevron de dépassement indique que toutes les commandes ne sont pas affichées, mais plus d’entre elles peuvent être avec une meilleure disposition.

• Assurez-vous que les commandes les plus fréquemment utilisées sont directement accessibles à partir de la barre d’outils (autrement dit, pas en dépassement de capacité) dans de petites tailles de fenêtre. Si nécessaire, réorganisez les commandes, déplacez les commandes moins fréquemment utilisées vers des boutons de menu ou fractionnez des boutons, ou même supprimez-les complètement de la barre d’outils. Si cela reste un problème, reconsidérer votre choix de style de barre d’outils.

Masquage des barres de menus

En règle générale, les barres d’outils fonctionnent très bien avec les barres de menus, car l’utilisation des deux permet à chacun de se concentrer sur ses forces sans compromis.

• Masquez la barre de menus par défaut si votre conception de barre d’outils rend redondante une barre de menus.
• Masquez la barre de menus au lieu de la supprimer complètement, car les barres de menus sont plus accessibles pour les utilisateurs du clavier.
• Pour restaurer la barre de menus, fournissez une option de coche de barre de menus dans la catégorie de menu Affichage (pour les barres d’outils principales) ou Outils (pour les barres d’outils secondaires). Pour plus d’informations, consultez menu Standard et les boutons fractionnés.
• Affichez la barre de menus lorsque les utilisateurs appuient sur la touche Alt et définissez le focus d’entrée sur la première catégorie de menu.

Interaction

• Sur le pointage, affichez le bouton affordance pour indiquer que l’icône est cliquable. Après le délai d’expiration de l’info-bulle, affichez l’info-bulle ou l’info-bulle.

  

  Cet exemple montre les différents états d’affichage.

• Sur le bouton unique gauche :

  • Pour les boutons de commande, interagissez avec le contrôle comme normal.

  • Pour les boutons de mode, affichez le contrôle pour refléter le mode actuellement sélectionné. Si le mode affecte le comportement de l’interaction de la souris, modifiez également le pointeur.

    

    Dans cet exemple, le pointeur est modifié pour afficher le mode d’interaction de la souris.

  • Pour les boutons de propriété et les listes déroulantes, affichez le contrôle pour refléter l’état des objets actuellement sélectionnés, le cas échéant. Lors de l’interaction, mettez à jour l’état du contrôle et appliquez la modification aux objets sélectionnés. Si rien n’est sélectionné, ne faites rien.

• Sur le double-clic gauche, effectuez la même action qu’un simple clic gauche.

  • exception : à de rares occasions, une commande de barre d’outils peut être utilisée de manière plus efficace. Dans ce cas, utilisez le double-clic pour activer le mode.

    

    Dans cet exemple, double-cliquez sur la commande Reproduire le format dans un mode où tous les clics suivants appliquent le format. Les utilisateurs peuvent quitter le mode en cliquant sur un seul clic.

• Cliquez avec le bouton droit sur :

  • Pour les barres d’outils personnalisables, affichez le menu contextuel pour personnaliser la barre d’outils. Affichez le menu en cliquant avec le bouton droit sur la souris vers le bas, et non sur la souris vers le haut.
  • Pour les autres barres d’outils, ne faites rien.

Icônes

• Fournissez des icônes pour tous les contrôles de barre d’outils, à l’exception des listes déroulantes.

  

  Les listes déroulantes n’ont pas besoin d’icônes, mais tous les autres contrôles de barre d’outils le font.

  Exception : barres d’outils de style Windows 7 utilisent des icônes uniquement pour les commandes dont les icônes sont bien connues ; sinon, ils utilisent des étiquettes de texte sans icônes. Cela améliore la clarté des étiquettes, mais nécessite davantage d’espace.

• Vérifiez que les icônes de barre d’outils sont clairement visibles par rapport à la couleur d’arrière-plan de la barre d’outils. Évaluez toujours les icônes de barre d’outils en contexte et en mode contraste élevé.

• Choisissez des conceptions d’icônes qui communiquent clairement leur objectif, en particulier pour les commandes les plus fréquemment utilisées. Les barres d’outils bien conçues ont besoin d’icônes explicites, car les utilisateurs ne peuvent pas trouver efficacement les commandes à l’aide de leurs info-bulles. Toutefois, les barres d’outils fonctionnent toujours correctement si les icônes pour quelques commandes moins fréquemment utilisées ne sont pas explicites.

• Choisissez des icônes reconnaissables et reconnaissables, en particulier pour les commandes les plus fréquemment utilisées. Assurez-vous que les icônes ont des formes et des couleurs distinctives. Cela permet aux utilisateurs de trouver rapidement les commandes même s’ils ne se souviennent pas du symbole d’icône.

• Vérifiez que les icônes de barre d’outils sont conformes aux instructions relatives aux icônes de style Aero.

Pour plus d’informations et d’exemples, consultez Icônes.

Menu standard et boutons fractionnés

Si vous utilisez des boutons de menu et des boutons fractionnés dans une barre d’outils, essayez d’utiliser les structures de menu standard suivantes et leurs commandes pertinentes dans la mesure du possible. Contrairement aux barres de menus, les commandes de barre d’outils ne prennent pas de touches d’accès.

barres d’outils principales

Ces commandes reflètent les commandes trouvées dans les barres de menus standard. Elles doivent donc être utilisées uniquement pour les barres d’outils principales. Cette liste affiche les étiquettes de bouton (et tapez) avec leur ordre et leurs séparateurs, touches de raccourci et points de suspension. Notez que la commande permettant d’afficher et de masquer la barre de menus se trouve dans le menu Affichage.

Fichier NewCtrl+N
Ouvrir... Ctrl+O
Fermer
<séparateur>
SaveCtrl+S
Enregistrer sous...
<séparateur>
Envoyer à
<séparateur>
Imprimer... Ctrl+P
Aperçu avant impression
Mise en page
<séparateur>
ExitAlt+F4(raccourci généralement non donné)

Bouton Modifier(menu) Annuler l’opération+Z
RedoCtrl+Y
<séparateur>
CutCtrl+X
CopyCtrl+C
PasteCtrl+V
<séparateur>
Sélectionner allCtrl+A
<séparateur>
DeleteDel(raccourci généralement non donné)
Renommer...
<séparateur>
Trouver... Ctrl+F
Rechercher nextF3(commande généralement non donnée)
Remplacer... Ctrl+H
Atteindre... Ctrl+G

bouton Imprimer (bouton fractionné) Imprimer... Ctrl+P
Aperçu avant impression
Mise en page

View(menu button) Barre de menus (vérifier si visible)
Volet Détails(vérifier si visible)
Volet d’aperçu (vérifier si visible)
Barre d’état (vérifier si visible)

Zoom
Zoom inCtrl++
Zoom arrièrectrl+-

taille de texte (paramètre sélectionné a une puce)

Maximum
Grandes
Douleur moyenne
Petite
Moindre

Plein écranF11
RefreshF5

Outils (bouton menu) ...

Options Help(split button, use the Help icon) <program name> helpF1

À propos de <program name>

barres d’outils supplémentaires

Ces commandes complètent les barres de menus standard. Cette liste affiche les étiquettes de bouton (et tapez) avec leur ordre et leurs séparateurs, touches de raccourci et points de suspension. Notez que la commande permettant d’afficher et de masquer la barre de menus se trouve dans le menu Outils.

Les noms de catégorie de barre d’outils supplémentaires diffèrent des noms de catégories de menus standard, car ils doivent être plus englobants. Par exemple, la catégorie Organiser est utilisée au lieu de Modifier, car elle contient des commandes qui ne sont pas liées à la modification. Pour maintenir la cohérence entre les barres de menus et les barres d’outils, utilisez les noms de catégories de menus standard si cela ne serait pas trompeur.

Incorrect :

Dans cet exemple, la barre d’outils doit utiliser Modifier au lieu d’Organiser pour la cohérence, car elle possède les commandes de menu Édition standard.

Fenêtres de palette

• Les fenêtres de palette utilisent des barres de titre plus courtes pour réduire leur espace d’écran. Placez un bouton Fermer dans la barre de titre.

• définissez le texte de la barre de titre sur la commande qui a affiché la fenêtre de palette.

• Utilisez une majuscule de style phrase sans mettre fin à la ponctuation.

• Fournissez un menu contextuel pour les commandes de gestion des fenêtres. Affichez ce menu contextuel lorsque les utilisateurs cliquent avec le bouton droit sur la barre de titre.

  

  Dans cet exemple, les utilisateurs peuvent cliquer avec le bouton droit sur la barre de titre pour afficher le menu contextuel.

• Si possible et utile, rendez les fenêtres de palette redimensionnables. Indiquez que la fenêtre est redimensionnable, à l’aide de pointeurs de redimensionnement quand elle est sur le cadre de la fenêtre.

• Lorsqu’une fenêtre de palette est réaffichée, affichez-la à l’aide du même état que le dernier accès. Lors de la fermeture, enregistrez la taille et l’emplacement de la fenêtre. Lors de la lecture automatique, restaurez la taille et l’emplacement de la fenêtre enregistrée. En outre, envisagez de rendre ces attributs persistants entre les instances de programme par utilisateur.

Personnalisation

• Fournissez une personnalisation pour les barres d’outils composées de deux lignes ou plus. Seul le style d’icônes sans étiquette a besoin de personnalisation. Les barres d’outils simples avec quelques commandes n’ont pas besoin de personnalisation.

• Fournissez une bonne configuration par défaut. Les utilisateurs ne doivent pas avoir à personnaliser leurs barres d’outils pour les scénarios courants. Ne dépendez pas des utilisateurs qui personnalisent leur façon de sortir d’une configuration initiale incorrecte. Supposons que la plupart des utilisateurs ne personnalisent pas leurs barres d’outils.

• Fournissez un menu contextuel avec les commandes suivantes :

  • Liste de cases à cocher pour afficher les barres d’outils disponibles
  • Barres d’outils Verrou/Déverrouillage
  • Personnaliser...

• barres d’outils personnalisables verrouillables par défaut, pour empêcher les modifications accidentelles.

• Pour la commande Personnaliser, affichez une boîte de dialogue options qui permet de choisir les barres d’outils affichées et les commandes de chaque barre d’outils.

  

  Dans cet exemple, Visual Studio fournit une boîte de dialogue d’options pour personnaliser ses barres d’outils.

• Fournissez une commande Réinitialiser pour revenir à la configuration de la barre d’outils d’origine dans la boîte de dialogue Personnaliser les options.

• permet de personnaliser les barres d’outils à l’aide d’un glisser-déplacer de la manière suivante :

  • Définissez l’ordre et les positions de la barre d’outils.
  • Définissez les longueurs de barre d’outils, affichant toutes les barres d’outils trop petites pour afficher leur contenu avec un chevron de dépassement de capacité.
  • Si elle est prise en charge, désactive les barres d’outils pour devenir des fenêtres de palette et vice versa.

  Lorsque la boîte de dialogue Personnaliser les options s’affiche :

  • Définissez le contenu de la barre d’outils.
  • Définissez l’ordre du contenu de la barre d’outils.

  Cela permet aux utilisateurs d’apporter des modifications plus directement et efficacement.

• Enregistrer toutes les personnalisations de la barre d’outils, par utilisateur.

Utilisation de points de suspension

Bien que les commandes de barre d’outils soient utilisées pour les actions immédiates, il est parfois nécessaire d’obtenir plus d’informations pour effectuer l’action. Utilisez des points de suspension pour indiquer qu’une commande nécessite plus d’informations avant de pouvoir prendre effet. Placez les points de suspension à la fin de l’info-bulle et de l’étiquette, s’il en existe un.

Dans cet exemple, l’impression... commande affiche une boîte de dialogue Imprimer pour collecter plus d’informations.

Si une commande ne peut pas prendre effet immédiatement, toutefois, aucun point de suspension n’est requis. Par exemple, les paramètres de partage n’ont pas de points de suspension même s’il a besoin d’informations supplémentaires, car la commande ne peut pas prendre effet immédiatement.

La commande Paramètres de partage n’a pas de points de suspension, car elle ne peut pas prendre effet immédiatement.

Étant donné que les barres d’outils sont constamment affichées et que l’espace est à un niveau premium, points de suspension doivent être utilisés rarement.

Dimensionnement et espacement recommandés

Dimensionnement et espacement recommandés pour les barres d’outils standard.

Étiquettes

Généralités

• Utilisez la mise en majuscules de style phrase.
  • Exception : pour les applications héritées, vous pouvez utiliser la mise en majuscules de style titre si nécessaire pour éviter de mélanger les styles de mise en majuscules.

Boutons d’icône sans étiquette

• Utilisez une info-bulle pour étiqueter la commande. Pour le texte de l’info-bulle, utilisez l’étiquette si le bouton a été étiqueté, mais incluez la touche de raccourci s’il en existe un.

  

  Exemple d’info-bulle de bouton d’icône.

Boutons d’icône étiquetés

• Utilisez une étiquette concise. Utilisez un mot unique si possible, quatre mots maximum.

• Placez l’étiquette à droite de l’icône.

• Utilisez une info-bulle pour décrire la commande. Étant donné que les boutons sont étiquetés, l’utilisation d’une info-bulle au lieu d’une info-bulle serait redondante.

  

  Exemple d’info-bulle de bouton d’icône étiquetée.

Listes déroulantes

• Si la liste a toujours une valeur, utilisez la valeur actuelle comme étiquette.

  

  Dans cet exemple, le nom de police actuellement sélectionné agit comme étiquette.

• Si une liste déroulante modifiable n’a pas de valeur, utilisez une invite de .

  

  Dans cet exemple, une invite est utilisée pour l’étiquette de la liste déroulante.

Boutons de menu et boutons fractionnés

• Préférez les noms de boutons de menu basés sur des verbes. Toutefois, omettez le verbe s’il s’agit de Créer, Afficher, Afficher ou Gérer. Par exemple, Outils et boutons de menu page n’ont pas de verbes.
• Utilisez un mot spécifique unique qui décrit clairement et précisément le contenu du menu. Bien que les noms ne soient pas si généraux qu’ils décrivent tout dans le menu, ils doivent être suffisamment prévisibles afin que les utilisateurs ne soient pas surpris par ce qu’ils trouvent dans le menu.
• Bien qu’il ne soit pas obligatoire, fournissez des descriptions d’info-bulles si elles sont utiles.

Éléments de menu

• Utiliser des noms d’éléments de menu qui commencent par un verbe, un nom ou une expressionun.
• Préférez les noms de menus basés sur des verbes. Toutefois, omettez le verbe s’il s’agit de Créer, Afficher, Afficher ou Gérer. Par exemple, les commandes suivantes n’utilisent pas de verbes :
  • Environ
  • Avancé
  • Plein écran
  • Nouveau
  • Options
  • Propriétés
• Utilisez des verbes spécifiques. Évitez les verbes génériques et inutiles, tels que Modifier et gérer.
• Utiliser des noms singuliers pour les commandes qui s’appliquent à un objet unique, sinon utiliser des noms pluriels.
• Pour les paires de commandes complémentaires, choisissez des noms clairement complémentaires. Exemples : Ajouter, supprimer ; Afficher, masquer ; Insérer, Supprimer.
• Choisir des noms d’éléments de menu en fonction des objectifs et des tâches utilisateur, et non sur la technologie.
• Utilisez les noms d’éléments de menu suivants à des fins indiquées :
  • options : Pour afficher les options du programme.
  • Personnaliser : Pour afficher les options de programme spécifiquement liées à la configuration de l’interface utilisateur mécanique.
  • Personalize : Pour afficher un résumé des paramètres de personnalisation couramment utilisés .
  • préférences : n’utilisez pas. Utilisez les options à la place.
  • Propriétés : Pour afficher la fenêtre de propriété d’un objet.
  • paramètres : Ne pas utiliser comme étiquette de menu. Utilisez les options à la place.
• Les éléments de menu qui affichent les sous-menus n’ont jamais de points de suspension sur leur étiquette. La flèche de sous-menu indique qu’une autre sélection est requise.

Documentation

Lorsque vous faites référence à des barres d’outils :

• S’il n’existe qu’une seule barre d’outils, reportez-vous à la barre d’outils.
• S’il existe plusieurs barres d’outils, reportez-vous à celles-ci par nom, suivie de la barre d’outils word. Reportez-vous à la barre d’outils principale activée par défaut et contient des boutons pour les tâches de base, telles que l’ouverture et l’impression d’un fichier, comme la barre d’outils standard.
• La barre d’outils est un mot unique et non capitalisé. (En revanche, la barre de menus est deux mots.)
• Reportez-vous aux boutons de barre d’outils par leurs étiquettes d’info-bulle. Utilisez le texte exact de l’étiquette, y compris sa mise en majuscule, mais n’incluez pas de points de suspension.
• Reportez-vous aux boutons du menu de la barre d’outils par leurs étiquettes et le menu word. Utilisez le texte exact de l’étiquette, y compris sa mise en majuscules.
• Reportez-vous généralement aux contrôles de barre d’outils en tant que boutons de barre d’outils.
• Pour décrire l’interaction utilisateur, utilisez un clic pour les boutons de barre d’outils et les listes déroulantes en lecture seule, puis entrez les listes déroulantes modifiables. N’utilisez pas choisir, sélectionner ou choisir.
• N’utilisez pas de menu contextuel, déroulant, en cascade ou contextuel pour décrire les boutons de menu, à l’exception de la documentation de programmation.
• Reportez-vous aux éléments indisponibles comme non disponibles, pas comme grisés, désactivés ou grisés. Utilisez désactivé dans la documentation de programmation.
• Lorsque cela est possible, mettez en forme les étiquettes en gras. Sinon, placez les étiquettes entre guillemets uniquement si nécessaire pour éviter toute confusion.

Exemples:

• Dans le menu page de la barre d’outils, cliquez sur page Envoyer par courrier électronique.
• Dans la zone polices de la barre d’outils, entrez « Segoe UI ».
• Dans la barre d’outils mise en forme, pointez sur Afficher, puis cliquez sur Commentaires.