Le Bouton "Ajouté au panier"

Suite à mon précédent post sur le panier, je poste quelques conseils concernant le bouton qui permet d’ajouter un article au panier. Plusieurs facteurs influence la performance d’un bouton « Ajouter au panier »: la taille, l’emplacement, le libellé…

La taille

Le bouton doit être gros et visible. Mais ce n’est pas pour autant qu’on ne doit voir que lui. Ça pourrait être vu comme intrusif par certains internautes. Cependant, on doit pouvoir le trouver instantanément, dès qu’on en a besoin, sans avoir à chercher et cliquer dessus sans trop viser. De plus, si on se réfère à la loi de Fitts (une cible est d’autant plus rapide à atteindre qu’elle est grande et proche du curseur), plus le bouton est gros, plus c’est facile de cliquer dessus. En résumé, le bouton doit donc être visible (qu’il marque l’esprit sans trop attirer l’oeil), de taille conséquente et là où l’internaute l’attend…ce qui nous amène au 2ème point.

Où le placer?

Réponse: dans la partie droite de la page, above the fold (au minimum un bouton).
La raison à cela est que l’internaute a toujours été habitué à le trouver dans cette portion de la page: c’est devenu si ce n’est un standard au moins une convention (Jakob Nielsen a définit un standard lorsque plus de 80% des sites utilisent le même principe et une convention lorsque c’est entre 50% et 79% des sites).
De même évitez de « cacher » votre bouton sous le seuil de scroll pour qu’il soit visible à tout moment. Certains internautes pourraient perdre du temps à le chercher ou ne simplement pas le chercher (même si je sais que c’est une idée reçue de dire que l’internaute ne scroll pas, d’après Amélie Boucher dans Ergonomie web, pour des sites web efficaces et elle nous donne même une preuve).

Malgré tout, placé un bouton après la description suit le chemin de lecture et peut paraître logique. Autre chose, imaginons un internaute qui a déjà fait son choix et lu la description du produit. Pour éviter de le faire scroller et perdre du temps, le bouton doit se trouver dans la partie haute de la page. Mais rien n’empêche d’ajouter 2 boutons: un en haut et un en bas (après la description).

Le libellé

Maintenant que j’ai un bouton bien visible et bien placé, qu’est-ce que je mets dedans?
Restez dans le classique. Un « Acheter » ou « Ajouter à mon panier » sont des standards et remplissent bien leur rôle. N’essayez pas de révolutionner le libellé du bouton, ces 2 là (ou d’autres mais attention à bien rester dans quelque chose de standard) ont fait leurs preuves. Prenez garde à ce que la police soit bien lisible et constraste bien avec la couleur de fond du bouton. Le libellé doit être le même en cas de multiples boutons. Et enfin, ajouter un petit pictogramme de caddie ou de panier permet aux internautes un peu plus expérimentés de gagner du temps et de ne pas lire l’intitulé du bouton.

Pour des exemples de boutons (en français et en anglais), reportez vous à mon précédent post.

Articles Relatifs:

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Vous pouvez utiliser ces balises et attributs HTML : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>