Je vois beaucoup d’articles en ce moment sur la qualité des boutons et autres zones d’action. Ce sujet n’est sans doute pas le plus crucial pour lancer sa boutique en ligne mais comme le souligne l’édito de ce blog, réussir son lancement et se développer passe par un réglage fin de critères très variés. Alors quels sont les ça-marche pour faire cliquer ?
Commençons par un petit benchmark
Avez-vous reconnu chaque enseigne ?
Quels enseignements en tirer pour le bouton d’ajout au panier ?
Un bouton visible
Une fiche produit comporte beaucoup d’informations toutes très importantes. Mais il est capital de bien hiérarchiser ces informations. Selon moi, dans la plupart des secteurs, la priorité doit être donnée comme suit :
- Une photo du produit professionnelle, éclairée et grande,
- Le bouton ajouter au panier
- le reste
J’évoquais déjà ce sujet en décortiquant la fiche produit du site SmartBargains dans cet article. Je suis devenu en quelques mois un inconditionnel de l’éclairage : si on imagine que la fiche produit était une alcove de magasin ou une salle de musée, les experts de l’éclairage nous demanderaient sur quel produit ou sur quelles oeuvres nous souhaiterions attirer le regard. Le produit doit occuper l’espace et le bouton ajouter au panier doit également être en pleine lumière. Cela passe par une fiche produit simple avec une information produit claire présentée simplement, selon moi, en noir sur fond blanc. Le bouton doit lui être puissant par sa taille, ses couleurs et contraster avec le reste de la fiche produit. Si d’autres services sont présentés sur la fiche produit, il doivent paraître secondaires.
Un bouton lisible
Le bouton doit être lisible dans tous les sens du terme :
- choisir une police simple,
- choisir les bons mots : dans cette étude, j’ai été étonné de voir que peu de marchands choisissaient « acheter » et que tous optaient pour « ajouter au panier« , qui me semble pourtant moins « langage courant ». Sans doute ce choix rassure-t-il les internautes qui n’ont pas l’impression de valider leur commande en cliquant. Il permet par ailleurs d’inviter le client à continuer son shoping,
- ajouter un picto devant le texte représentant un panier ou un caddie (il convient peut-être d’adapter le picto en fonction de son offre),
- opter pour un bouton en image : 1 seul opte pour du texte, tous les autres ont choisi le format image,
- donner un nom clair aux images (ajouter_au_panier.gif), ce qui facilite l’accès au web pour les personnes mal voyantes.
Je n’ai pas trouver de convergence sur l’utilisation des majuscules ou minuscules sur le bouton.
Ce que nous apprennent les jeux pour enfants
Il est fou de voir à quelle vitesse un enfant prend en main un jeu éducatif sur PC. Cette rapidité d’apprentissage est sans doute liée à la capacité de l’enfant mais aussi au savoir-faire des concepteurs de jeu. Pour faire comprendre à un enfant qu’une zone graphique est une zone d’action, il suffit de l’animer au survol de la souris.
Dans cet esprit, je vous suggère d’aller voir le bouton « ajouter au panier » de la boutique Lénola. Non seulement le bouton est original en terme de graphisme et de texte (« j’adore, j’achète« ) mais il s’anime au passage de la souris. Cette animation est discrète mais présente et accompagne le client dans sa compréhension de la fiche produit.
Personnellement, je trouve ce genre d’animation très intéressante tant qu’elles restent discrètes. Cela revient un peu au même que la transformation du pointeur de la souris qui passe sur un lien, ou que le rebond des images d’albums sur l’ipod touch lorsqu’on le feuillette : c’est superflu mais naturel et donc, ça aide l’utilisateur. J’imagine que vous allez me citer en commentaires toutes les bonnes raisons pour ne pas le faire mais il fallait bien un peu se mouiller sur cet article 
Vous avez aimé cet article ? Inscrivez-vous à la newsletter de ce site pour être prévenu à chaque nouvelle parution.
ou abonnez-vous au flux rss : 