Aller au contenu

Comparaison comportementale

Bouton vs Bouton icône

Choisir Bouton pour : Envoyer ou réinitialiser un formulaire. Choisir Bouton icône pour : Une action familière se répète dans une barre dense.

DimensionBoutonButtonBouton icôneIcon button
DéclenchementClic, toucher, Entrée ou Espace sur le contrôle nommé.Clic, toucher, Entrée ou Espace sur le contrôle iconographique.
ModalitéContrôle d’action non modal ; un éventuel résultat modal est un composant distinct.Contrôle d’action non modal ; son apparence compacte ne change pas le comportement d’un bouton.
PositionnementDans le formulaire, la barre d’outils ou la zone où la commande s’applique.Dans une barre d’outils ou près de l’objet concerné par son action unique.
InteractivitéExécute une action et expose un état désactivé ou en attente si une double activation est risquée.Exécute une action et possède toujours un nom accessible ; l’infobulle reste complémentaire.
FocusUn indicateur de focus contrasté reste visible dans chaque variante active et pendant l'attente.Toute la cible du bouton, pas seulement le glyphe, reçoit un focus visible.
FermetureSans objet : un bouton d'action n'ouvre pas de surface sauf si cette relation distincte est définie.Le bouton lui-même ne se ferme pas ; toute surface contrôlée suit son propre contrat.
Rôle accessiblenative buttonnative button with an explicit accessible name
Cas d’usageEnvoyer ou réinitialiser un formulaireUne action familière se répète dans une barre dense
Comportement mobileFournir une grande cible tactile et distinguer visuellement les actions principales et destructives.Garder une grande cible tactile visible ou invisible et ne jamais dépendre du survol pour expliquer l’action.
Essayer BoutonEssayer Bouton icône