Les boutons d’appel à action dont des éléments classiques d’une charte graphique. Censés appeler l’utilisateur à faire une action, les boutons sont privilégiés dans les designs ergonomiques.
Quels sont les éléments essentiels à connaitre pour créer des boutons propices à l’augmentation de l’expérience utilisateur ? Quels sont les secrets de conception des boutons d’appel à action ?
Vos boutons doivent ressembler… à des boutons !
Comment est-ce qu’un consommateur peut comprendre qu’il doit cliquer sur un bouton s’il ne voit pas de bouton ? Restez simple et proposez des boutons qui ont la forme de boutons, c’est-à-dire des rectangles à coins carrés ou arrondis. Les boutons rectangulaires ont été introduits au monde digital il y a des années, et les utilisateurs y sont habitués. Vous pouvez improviser des boutons constitués d’autres formes, mais le risque est plus élevé.
L’essentiel est de garder une certaine cohérence sur tout le site. Vos boutons doivent être identiques sur tout le site et tous les supports pour ne pas perdre vos consommateurs. Ainsi, éviter des boutons à bords arrondis sur une page et à bords carrés sur une autre.
De plus, les ombres sont des indices précieux pour les utilisateurs. Les ombres en bas des boutons permettent la mise en valeur de ces éléments et les rendent facilement identifiables.
Créez des boutons compréhensibles
Les utilisateurs évitent les éléments d’interface qui ne disposent pas d’une signification claire (icône ou texte). Au moins il y a d’étonnement, au mieux c’est. Les boutons doivent ainsi dire aux utilisateurs ce qu’il va se passer s’ils cliquent dessus. La meilleure pratique connue est l’utilisation de verbes d’action.
Placez les boutons où vos utilisateurs peuvent les trouver
Ne laissez pas vos clients partir à la chasse aux boutons et placez-les là où ils sont attendus. Faites des tests pour déterminer quel emplacement est le plus logique.
Simplifiez l’interaction avec vos boutons
La taille et l’effet visuel de vos boutons ont un rôle clé dans leur interaction avec vos consommateurs. Déterminez la largeur de vos boutons en fonction des autres éléments sur la page, tout en vous assurant qu’ils soient assez larges pour que les utilisateurs puissent cliquer dessus.
Une étude de MIT Touch Lab a déclaré que la taille moyenne des doigts est entre 10 et 14 mm et celle des phalanges est entre 8 et 10 mm. Cela signifie qu’un bouton doit faire la taille minimum de 10 mm x 10 mm. Ne négligez pas l’espacement entre les éléments cliquables, afin de fluidifier la compréhension.
Il est également conseillé de donner des informations de suivi aux consommateurs. En effet, pensez à changer l’intensité de la couleur ou de l’ombre du bouton en fonction de son statut (normal, survolé, cliqué et désactivé).
Mettez en avant les boutons les plus importants
Assurez-vous d’accentuer l’action la plus importante. Utilisez des couleurs et des contrastes pour aider les utilisateurs à comprendre l’importance de ce bouton. Si deux boutons sont côte à côte (comme les boutons Annuler et Continuer), donnez une couleur différente au bouton le plus important (Continuer) pour attirer le consommateur dans cette direction.
Source : Smashingmagazine – Nick Babich