Le Site de la Semaine – « Route64 Le Mag »

Aux échecs, une partie se perd rarement sur un coup génial de l’adversaire. Elle se perd sur une petite imprécision, au quinzième coup, que l’on n’a pas vue venir. Une boutique en ligne, c’est pareil : le client a choisi, il a cliqué sur « Ajouter au panier »… et c’est entre le panier et la confirmation que la partie se joue. C’est là que beaucoup de ventes s’évaporent.

Route64 Le Mag, la revue consacrée à l’univers des échecs, a confié à Graph’in ! la réalisation de sa plateforme e-commerce. La plateforme est en ligne à cette adresse : route64-lemag.fr. Commerçants, clubs sportifs, artisans, associations… à chacun sa vitrine numérique, disait la première version de cet article. Cette fois, nous ouvrons l’échiquier côté coulisses : comment Graph’in ! conçoit le parcours de commande d’un site marchand, case par case, pour que le client aille jusqu’au mat (le bon, celui où il paie).

L’ouverture : du produit au panier

Tout commence sur la fiche produit, par un bouton. Il doit être visible sans chercher, porter un verbe d’action sans ambiguïté (« Ajouter au panier », « Commander ») et réagir tout de suite quand on le touche. Le client a besoin d’un signe que son geste a été pris en compte : un petit compteur qui s’incrémente sur l’icône du panier, un message bref, un panneau latéral qui s’ouvre. Sans ce retour, il clique deux fois… et se retrouve avec deux exemplaires.

Pour une revue, une question se pose dès cette étape : vend-on des numéros à l’unité, des abonnements, ou les deux ? Les deux logiques ne s’affichent pas de la même manière. Un numéro se présente comme un produit classique, avec sa couverture et son sommaire. Un abonnement demande d’expliquer la durée, le nombre de numéros, le moment où il démarre. Mélanger les deux sans hiérarchie, c’est semer le doute.

Le milieu de partie : un panier qui rassure

Le panier est une pièce de transition. Le client y vérifie ce qu’il a choisi, et c’est souvent là qu’il découvre le prix total. Nous y faisons apparaître, très lisiblement :

• la liste des articles avec leur image, leur quantité modifiable et leur prix ;
• les frais de livraison, ou au moins une estimation, avant de demander quoi que ce soit au client ;
• le total final, toutes taxes comprises ;
• un bouton principal pour continuer vers le paiement, et un lien plus discret pour reprendre ses achats.

Les frais de port découverts au dernier moment sont l’une des premières raisons d’abandon de panier citées par les acheteurs en ligne. Le client a l’impression d’avoir été attiré par un prix, puis piégé par un autre. Annoncer la couleur tôt (sur la fiche produit, dans le panier, dans une page dédiée à la livraison) coûte moins cher qu’un panier abandonné.

Le code promo, ce fou qui part en diagonale

Un champ « Code promo » très visible dans le panier a un effet secondaire connu : le client qui n’a pas de code quitte la page pour en chercher un sur internet… et ne revient pas toujours. Quand une boutique n’utilise les codes qu’à l’occasion, nous préférons un simple lien « Vous avez un code ? » qui déplie le champ à la demande.

La finale : un formulaire qui ne fait pas fuir

La page de commande est le moment le plus délicat. Le client doit saisir son adresse, son courriel, parfois créer un compte, puis payer. Chaque champ de trop est une occasion de renoncer.

Commander sans créer de compte

Obliger à créer un compte pour un premier achat fait partir une partie des clients. Nous activons la commande en tant qu’invité, et nous proposons la création de compte comme une option, de préférence après le paiement : « Voulez-vous garder vos informations pour la prochaine fois ? ». Le client qui revient souvent créera son compte de lui-même.

Le minimum de champs, le maximum d’aide

Nous retirons les champs inutiles (un deuxième numéro de téléphone, une société pour un particulier, une date de naissance que personne n’utilise). Les champs restants sont adaptés au mobile : clavier numérique pour le code postal et le téléphone, clavier avec arobase pour le courriel, remplissage automatique de l’adresse par le navigateur. Les erreurs sont signalées au moment où elles se produisent, à côté du champ concerné, avec une phrase qui explique comment corriger. « Champ invalide » n’aide personne.

Payer en confiance

Le paiement passe par un prestataire reconnu (Stripe, PayPal ou la solution de la banque du commerçant, selon les cas). Les données de carte bancaire ne transitent jamais par le site lui-même : elles sont saisies dans un module sécurisé du prestataire. Le client voit les logos des moyens de paiement acceptés, le cadenas du navigateur, et le récapitulatif de sa commande juste au-dessus du bouton final. Ce bouton dit ce qu’il fait : « Payer » ou « Valider et payer », pas « Suivant ».

La livraison, un coup qui se prépare à l’avance

Le choix du mode de livraison arrive en fin de parcours, mais il se décide bien avant la mise en ligne. Quels transporteurs ? Lettre suivie, colis, point relais, retrait sur place ? Quels tarifs selon le poids et la destination ? Une revue, par exemple, se glisse dans une enveloppe ; un coffret de plusieurs numéros demande un colis. Chaque cas doit être prévu dans les réglages de la boutique, faute de quoi le client voit apparaître un tarif absurde, ou pire, aucun tarif du tout.

Nous recommandons de limiter le choix à deux ou trois options lisibles, chacune avec son prix et son délai indicatif. Le retrait sur place, quand il est possible, mérite d’être proposé : pour un commerce ou une association de Loire-Atlantique, c’est souvent l’option préférée des clients du coin, et l’occasion d’une vraie rencontre. Les envois vers l’étranger, enfin, se paramètrent à part, avec leurs propres tarifs, ou se désactivent tout simplement si l’on ne souhaite pas les gérer.

Le panier abandonné n’est pas une partie perdue

Malgré tout ce soin, certains clients s’arrêtent en route : un appel, une réunion, un enfant qui réclame son goûter. Lorsque le client a déjà saisi son adresse électronique et accepté d’être recontacté, un courriel de rappel envoyé quelques heures plus tard peut le ramener à son panier. Ce message reste sobre : le rappel des articles, un lien direct vers la commande, éventuellement une réponse aux questions fréquentes sur la livraison. Pas de harcèlement, un seul rappel suffit. Ce réglage demande de respecter les règles du consentement ; nous le mettons en place seulement quand le cadre est clair.

Après le mat : la confirmation et le suivi

La partie ne s’arrête pas au paiement. La page de confirmation rassure (« Votre commande est enregistrée ») et donne le numéro de commande. Le courriel de confirmation arrive dans la minute, avec le récapitulatif, l’adresse de livraison et un moyen de contacter la boutique. Ces courriels automatiques sont souvent laissés dans leur version par défaut, en anglais approximatif ou sans logo. Nous les personnalisons aux couleurs du client : c’est le premier message de la marque qui arrive dans la boîte de réception de son nouveau client.

Viennent ensuite les messages d’expédition, de livraison, et éventuellement une invitation à laisser un avis. Chaque étape doit être prévisible. Un client qui sait où en est son colis n’écrit pas pour demander où en est son colis… et le commerçant gagne du temps.

Les coulisses : sécurité, lois et maintenance

Un site marchand manipule des données personnelles et des paiements. Il est donc une cible plus tentante qu’un simple site vitrine. Nous construisons nos boutiques sur WordPress et WooCommerce, avec un certificat de sécurité, des sauvegardes régulières et des mises à jour suivies. Le studio a développé ses propres extensions WordPress pour la sécurité, la gestion des cookies et le référencement, ce qui évite de dépendre d’abonnements annuels et de modules tiers qui se marchent dessus.

La loi impose aussi ses règles du jeu : conditions générales de vente accessibles, mentions légales, information sur le droit de rétractation, politique de confidentialité, consentement aux cookies. Nous prévoyons les pages et les emplacements nécessaires ; le contenu juridique lui-même relève du commerçant et, si besoin, de son conseil.

Enfin, une boutique se surveille. Les extensions évoluent, les prestataires de paiement changent leurs exigences, les navigateurs aussi. La maintenance consiste à appliquer les mises à jour, vérifier que le parcours de commande fonctionne toujours (nous passons régulièrement une commande test) et corriger avant que les clients ne s’en aperçoivent. Nous avons consacré l’article sur le site de Theoxis à cette vie après la mise en ligne.

Tester comme un joueur qui analyse sa partie

Avant d’ouvrir une boutique, nous jouons la partie nous-mêmes, plusieurs fois, sur ordinateur et sur téléphone. Commande en invité, commande avec compte, code promo, paiement refusé, retour en arrière, modification du panier en cours de route… Chaque cas doit aboutir à une situation claire pour le client. Nous demandons aussi à quelqu’un qui ne connaît pas le site de passer une commande sous nos yeux, sans aide. C’est souvent la séance la plus instructive : là où il hésite, le futur client hésitera aussi.

Après le lancement, les statistiques du site montrent à quelle étape les visiteurs abandonnent. Un taux d’abandon anormal sur une page précise est un signal : un champ qui bloque, un mode de livraison mal expliqué, un bug sur un certain navigateur. On corrige, on mesure de nouveau. Comme aux échecs, on progresse en revoyant ses parties.

La fiche produit, elle, a son propre article : nous l’avons traitée à propos de la boutique des Bidouilles de Mémé.

Les cases oubliées de l’échiquier

Il existe des pages que personne ne dessine, parce qu’on espère que personne ne les verra. La page d’erreur, quand un lien ne mène plus nulle part. Le panier vide. Le produit en rupture. Pourtant, chaque boutique finit par les montrer un jour, et souvent à un client qui était prêt à acheter. Une page d’erreur bien pensée propose un champ de recherche et renvoie vers les rayons principaux. Un panier vide suggère quelques produits (sans insister). Un article épuisé indique s’il reviendra et propose de prévenir le client par mail. Rien de spectaculaire… mais c’est toute la différence entre une pièce perdue et une pièce qui revient en jeu.

À vous de jouer

Revue, club, artisan, association, commerce de proximité : si vous voulez vendre en ligne sans perdre vos clients en route, Graph’in ! conçoit votre plateforme e-commerce de la première case à la dernière, à Nantes, à Ancenis et à distance partout en France. Découvrez notre offre Web & réseaux sociaux, jetez un œil à nos réalisations, puis contactez-nous pour créer ensemble le site qui correspond à vos attentes.

Levez l’encre !

Vos questions, nos réponses