De l’intérêt de soigner votre page de paiement

En cette période de Noël, le commerce en ligne n’a jamais aussi bien marché en France. Et pourtant… la plupart des boutiques en ligne proposent une expérience d’achat massacrée par la page de paiement, ou plus précisément par la page de saisie de la carte bancaire.

Illustration avec Archiduchesse, une boutique particulièrement soignée jusqu’à son tunnel de transformation et la page de sélection du moyen de paiement :

La page de sélection du type de carte bancaire chez Archiduchesse

Vous choisissez un type de carte bancaire… et là c’est la catastrophe :

La page de saisie de la carte bancaire chez Archiduchesse

Une page en complète rupture avec la charte graphique / ergonomique du site :

  • un fond de page beige sale (pourquoi ne pas utiliser des logos avec un fond transparent ?) ;
  • une typographie anachronique (qu’est-ce que ça leur coûte d’utiliser de l’Arial ?) ;
  • une organisation chaotique (le champ de saisie des trois chiffres positionné dans le coin du double cadre est invisible) ;
  • une hiérarchie visuelle incohérente (pourquoi le bouton d’annulation est-il trois fois plus gros que celui de confirmation ? Pourquoi ce même bouton est positionné sous un page break ?)

J’imagine qu’il y a d’innombrables contraintes de sécurité (un argument bien pratique pour celui qui n’a pas envie de se casser la tête), mais nous parlons bien ici d’une ignominie. Ce qui me met en rogne (en tant que professionnel mais également en tant qu’acheteur) c’est qu’il n’y aurait absolument aucun impact à revoir l’organisation et la mise en forme de cette page.

J’imagine que les informaticiens en charge de la maintenance de cette page doivent se conformer à la célèbre maxime « Si ce n’est pas cassé, pourquoi le changer ?« . Pour augmenter le taux de transformation bien sûr ! En provoquant une rupture complète dans l’expérience d’achat, vous mettez le doute dans la tête des acheteurs (« Suis-je toujours sur le bon site ?« , « Où est passé ma commande ?« …). Ceci est d’autant plus dommageable que la saisie de ses numéros de carte bancaire est une étape anxiogène.

Autre exemple encore pire chez Rue du Commerce où la page de confirmation n’est déjà pas terrible (il faut cocher les deux cases d’acceptation des CGV dans le cadre invisible en bas de page) :

La page de choix du mode de paiement sur Rue du Commerce

Une fois cliqué sur le type de carte bancaire que vous souhaitez, on retrouve une page légèrement différente du premier exemple, mais tout aussi déroutante :

Saisie de votre numéro de carte bancaire chez Rue du Commerce

Un effort a visiblement été fait pour améliorer la mise en page et la lisibilité (quoique le contraste est trop fort) sur cette page. Par contre vous remarquerez qu’ils ont inséré l’ancien bandeau de navigation dans le haut de page. Non seulement ce bandeau n’a rien à faire sur cet écran (où l’attention doit être focalisée sur la saisie des numéros) mais en plus les onglets ne sont pas cliquables ! J’imagine que les informaticiens qui ont conçu la page étaient très fiers de pouvoir afficher en haut de page la mention « Cryptage SSL » en rouge, mais peut-être devrait-on leur expliquer que le jargon technique ne rassure personne s’il n’est pas expliqué quelque part…

Pourtant il est tout à fait possible de proposer une expérience d’achat cohérente comme sur le site de la Fnacla saisie des numéros de carte est directement intégrée à la page de récapitulatif :

La page de saisie des numéros de carte sur le site de la Fnac

Je ne suis pas le mieux placé pour vous expliquer en détail les impacts techniques et financiers de la mise en oeuvre d’une telle solution, mais du point de vue des clients (le seul qui compte réellement), l’expérience est nettement plus agréable.

Je milite donc pour convaincre les opérateurs de paiement en ligne de faire un effort de présentation. Et je vous engage à faire de même !

49 commentaires sur “De l’intérêt de soigner votre page de paiement

  1. Disclaimer: je ne suis actionnaire ni de la BPCA, ni de Lyra Network, juste client :)

    La Banque Populaire a remplacé ATOS par SytemPay, édité par Lyra Network.

    Voici l’interface de paiement proposée au client: http://twitpic.com/4qnv6i

    Je trouve ça déjà nettement plus propre, mais ça garde le « look bancaire » quelque part rassurant car connu du consommateur, tout le monde n’est effectivement pas la FNAC comme le disait quelqu’un plus haut.

    Le gros avantage est aussi que la solution implémente un retour automatique que vous pouvez régler sur instantané, assurant une parfaite remontée de vos conversions vers Analytics, et la possibilité d’avoir une page de confirmation de commande soignée sur votre propre site.

    Belle interface sur le back-office commerçant également.

    Si vous êtes dans le 06 ou le 83, demandez à votre agence BPCA d’appeler M. Sevin ou M. Coscat du service Qualité Systèmes Clients de ma part (David Niry, Business Tech). Ils sont sympas en plus et sont flexibles sur le 3D Secure si vous n’avez pas une activité jugée risquée au niveau fraude comme le luxe ou l’électronique. Il vous faudra juste signer une décharge comme quoi c’est pour votre pomme en cas de fraude.

  2. Bonjour,
    La page de paiement d’Ogone est personnalisable partiellement (logo, police, couleur de fond) ou completement avec une css depuis plus de 5 ans, en integration standard ou iframe (cf teleshopping ou fnac.be par ex.).
    Je confirme que peu de responsables marketing sont sensibilisés sur ce sujet.

    Bon, pour être transparent, moi, j ai des interets chez ogone ;)

  3. J’ai dans le cadre d’un récent projet été amené à travailler avec la plateforme PAYBOX http://www.paybox.com et j’ai découvert qu’il était possible de très très largement personnaliser la page de paiement.
    – css feuille de style
    – bouton Valider et minimiser le boutons Annuler
    – taille, typé couleur de police
    – 10 langues disponibles
    – forçage du type de moyen de paiement à l’appel vers Paybox (utile si le site accepte aussi PayPaĺ Buysteŕ Oney,… En plus de VisaMastercard)
    – Et enfin paramétrer un « retour immédiat » sur le site après paiement pour que ce soit moi qui remercie l’acheteur de son achat ou bien lui propose un moyens de paiement alternatif en cas de paiement refuse.

    Franchement je ne m’était jamais penché sur le sujets mais la j’ai été satisfait.

  4. Merci pour cet article, mais les petites boutiques n’utilisent bien souvent que le mode de paiement via paypal qui permet de personnaliser sa page de paiement, mais l’optimisation reste modeste.
    personnellement, faisant appel à une boutique en ligne clé en main, je n’ai pas les moyens techniques de développer une page de paiement, je me contente donc de ce que m’offre paypal.

Laisser un commentaire

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