Button - Bouton

Élément d’interaction avec l’interface permettant à l’utilisateur
d’effectuer une action.

 

Button - Bandeau

Comportement général

Un bouton d'action est un élément interactif. Il est utilisé pour permettre aux utilisateurs d'effectuer des actions spécifiques sur une page web. Les différents comportements d'un bouton sont les suivants :

  • Affichage
    Les boutons d'action indiquent clairement quelle action sera effectuée lorsque le bouton est cliqué.

 

  • Au clic
    Lorsqu'un utilisateur clique sur le bouton avec la souris ou appuie dessus avec le doigt (dans le cas des appareils tactiles), un événement de clic est déclenché.

 

  • Feedback visuel
    Pour donner un retour immédiat à l'utilisateur, le bouton change d'apparence lorsque l'on passe la souris dessus (effet de survol) ou lorsque l'on clique dessus (effet d'enfoncement). Cela indique que l'action est bien prise en compte.

 

  • Action associée
    Chaque bouton est lié à une action spécifique sur la page web. Cela peut être quelque chose de simple comme soumettre un formulaire, afficher un contenu caché, ou déclencher un processus plus complexe, comme effectuer un achat.

 

  • État désactivé
    Dans certains cas, le bouton peut être désactivé, ce qui signifie qu'il est non cliquable. Cela peut être nécessaire lorsque les conditions requises pour l'action ne sont pas remplies, par exemple, si un formulaire n'est pas correctement rempli.

 


Contenu

Texte

Afin de faciliter la lecture, le libellé d'un bouton doit être court. Il est préférable d'utiliser un verbe à l'impératif pour signifier une action comme par exemple : Enregistrer, Annuler, Modifier.

Pour une lisibilité maximale, le texte d'un bouton doit rester sur une seule ligne et ne jamais être écrit tout en capitales.

 

Bouton avec icône (facultatif)

Les icônes communiquent visuellement l'action du bouton et aident à attirer l'attention. Ils peuvent être placés au début ou à la fin du bouton.