Ergonomie e-commerce: optimiser ses icônes & pictogrammes

Un grand nombre d’entre vous utilisent les icônes et les pictogrammes pour faciliter la navigation et la compréhension de votre boutique en ligne. Leur bon emploi permet d’améliorer votre ergonomie, rendant votre site e-commerce plus lisible par ses visiteurs. Voici donc quelques conseils pour optimiser vos icônes et pictogrammes.

Des icônes et pictogrammes explicites…

La base d’une icône est dans ce quelle représente. Veillez à utiliser un visuel compréhensible aisément par tous (exemple : un carton pour représenter la livraison). Attention, explicite pour tous, pas par vous seul! (et je parle en connaissance de cause…. 😉 )

… appuyées par un texte…

Une icône seule peut être génératrice de confusion. Dans l’exemple ci-dessous, il peut y avoir de nombreuses interprétations possibles pour l’icône sans texte: est-ce l’assistance? la rubrique d’aide? la FAQ? Des informations sur le produit que je consulte? Pour éviter toute frustration, n’hésitez pas à appuyer vos icônes par un texte.

icone avec et sans texte

… au bon format…

JPG, PNG, GIF sont les trois formats d’images les plus couramment utilisés. Ils sont bien reconnus par tous les navigateurs (petit bémol pour le couple PNG-Internet Exporer 6 et inférieur).

Au delà de tout considération technique (un bon article ici si vous désirez), optez pour une démarche pragmatique: testez tout simplement les trois formats pour une même icône et privilégiez celui qui aura le meilleur compromis lisibilité – poids.

Petit détail à savoir, le JPEG ne gère pas la transparence contrairement au GIF et au PNG. Ce dernier est le seul à pouvoir produire des images translucides.

et à la bonne taille!

Evitez de préférences les icônes trop petites. Ce n’est agréable pour personne de forcer le regard pour décrypter un élément trop petit d’un site internet. Votre page n’a que quelques secondes pour convaincre!

Revenir en haut