5-erreurs-a-ne-plus-faire-sur-mobile

5 erreurs à ne plus commettre sur mobile

2017 commence et c’est l’heure des bonnes résolutions. Chez Tapbuy, on souhaite que 2017 se traduise par des expériences d’achat toujours plus fluides sur mobile. Déjà parce qu’en tant qu’acheteurs sur mobile, on en a marre de voir des parcours d’achat qui donnent envie de jeter son smartphone par terre. Vous savez, ces parcours d’achat où il faut indiquer sa date de naissance, son département d’origine, le nom de sa mère…

giphy (1)

Ensuite, parce qu’on a envie que les e-commerçants parviennent cette année à mieux transformer leur trafic croissant sur mobile. Et vu les résultats de notre étude sur les 50 plus gros sites e-commerce en France en 2016, ce n’est pas encore gagné.

On commence donc l’année 2017 par un article sur les 5 erreurs à ne pas commettre en termes de parcours d’achat sur mobile.

Erreur n°1 : ne pas utiliser des call-to-action bien visibles et actionnables

Les call-to-action (“CTA”) sont des éléments essentiels permettant de guider et de faire progresser l’utilisateur à travers les différentes étapes du parcours d’achat. Un des CTA les plus importants est celui de la mise au panier. Il faut donc qu’il soit bien visible. Si cela peut sembler une évidence, les utilisateurs interrogés par Tapbuy ont estimé que plus de 30% des acteurs du top 50 e-commerce en France ne proposaient pas de call-to-action suffisamment visibles sur leurs fiches produit. La preuve en images :

fiche-produit-darty

Darty propose deux call-to-action différents qui sont d’une part peu visibles et aussi difficilement actionnables (pour effectuer un clic précis). De plus, les deux call-to-action ne sont pas clairs sur l’action qu’ils nous invitent à faire : le 1er avec une icône en forme de panier et l’indication “livraison offerte”, le 2ème avec une icône en forme de magasin et l’intitulé “retrait offert en magasin” ont laissé perplexe de nombreux utilisateurs.

 

fiche-produit-boulanger

Le call-to-action de Boulanger est un CTA comme Tapbuy les aime : bien visible pour les utilisateurs, bien clair dans la formulation et situé haut dans la fiche produit afin de faciliter la mise au panier.

Erreur n°2 : ne pas donner d’indication sur le coût total de la commande dans le panier

L’utilisateur a besoin d’avoir une bonne idée du prix total de sa commande dès le panier. Cela inclut à la fois le prix des articles ajoutés au panier mais aussi les frais de livraison. Moins de 50% des acteurs top 50 e-commerce en France affichent clairement le montant total de la commande dès l’étape panier. N’oubliez donc pas le trio gagnant :

  • Prix du ou des produits ajoutés au panier
  • Estimation des frais de livraison
  • Coût total de la commande

Panier-blancheporte

Blancheporte propose bien un récapitulatif avec le montant total des deux articles dans le panier. En revanche, aucune estimation des frais de livraison n’apparaît, on n’a donc aucune idée du prix total de la commande.

Panier-la-halle

La Halle propose directement de sélectionner le mode de livraison lors de l’étape panier. L’avantage est que l’utilisateur connaît directement le montant des frais de livraison en fonction de l’option choisie, et le prix total de la commande est automatiquement mis à jour.

Si vous ne pouvez pas proposer de choisir les options de livraison dès l’étape panier (parfois complexe techniquement), le mieux est d’au moins indiquer une estimation des frais de livraison pour une option de livraison donnée (la moins chère par exemple).

Erreur n°3 : Avoir trop de champs sur la création de compte

Si vous devez prendre une bonne résolution en 2017, faites que ce soit celle de limiter le nombre de champs demandés pour la création de compte. Le top 50 e-commerce en France demande de remplir en moyenne 9 champs pour se créer un compte. Certains sites demandent jusqu’à 17 champs obligatoires ! Avez-vous vraiment besoin du département de naissance ? Let’s go back to basics : prénom, nom, email, mot de passe suffisent à créer un compte. Au-delà, vous ennuyez vos potentiels futurs acheteurs. Surtout sur mobile.

Identification-Decathlon

Decathlon

Chez Decathlon, 11 champs sont obligatoires pour se créer un compte : adresse e-mail (X2), mot de passe (X2), type de compte, genre, nom, prénom, date de naissance, département du magasin et choix du magasin. Certains champs ne concernent que la livraison et devraient donc être demandés lors de cette étape.

Identification-Nike

Nike

Nike propose une commande d’invité ou “guest checkout” qui permet de raccourcir l’étape d’identification pour l’utilisateur. L’utilisateur n’a pas à créer un compte, il doit seulement remplir 3 champs : le nom, le prénom et l’adresse email.

Erreur n°4 : ne pas utiliser un formulaire de paiement natif

Sur mobile, la redirection est l’ennemi numéro un des utilisateurs. Ils préfèrent rester dans l’univers dans lequel ils se trouvent, en l’occurence votre site/app mobile. De plus, la redirection implique souvent des temps de chargement de page plus longs. On sait que ça ne dépend pas que de vous mais si vous avez une solution de paiement qui vous aide à créer un formulaire de paiement natif, vos utilisateurs vous le rendront bien, très bien !

Paiement-promod

Chez Promod, l’utilisateur est redirigé vers une page de paiement qui n’est pas bien adaptée au mobile et dont le design contraste fortement avec le reste de l’expérience d’achat.

Paiement-adidas

L’étape du paiement chez Adidas est directement intégrée dans le parcours d’achat mobile. L’utilisateur reste donc dans le même environnement et l’expérience d’achat reste fluide.

Erreur n°5 : ne pas bien gérer ses messages d’erreurs

Combien de fois durant nos tests, des utilisateurs ont failli abandonner leur achat après un message d’erreur mal placé ou énigmatique ? On ne le dit pas assez mais un message d’erreur actionnable (dites pourquoi le champ est mal renseigné) et bien placé (près du champ incriminé) peut vous faire gagner de précieux dixièmes de points de conversion. Alors pourquoi s’en priver ?

Messages-erreurs-Brandalley

Brandalley

Chez Brandalley, les messages d’erreur n’apparaissent pas immédiatement lors du remplissage des champs. Les erreurs pourraient pourtant être déjà détectées (confirmation de mot de passe qui ne correspond pas, deux chiffres seulement pour le téléphone portable…). L’utilisateur doit attendre de presser le bouton “je valide mes coordonnées” pour pouvoir voir l’ensemble des erreurs qu’il a commises (une vraie torture !). En plus, les messages d’erreur sont vagues (“format incorrect”, très bien mais quel est donc le bon format ?) et peu visibles (les champs ne sont pas entourés en rouge, donc on ne visualise pas très bien où se situent les erreurs).

Messages-erreur-La-Redoute

La Redoute

On est au top avec La Redoute sur les messages d’erreur. Ils apparaissent immédiatement dès qu’un champ est mal renseigné, ce qui permet à l’utilisateur de directement voir ce qu’il doit corriger. Les messages guident clairement l’utilisateur en lui expliquant précisément la source de son erreur et en lui donnant les clés pour la corriger (supprimer les espaces…). Enfin, d’un point de vue visuel, les champs sont entourés en rouge avec une croix à la fin, ce qui permet de directement signaler les erreurs à l’utilisateur.

 

Voilà pour les 5 erreurs à ne plus commettre en 2017 ! Plus faciles à dire qu’à faire certes mais pas du tout insurmontables ! Envie d’en discuter ? Contactez-nous sur hello@tapbuy.io ou laissez nous un commentaire en-dessous 😉