Vous l’avez remarqué, peut-être, en ce moment, ce sont mes sbires qui publient, tandis que je me prélasse, tel un roi fainéant, du fin fond de ma tannière de super-héros, en les regardant travailler. Rien de tel que de profiter de la sueurs des autres en récoltant tranquillement la gloire de leurs lauriers.

Blague à part, je tenais à les remercier tous ici pour les articles qu’ils continuent à publier, malgré mon incurie permanente : Cobolian, Diagnosite, Julien, Vanessa, Nicolas, Maxdig, les autres et ceux aussi qui vont venir aussi bientôt.

Tests avec des belges

J’étais à Charleroi en Belgique la semaine dernière pour mener des tests utilisateurs avec les clients d’une des enseignes de notre Groupe (3 Suisses International) et je fus à nouveau surpris de découvrir la disparité “technique” qu’il peut y avoir au sein des groupes de clients d’un même site : de l’internaute expert au débutant maladroit, tous ces profils font partie, que vous le vouliez ou non, de votre panel clients.

Et bien sûr, s’il est toujours gratifiant de voir certains d’entre eux parcourir votre site à la vitesse de la lumière et de passer commande les yeux fermés, il demeure primordial surtout de s’intéresser à ceux qui souffrent comme des damnés pour obtenir leur récompense : un achat. Car, bien sûr, ce sont aux gens qui souffrent qu’il faut s’intéresser pour améliorer l’usabilité de votre site et, par ce moyen, en augmenter le taux de transformation.

Le syndrôme de la caisse-minute

En fait, ces utilisateurs qui transpirent pour parvenir à acheter quelque chose (alors que ce devrait être une joie, d’acheter) me rappellent un exemple frappant auquel vous avez été peut-être vous même confronté s’il vous arrive, comme moi, à l’occasion, d’aller vous chercher de quoi faire, sur le vif, un petit apéro, un samedi soir à la dernière minute. Excité par cette idée, vous foncez à l’hyper du coin (oui, parce que moi, j’habite dans le Nord, terre des Mulliez, et, là bas, les hyper Auchan poussent comme des champignons), vous précipitez dans le rayon cacahouètes et, une fois votre panier rempli, retournez aussi vite que possible à la caisse-minute pour payer, comme son nom l’indique, en une minute, vos emplettes.

La caisse-minute, pour ceux qui ne connaissent pas encore, c’est la caisse sans caissière. C’est un automate, une machine, quoi ! Un peu comme un site web… (et là, vous vous dites “Ah haaaaa ! Je vois où veut en venir le Capitaine. Il va nous parler de tous ces abrutis, pauvres idiots, ignares, de tout ces quidams incapables de scanner leurs articles eux mêmes sans faire tourner le gyrophare rouge qui fera venir, dans un grand sourire dents blanches, la caissière à leur rescousse”).

Oui, effectivement, c’est de ça dont je veux parler. Sauf que… ces gens, ces andouilles, ces abrutis NE le sont pas. Non. Ce sont des utilisateurs. Et comme tous les utilisateurs, ils souffrent de ne pas pouvoir utiliser sans suer une machine censée, en principe, leur simplifier la vie. Un peu comme… VOS utilisateurs.

Car vos clients, vos utilisateurs, sur le Net, ce sont les mêmes que ceux qui passent devant la caisse-minute. Vous pouvez en être certains, ces derniers souffrent autant que les premiers. Et, si l’on poursuit cette analogie, rappelez-vous qu’une caisse sans caissière n’est pour un site internet que l’équivalent du processus de commande ! (Heureusement, dans la vraie vie, les gens se débrouillent bien dans les rayons d’un hyper, ce qui est nettement moins le cas, dans ceux d’un site de e-commerce).

La prochaine fois que vous vous trouverez dans la file d’une caisse-minute, alors, observez-bien vos prédécesseurs, car ils pourraient vous en apprendre beaucoup sur le propre comportement de vos utilisateurs.

Mettre en place un processus d’amélioration permanente

Mais là où je voulais en venir, ce n’était pas de vous dire que voir vos clients souffrir pouvait constituer une sorte de petit spectacle sadique gratifiant (c’est vrai, mais ce n’est pas une pensée très noble, vous savez). Non, c’était pour vous dire, que, si vous vouliez leur rendre la vie facile, à ces clients, si vous vouliez qu’ils arrivent facilement, avec une grande aisance, sans souffrir, à passer commande, vous aviez intérêt à vous retrousser les manches et à travailler dès aujourd’hui en permanence sur votre site pour l’améliorer et le rendre aussi “smooth” qu’un iPhone.

De la relation entre vous et votre équipe technique

Et cela m’amène à un autre sujet, par lequel je voudrais conclure, qui est celui de la relation entre vous, responsable e-commerce, chef d’entreprise, webmaster, et votre équipe technique. Car, modifier à satiété son site Internet, suppose d’avoir une relation privilégiée avec ses développeurs, ce qui, si j’en crois mon expérience, est plutôt une circonstance rare.

Pensez juste à une chose : que ce soit en interne ou externe, votre organisation technique doit présenter suffisamment de souplesse pour pouvoir tester rapidement, en permanence, différentes versions d’interface de votre site.

Et puis pensez aussi à une deuxième chose : n’oubliez jamais, jamais, Ô grand jamais, de mesurer finement le trafic de votre site.

Enfin, pour finir, si vous ne l’avez pas déjà fait : pensez à mettre en place sur votre site un bon outil d’A/B testing (Google Optimizer fera l’affaire pour la plupart d’entre vous).

Ces trois points constituent pour moi le point de départ d’une bonne ergonomie web.

VN:F [1.3.1_645]
Rating: 9.9/10 (7 votes cast)
, ,


Faire toujours tester votre site par des utilisateurs non avertis : cette règle, du moment qu’un site a un objectif de transformation, ce qui est le cas de la plupart des sites aujourd’hui (prise de contact, inscription à une communauté, transaction, vente, etc.), devrait être gravée dans le marbre des tablettes des concepteurs de sites ecommerce.

Beaucoup de sites comportent encore des erreurs grossières d’ergonomie

Encore trop souvent des sites non finis, non testés, comportant des erreurs grossières naissent sur le web, pénalisant dès le départ leurs chances de réussite.

Je vous donne un exemple, extrait d’un site vendant des cafetières expresso portatives.

L’objectif de cette page étant de pousser l’utilisateur vers le paiement, on ne peut pas dire que les 2 liens ci-dessus soient incitatifs.

handpresso basket 3 conseils pour soigner vos liens et vos boutons

Ils ne sont pas hiérarchisés : leur taille, leur couleur et leur typo étant identiques, le seul fait qu’ils soient placés l’un au dessus de l’autre ne suffit pas à donner de l’importance à l’un plus qu’à l’autre (même si, et c’est bien pire encore, le lien “back to website” ait plus de chance d’être cliqué que “Confirm your basket”). Encore plus bête, ces liens ne sont pas soulignés. Pour info, même si c’est moins beau, un lien hypertexte doit être souligné (un jour, on verra dans quels cas on  peut se passer de cet attribut). C’est bien sûr une grossière erreur.

Le bouton “Terminer ma commande” doit toujours être le plus excitant possible

Sur la page panier, il doit absolument y avoir une action mise en avant plus que les autres, c’est “TERMINER MA COMMANDE”. Et pas sous forme de lien, of course, mais bien sous la forme d’un bouton, le plus gros, le plus excitant et le plus appétissant possible. Rappelez-vous que le taux d’abandon entre la page panier et le reste du processus de commande est l’un des plus forts qui soit sur tout votre site. Alors ce n’est pas la peine d’encourager encore plus vos acheteurs à s’enfuir au moment où, précisément, vous souhaiteriez (vraiment fort) qu’ils aillent jusqu’à la page de paiement. On ne sait jamais, vous pourriez avoir une commande. Ca peut toujours être intéressant.

Voilà peut-être ce à quoi aurait vraiment dû ressembler ce panier.

handpress example 3 conseils pour soigner vos liens et vos boutons

Bon, j’ai traduit en français pour que tout le monde comprenne bien mon idée.

3 conseils pour améliorer vos liens et vos boutons

  1. Faites bien la différence entre un lien et un bouton : un lien emmène vers une autre page du site sans aucune autre action. Un bouton engendre un processus, une action, avant d’emmener vers une autre page. Ici, sans préjuger de ce qui se passer derrière mon bouton “Commander”, on peut imaginer que l’on demandera à l’utilisateur de se loguer, de se créer un compte ou bien de valider son adresse de livraison. Dans le cas du panier, on utilise le bouton pour “forcer” visuellement l’action. Instinctivement un utilisateur verra toujours en premier un bouton (surtout s’il est seul sur la page) et sera tenté de le cliquer sans réfléchir.
  2. Faites attention au “wording”. Mais c’est quoi le “wording” me répondrez-vous en vous caressant lentement le menton de la paume de la main ? Le “wording”, c’est le boulot qui consiste à choisir les meilleurs mots pour les boutons, les liens, etc. qui engendreront, une fois cliqués, une réation du système. Si l’on reprend la première capture d’écran (ci-dessus), on s’aperçoit d’ailleurs que le “wording” n’est vraiment pas bon :
    1. “back to website” signifie “Retour au site” : mais quel site ? L’utilisateur peut se demander (consciemment ou non) sur quel site on va l’emmener et pourquoi on l’emmènerait sur un un autre site. C’est bien ici ce que suggère ce texte.
    2. “Confirm your basket” : “confirmer votre panier” est compréhensible, mais suggère une étape supplémentaire dans votre commande un peu comme si, lorsque vous passiez à la caisse d’un supermarché, la caissière derrière son tapis roulant, vous demandait si vous étiez bien sûr de bien vouloir acheter tout ce que vous aviez déposé dessus avant de continuer. Logique ou pas, selon vous ?
    3. Le “wording” est un art compliqué qui peut paraître tiré du bon sens, mais détrompez-vous : il n’y a rien de pire que de mettre les mauvais mots sur un bouton ou un lien. Posez-vous la question de savoir ce que signifie réellement “Poursuivre mes achats” ou bien “Valider mon panier”
  3. Hiérarchisez les call-to-actions : rien ne doit jamais être fait au hasard lorsque vous demandez à l’utilisateur d’interagir avec l’interface de votre site. Celui-ci doit pouvoir toujours identifier quelles options il a, les bonnes comme les mauvaises (retirer un article du panier, par exemple) et ce de manière hiérarchiser. Comme on l’a vu, dans le panier, il vaut mieux mettre l’accent sur le processus de commande. Sur une page produit, il vaut mieux mettre l’accent sur l’action d’ajout au panier (même si d’autres actions peuvent être proposées : “se renseigner sur les tailles”, dans le cas d’un vêtement, “plus d’informations sur ce produit” dans le cas d’un produit technique, etc. En gros, il ne devrait jamais y avoir 2 boutons de la même importance sur une page d’un site ecommerce

J’espère que ces conseils ne vous auront pas endormi ni ne vous auront paru obsolètes. Si vous avez d’autres remarques à ce sujet ou si vous pensez que j’ai dit des bêtises, n’hésitez pas à faire vos commentaires.

VN:F [1.3.1_645]
Rating: 9.2/10 (16 votes cast)


Cet article fait partie d’une série consacrée à l’Expérience Client. Cliquez ici pour lire tous les articles.
——————————————————————————————————————–

De la théorie, passons à la pratique. C’est un récent billet lu sur Design Walker (30+ Creative E-Commerce sites) qui servira de base à mes démonstrations.

Une jolie interface, mais pas très utilisable

Une jolie interface, imitant le HTML à la perfection

LoWorks Store est une “oeuvre”, si j’ose dire, japonaise, où le Flash remplace entièrement le code HTML, mais ne vient pas, à proprement dire, créer d’expérience utilisateur réellement nouvelle. Le Flash ici vient simplement se substituer à une technologie moins interactive sans y apporter d’ interactions très “enrichies”. Toutefois les capacités multimédia de Flash viennent ici “fluidifier” la navigation en la rendant moins “sèche”.

Quant vous cliquez sur un bouton, vous n’entendez pas seulement le clic de votre souris et ne voyez pas simplement la page se recharger, au contraire, un son et une animation sont joués et une barre de chargement vous indique d’une manière visuellement agréable et propre au site qu’une interaction entre le serveur et votre navigateur est en train de se dérouler.

Le Flash évite ici ce désagréable effet de rechargement de page, propre au HTML, qui donne (c’est inconscient presque dans l’esprit de l’utilisateur) la sensation de “sortir du site” ou même pire, d’interrompre l’expérience de navigation. Bien sûr, cela peut paraître évident aux yeux des geeks que vous êtes, chers lecteurs, mais ça va mieux de le dire.

Que nous apporte de plus cette interface en Flash ?

De toute évidence, le Flash permet de s’affranchir de certaines contraintes technologiques du HTML

  • mise en page “carrée”
  • “formes arrondis” lourdes et peu pratiques à intégrer
  • interactions longues et lourdes à programmer nécessitant du javascript
  • pas d’expérience sonore

Curieusement sur LoWorksStore, encore une fois, l’architecture de la page demeure proche de ce qu’elle aurait pu être sur une page web normale. Ca me rappelle ce parallèle avec l’architecture au XIXème siècle, à une époque où l’acier et le béton faisaient leur apparition et où les architectes continuaient à concevoir leurs projets comme s’ils continuaient à concevoir des bâtiments en pierre et en bois.

Pour le reste, même si le design est plaisant au regard (et encore ça dépend de qui le regarde, ici, de toute évidence, le site ne s’adresse pas au grand public, mais à une cible jeune et branchée, aisée et urbaine), le site tombe dans quelques travers.

  • Utilisabilité faible
    • exemple : dans la fiche produit, les boutons changent systématiquement de place quand on passe d’une photo article à l’autre
    • temps de téléchargement longs, trop longs (finalement les barres de loading soulignent plus l’incapacité du site à fournir des médias dans des temps corrects qu’à faire patienter le client)
  • Pas de recherche !!
  • Page d’accueil vide (littéralement vide, puisqu’aucun article n’est affiché quand on arrive sur le site)
  • Navigation de la catégorie aux produits pas homogène

Bref, même si le site est sympathique au premier abord et l’expérience client plutôt agréable, l’impasse sur certains fondamentaux du e-commerce (manque d’informations, manque de mise en valeur des articles, utilisabilité aléatoire) pénalisent les chances de transaction et celles de succès de cette jolie petite affaire.

VN:F [1.3.1_645]
Rating: 8.4/10 (5 votes cast)
, ,


Cet article fait partie d’une série consacrée à l’Expérience Client. Cliquez ici pour lire tous les articles.
——————————————————————————————————————–

L’autre jour, je vous parlais du design et de son impact sur l’expérience client (Design de site, faut-il utiliser des templates ou pas). Bien sûr, le design, c’est aussi le moyen de véhiculer l’image de votre société (ou de votre marque si vous vous appellez Apple ou Adidas), mais d’autres facteurs entrent en jeu dont je voudrais vous parler maintenant.

On le sait maintenant (des études très sérieuses ont été réalisées (par des types en blouse blanche, comme dans les pubs)), l’Expérience Client, globalement, participe à la fidélisation et impulse l’acte d’achat.

Une navigation agréable, des belles images qui font rêver, des sons subtilement placés dans le momentum expérientiel de navigation, des logos qui bougent sont quelques uns des éléments constituants de l’Expérience Client.

Mais bien sûr, s’il suffisait de mettre un maximum de grandes photos et d’animations en Flash dans une interface permettant peu ou prou de passer des commandes, il serait facile de créer une expérience client agréable et cohérente avec l’image de votre société (ou mieux encore, qui permette de transformer vos visiteurs en acheteurs. On est là pour parler de ça, non ?)

Donc, l’Expérience Client, c’est comme l’Amour, ça ne s’achète pas. Ou si plutôt. Ca se paye cher auprès d’une bonne agence, mais pas seulement.

Sur le Web, l’Expérience client relève d’une alchimie complexe à la frontière du design, de l’ergonomie et des animations multimédias

Sur le web, c’est une question d’alchimie qui relève essentiellement de l’ergonomie, du design et des animations multimédias.

L’ergonomie, on le sait, cherche (si je ne me trompe, ma chère Amélie Boucher) à diminuer le plus possible la charge cognitive d’un utilisateur face à une interface homme-machine (IHM) afin de l’emmener de la manière la plus facile possible d’une intention à une réalisation.

Traduit en français, cela veut dire : faire que le client se sente bien, qu’il soit détendu, qu’il ait l’impression de ne faire aucun effort pour mettre ce foutu ipod dans son panier et saisisse son numéro de carte bleue afin de le recevoir chez lui, sans effort aucun, quelques jours plus tard (en espérant qu’il ne le renvoie pas avant 7 jours, auquel cas, ça fait des retours, un compte à recréditer et donc du CA de perdu).

Il existe 2 grandes catégories de clients : les chercheurs et les flâneurs

Cette Expérience Client peut varier en fonction des intentions des internautes. Sur un site, il faut donc imaginer pouvoir mettre en place plusieurs types d’Expérience Client répondant à plusieurs types d’internautes. On pourrait sommairement les classer en deux catégories :

1) les chercheurs : qui utilisent le moteur de recherche et qui vont droit au but avant d’acheter

2) les flâneurs : qui utilisent la navigation et se promènent, flânent sur le site avant de se décider éventuellement, peut-être, je réfléchis…, avant d’acheter

Les premiers étant plutôt de type masculin et les deuxièmes de type féminin.

Partant de ce constat, 2 pistes peuvent être explorées.

1) pour l’internaute qui cherche, il faut lui rendre la navigation facile

  • le moteur de recherche doit être pertinent (ce qui est rarement le cas) et rapide (c’est plus souvent le cas, mais avec des résultats souvent désespérants)
  • les pages produits doivent être claires  (voir les nombreux articles déjà écrits à ce propos)
  • l’information doit être exhaustive et répondre à toutes les angoisses (justifiées) de l’internaute
    • puis-je facilement retourner ma commande ?
    • combien me coûteront les frais de livraison ?
    • le produit que je souhaite est-il réellement disponible et serais-je réellement livré dans les délais annoncés ?
    • quels sont les moyens de paiement acceptés
    • pourrais-je facilement joindre quelqu’un par téléphone en cas de problème ?
    • etc
  • le processus de commande doit être simple
    • pas de formulaire de 3 kilomètres de long
    • pas d’informations demandées inutiles (ou qui sentent trop fort le marketing direct)
    • pas de navigation compliquée ou exotique

2) pour l’internaute qui flâne, c’est une autre paire de manche

L’Expérience Client doit dès lors répontre à trois contraintes :

1) rendre la navigation effectivement facile :

  • en respectant les règles sur les liens hypertextes qui doivent être soulignés en bleu (si possible)
  • en faisant des boutons visibles qui aient l’air de boutons
  • en utilisant (par exemple) un chemin de fer pour permettre à l’internaute de se repérer
  • au global, en mettant en oeuvre un nombre standard de règles simples de l’ergonomie (encore une fois, fiez-vous aux conseils d’Amélie Boucher en la matière)

2) la rendre surprenante

La navigation doit être ludique et proposer un parcours sans cesse surprenante pour l’internaute. Qu’il clique sur un bouton ou qu’il remplisse un formulaire, chaque interaction devrait être étudiée de manière à le surprendre, à l’enchanter, faire qu’il ne s’ennuie surtout pas, que, comme le joueur face à un jeu vidéo, il se retrouve tout entier absorbé par son expérience oubliant les soucis et les contraintes du monde extérieur

3) la rendre mémorable, dans le sens où cette expérience doit laisser dans l’inconscient une impression positive qu’il associera automatiquement à la satisfaction d’un désir (mais pas sexuel, bandes de petits coquins). Ce troisième point joue particulièrement sur la fidélité puisqu’elle incitera inconsciemment l’utilisateur à choisir notre site lors de ses prochaines navigations.

A noter que la deuxième catégorie d’internautes finit toujours par se transformer en internaute de la première catégorie dès lors qu’il a décidé de passer à l’acte d’achat.

Rendre l’Expérience Client agréable n’est pas si simple

Ces contraintes sont complexes et surtout leur équilibre est difficile à mettre en oeuvre, car, concrètement, elle devrait se baser sur l’observation comportementale des internautes ce qui est bien sûr quasiment impossible dans le cas d’un projet commercial (question de temps et de moyens).

Il faut dès lors pouvoir se fier à des critères personnels et objectifs pour pouvoir prendre les décisions qui devraient répondre aux objectifs de l’Expérience Client. De l’utilité évidemment d’un bon chef de projet qui dans le web, est une sorte d’être hybride à la croisée du chef de projet informatique, du directeur artistique et du marketeur. Un genre de mouton à 5 pattes pas facile à dégotter même dans les agences qui ont toujours un mal fou à rassembler toutes leurs compétences sous une seule casquette.

VN:F [1.3.1_645]
Rating: 7.8/10 (10 votes cast)
, ,