Par , le 17 décembre 2015

E-commerce : la problématique de la barrière de login dans le checkout

UX | 0

Les principaux points de fuite sur les sites e-commerce se situent entre la page panier et la confirmation de commande. Lorsque nous observons en détail les différentes étapes du parcours utilisateur entre ces deux points, l’étape de login ressort significativement de par sa récurrence (présente sur tous les sites marchands) et son importance (2ème cause d’abandon du panier, estimé à 23% des fuites dans le checkout en 2014 – source VWO), quelle que soit la taille de la boutique ou le prix des produits.

Comprendre la raison de la fuite

Mettons-nous un instant dans la peau de Monsieur X, utilisateur type de votre site. Monsieur X a très certainement passé un temps considérable à découvrir, analyser et comparer les produits qu’il ajoutera finalement à son panier. Une fois sur sa page panier, il est de nouveau face à un doute devant le montant total de sa commande : “le montant total est élevé, puis-je me le permettre ?”, “Est-ce que le site est vraiment fiable et sécurisé ?”, “En cas de problème avec ma commande, puis-je la renvoyer facilement ?”, etc. Autant dire que lorsque Monsieur X clique sur le bouton “commander” de votre page panier, l’énergie qu’il a dédié à la réalisation de ses achats est plus que très sérieusement entamée…

C’est très précisément à ce moment que nous plaçons Monsieur X face à une action pénible venant perturber sa vision “linéaire” de commande : Monsieur X est là pour effectuer un achat rapide, pas pour démarrer une relation à long terme avec votre site. Avant de renseigner ses informations de livraison et de paiement, Monsieur X va donc être contraint de  :

  • Se souvenir s’il a déjà ou non créé un compte client sur le site ;
  • S’il possède un compte :
    • se souvenir de son identifiant et de son mot de passe ;
    • re-compléter le formulaire en cas d’erreur ou, pire encore, suivre une procédure de réinitialisation de mot de passe ;
  • S’il n’a pas encore créé de compte :
    • renseigner un formulaire certainement long et pénible, tout particulièrement sur mobile ;
    • accepter de fournir des informations personnelles à (encore) un autre site et donc de recevoir par email des offres commerciales et/ou relances diverses ;

On peut aisément comprendre la frustration de nos utilisateurs face à cette barrière de login.

Nirav Sheth (Kissmetrics) explique très bien ce phénomène dans cet article (traduction française par nos bons soins) :

« Les meilleurs sites e-commerce créent une expérience en ligne qui rend les utilisateurs amoureux de leurs produits. Les expériences shopping sont émotionnelles, accompagnées, et encouragent clairement les visiteurs à ajouter des produits à leur panier. Mais une fois qu’ils accèdent au checkout, quelque chose ne tourne pas rond. Il y a un break dans l’expérience du panier jusqu’au checkout, qui cause une déconnexion pour votre client. C’est cette déconnexion qui se traduit par le plus haut taux d’abandon de panier à la toute première étape de votre checkout. »

Cette barrière est d’autant plus problématique sur mobile, où les conditions d’utilisations sont bien moins confortables (situation de mobilité, petit écran, débit de connexion réduit, etc.) que sur ordinateur de bureau.

Quelques solutions pour diminuer le taux d’abandon

L’optimisation des formulaires

Une des solutions pour minimiser les fuites dues à la barrière du login, sûrement la plus simple, est d’optimiser au maximum vos formulaires et de simplifier vos pages :

  • Ne demander que les informations absolument nécessaires (quitte à donner la possibilité à l’utilisateur de compléter son profil dans un second temps) – chaque nouvelle question complexifiera votre page et augmentera le risque de fuites ;
  • Rassurer l’utilisateur quant à l’utilisation de ses données personnelles ;
  • Si des questions qui ne sont pas strictement nécessaires à l’ouverture de compte sont posées, expliquer pourquoi elles le sont tout de même (ex : date d’anniversaire) ;
  • Ne pas pré-sélectionner d’options complémentaires : cela aura l’effet implicite d’amener un doute dans l’esprit de votre utilisateur sur vos intentions et de vous porter préjudice pour la suite (ex: l’inscription à la newsletter – légalement interdit en France) ;
  • Simplifier la présentation de la page : réduire au maximum le nombre de mots utilisés, donner l’impact aux boutons d’actions, opter pour une présentation où l’ensemble des contenus sera visible en un clin d’œil sans scroller. L’utilisateur doit sentir que la complétion de formulaire sur votre site sera quelque chose d’aisé et rapide ;
  • Accélérer la complétion du formulaire en ne masquant jamais les libellés et en les plaçant au dessus des champs. Préférer une mise en page avec un champ par ligne plutôt qu’un formulaire sur plusieurs colonnes (cf Uxmovement) ;
  • Tenter au maximum de remplacer les listes déroulantes par des composants à l’utilisation plus confortable (cf lukew.com) ;
  • Opter pour l’option “afficher” le mot de passe plutôt qu’un champ de confirmation de ce mot de passe (cf ici et )  ;
  • Pré-remplir dynamiquement le formulaire autant que possible (ex : pré-remplir la ville et le pays lorsque le champ « code postal » a été renseigné) ;
  • Indiquer les contraintes de sécurité de mot de passe à la volée plutôt qu’en tant qu’erreur ;
  • Être clair dans les erreurs de formulaire : si l’email n’est pas rattaché à un compte, remonter l’information / mettre en valeur les champs comprenant les erreurs ;

Pour résumer, donnez la possibilité à vos utilisateurs de compléter cette étape plus confortablement, plus rapidement et évitez les points qui pourraient faire naître toute question dans leurs esprits (un utilisateur qui se pose une question est un utilisateur à moitié parti).

L’option « commande d’invité »

La solution la plus efficace pour limiter ces fuites est sans concession la suppression définitive de la barrière, pour rediriger l’utilisateur directement dans le checkout après la validation de son panier. Une étude récente montre que 14% d’abandons de panier sont dus au fait que le site ne propose pas d’achat sans création de compte (cf viuz.com).

En 2011, ASOS a réduit de 50% les abandons dans le checkout en proposant l’option de commande d’invité (voir le case study sur econsultancy). Une autre étude plus globale d’User Interface Engineering a démontré que supprimer la phase de création obligatoire d’un compte permettait d’augmenter de 45 % le taux de conversion de certains e-​​commerçants.

L’idée est de respecter la lecture linéaire de l’utilisateur pendant le process de commande. L’utilisateur valide son panier, saisit ses coordonnées puis procède au paiement.  Une fois la commande payée, l’utilisateur sera plus disponible pour créer un compte sur votre site. L’étape de validation de paiement (ressentie comme l’aboutissement de la commande par l’utilisateur) semble donc être la plus adéquate pour lui proposer cette option. Présenté à ce moment, le formulaire sera également bien plus léger, puisque vous avez déjà récolté la plupart des informations concernant l’utilisateur lors du checkout.

Attention néanmoins aux utilisateurs ayant déjà un compte sur votre site et étant désireux de s’y connecter pour gagner du temps. Ces utilisateurs doivent pouvoir se connecter très facilement en amont. Cependant, dédier une page spécifique à cette option reviendrait à créer une nouvelle barrière dans le process de commande. Pourquoi donc ne pas proposer l’option en haut de votre page de checkout ?

La connexion via les réseaux sociaux

Les réseaux sociaux prennent une place toujours plus importante dans notre vie de tous les jours. Ils sont également un moyen efficace pour développer la visibilité de votre marque sur le web. Cette option a également plusieurs avantages pour simplifier la barrière de login :

  • la complétion du formulaire est évitée (remplacée par un simple clic), permettant un gain d’effort et de temps conséquent ;
  • les identifiants de connexion ne seront pas oubliés par l’utilisateur dans le futur.

Attention néanmoins à :

  • ne pas présenter un panel trop important d’options de connexion via les réseaux sociaux, afin d’éviter une surcharge visuelle de votre formulaire ;
  • permettre dans tous les cas une connexion “classique” avec l’adresse email pour les utilisateurs réfractaires à ce type de connexion.

Comme le montrent les dernières statistiques de Gigya, Facebook et Google+ sont les moyens de connexion par réseaux sociaux les plus utilisés par les internautes. La proposition unique de ces deux options semble donc être un bon compromis.

Source : Gigya. Lire également cet article de Patrick Salyer sur le sujet.

Note : comme dit dans le point précédent, Asos a très longtemps été cité comme exemple pour son checkout proposant la commande d’invité. Très récemment, cette option a été supprimée pour mettre en avant la connexion par réseaux sociaux. Ce choix est aujourd’hui très discuté, et les raisons de cette évolution (ou rétrogradation) restent floues… A suivre, donc. (voir cet article)

Exemples de méthodes appliquées pour réduire le taux d’abandon

Voici 3 exemples de sites e-commerce destinés à un public large ayant fait chacun des choix différents pour résoudre la barrière de login (les exemples se basent sur la version mobile des sites, où la barrière est d’autant plus problématique) :

Sarenza

sarenza

Sarenza a opté pour l’optimisation de son formulaire dans un process classique. Les options de création de compte et de connexion sont rassemblées au sein d’un même bloc, avec un seul champ « email » dans le but de simplifier la page.

Virginmobile a poussé cette pratique encore un peu plus loin en détectant si l’adresse email renseignée est liée à un compte client ou non, et redirige vers la page adéquate.

Airbnb

airbnb

Nous pouvons remarquer l’insistance d’Airbnb pour que l’utilisateur s’identifie via les réseaux sociaux.

Nike

nike

Depuis la page panier, 3 options sont possibles : la connexion à son compte, la commande d’invité ou le paiement Paypal. La création de compte est proposée à la fin du checkout, après la confirmation de commande, étape à laquelle l’utilisateur est plus apte à créer un compte. Pour l’avoir vécue personnellement, l’expérience proposée par Nike est très qualitative (parce que rapide, confortable), et le souvenir conservé très positif.

On remarquera une expérience différente sur le même site dans sa version pour ordinateur de bureau :

nike-2

La barrière de login est ici présente, mais propose des options pour simplifier le checkout, dont la commande d’invité. On notera l’option « devenir membre Nike au moment du paiement », qui ne sera proposée qu’une seule fois à cet endroit (si elle n’est pas cochée, la possibilité de création de compte à la fin du checkout ne sera pas disponible).

On pourra se demander pourquoi Nike n’a pas simplifié et harmonisé son expérience client en étendant l’expérience mobile, simple et efficace, au desktop.

D’autres exemples de commande en tant qu’invité : Apple, Crate&Barrel, Disney Store, Camper, Zara

Conclusion

Parmi les solutions proposées dans cet article pour réduire les fuites dues à la barrière de login, la commande d’invité est de loin la plus efficace, puisqu’elle supprime totalement la barrière. Cette méthode, également, a fait ses preuves et il est difficile aujourd’hui de trouver des discours allant à son encontre. Elle reste aussi la plus complexe à mettre en place, autant du point de vue de la conception que du développement.

Attention néanmoins, la commande d’invité est parfaitement adaptée aux sites axés sur l’achat impulsif. Si votre site présente une gamme de produits qui requiert une attention plus particulière, cette technique semble peu adaptée.

Dans tous les cas, quelle que soit la méthode choisie pour la minimiser, la problématique de la barrière de login mérite une réflexion toute particulière et son optimisation aura un effet immédiat sur votre taux de transformation.

À propos du problème de la barrière de login dans le checkout

Partager l'article :

Vous souhaitez réagir ?

En soumettant ce commentaire vous donnez à Silicon Salad le droit de citer vos propos ainsi que votre nom/site. Tous commentaires dégradants ou hors-sujet peuvent-être supprimés par décision de l’auteur. Votre e-mail, ne sert qu’à des fins d’authentification, il ne peut-être ni partagé ni diffusé.
Vous pouvez commenter avec la syntaxe Markdown. En savoir plus

Article précédent
Parlons des Web Fonts !