Shopify et Vercel reconstruisent Hydrogen comme une base ouverte et agnostique au runtime. Hydrogen …
UX de la promesse de livraison sur la PDP
La question la plus souvent sans réponse sur une page produit n'est pas le prix. Tout le monde le voit. C'est celle-ci : quand est-ce que ce produit sera chez moi, et combien coûte la livraison ? Qui n'y répond qu'au checkout perd déjà des acheteurs sur la PDP. Cet article présente les patterns de promesse de livraison qui convertissent sur la page produit, les anti-patterns qui coûtent de la confiance, et la façon de construire les uns et les autres en conformité avec la loi sur l'accessibilité.
Pourquoi la question de la livraison a sa place sur la PDP, pas dans le checkout
La page produit est le moment où se forme l'intention d'achat. C'est exactement là que se joue le passage de l'intérêt au panier. Si la date de livraison et les frais de port n'apparaissent que deux étapes plus loin, l'une de ces deux choses se produit : l'acheteur fait lui-même l'estimation (souvent de façon trop pessimiste) ou avance à moitié dans le checkout uniquement pour obtenir l'information, puis part déçu.
Les deux cas sont évitables. L'information de livraison pèse sur la décision d'achat, elle a donc sa place là où la décision d'achat se prend. Ce n'est pas une question de goût, c'est une logique de tunnel de conversion.
Les quatre patterns de promesse de livraison
1. Une date de livraison concrète plutôt qu'une fourchette d'expédition
La version faible, c'est la mention générique : « Livraison sous 2 à 4 jours ouvrés ». Elle oblige l'acheteur à faire le calcul et laisse une incertitude. La version forte, c'est la promesse concrète, datée : « Commandez aujourd'hui, livré mercredi ». La plateforme connaît la date du jour, l'heure limite de commande et le délai d'expédition : elle peut donc calculer la date au lieu de laisser l'acheteur s'en charger.
L'effet est direct : une date concrète est une promesse, une fourchette est une estimation. Les promesses convertissent mieux.
2. Un compte à rebours cut-off avec une urgence bien réelle
Le compte à rebours jusqu'à l'heure limite est l'un des rares patterns d'urgence qui ne paraît pas manipulateur, parce qu'il est vrai : « Il reste 3 heures 12 minutes pour une expédition aujourd'hui ». Il informe sur une limite réelle au lieu de fabriquer une pression de rareté artificielle.
Ce qui compte, c'est l'honnêteté du chiffre. Un compte à rebours qui se réinitialise au rechargement, ou une heure limite erronée, détruit précisément la confiance qu'une bonne date de livraison construit.
3. La transparence des frais de port avant le panier
Des frais de port qui n'apparaissent qu'à la dernière étape du checkout sont un grand classique des motifs d'abandon de panier. Sur la PDP, il faut au minimum afficher ceci : le montant des frais de port ou le seuil de livraison offerte (« Encore 12 euros pour la livraison offerte »). La mention du seuil a un double effet : elle crée de la transparence et une incitation douce vers un panier plus élevé, sans pression.
4. Des signaux de disponibilité qui ont du fond
« En stock » est une affirmation faible si elle ne dit rien de sa conséquence. Les signaux forts sont liés à la date de livraison : « En stock, expédié sous 24 heures » ou « Plus que 4 exemplaires, chez vous mercredi si vous commandez aujourd'hui ». Le signal de disponibilité ne porte que s'il est honnête et cohérent avec la promesse de livraison.
Les anti-patterns qui coûtent de la confiance
Anti-pattern | Pourquoi cela nuit | Mieux |
|---|---|---|
Frais de port uniquement au checkout | premier motif d'abandon de panier | frais de port ou seuil de gratuité sur la PDP |
Faux compte à rebours qui se réinitialise | détruit la confiance au rechargement | cut-off réel, ancré côté serveur |
« Livraison sous 2 à 4 jours » sans date | oblige l'acheteur à estimer | date de livraison concrète et calculée |
Disponibilité sans conséquence | « en stock » ne dit rien du délai | disponibilité et heure d'expédition |
Info de livraison uniquement en tooltip | souvent invisible sur mobile et pour les lecteurs d'écran | comme contenu visible dans le DOM |
Construire conforme : ce que l'accessibilité signifie concrètement ici
Avec la loi sur l'accessibilité en vigueur, l'UX de la promesse de livraison n'est plus un sujet purement de conversion, c'est aussi une question de conformité. La bonne nouvelle : ici, une implémentation accessible et une bonne UX de conversion vont dans le même sens.
- Le compte à rebours ne doit pas être uniquement visuel. Un minuteur qui se met à jour doit être annoncé de façon pertinente aux lecteurs d'écran, généralement via une live region sobre qui ne lit pas chaque seconde mais à intervalles raisonnables. Un compte à rebours purement visuel est invisible pour les utilisateurs de lecteurs d'écran.
- L'information ne doit pas passer par la seule couleur. « Vert signifie disponible » ne suffit pas. La disponibilité et la date de livraison ont besoin de texte, pas seulement d'un signal coloré.
- L'info de livraison doit être un vrai contenu. Ce qui n'apparaît qu'en tooltip ou au survol est souvent inaccessible sur les appareils tactiles et en navigation clavier. L'information de livraison a sa place dans la page, sous forme de contenu visible et focalisable.
- Contraste et taille de police. Le compte à rebours cut-off et les frais de port pèsent sur la décision d'achat : ils ne doivent pas disparaître en tout petit gris au bord de la page.
La conformité en accessibilité n'est pas un frein ici, c'est un affûtage. Ce qui fonctionne pour les lecteurs d'écran et le clavier fonctionne aussi pour l'acheteur pressé, sur son téléphone, dans le train.
Pourquoi ces patterns appartiennent à la couche frontend
Une UX de promesse de livraison propre puise ses données à plusieurs sources : le niveau de stock côté backend, l'heure limite et le délai d'expédition depuis la configuration logistique, la date du jour depuis le runtime. Cette composition est un travail de frontend, et elle ne devrait pas être reconstruite séparément dans chaque thème.
Dans le Composable Visual Page Builder, la promesse de livraison est un bloc composable que l'équipe définit une seule fois et qui s'affiche de manière cohérente sur chaque PDP, exigences d'accessibilité comprises, en tant que propriété du composant plutôt qu'en retouche manuelle. Que cette information reste rapide à s'afficher dépend de la performance de la couche frontend: une date de livraison qui n'apparaît qu'au bout de trois secondes arrive trop tard.
Nous avons poursuivi cette série de patterns UX en dernier lieu avec les patterns de sélection de variantes sur la PDP et, avant cela, avec l'UX des états vides au service de la conversion. La promesse de livraison est la pièce suivante du même tableau : de petites décisions précises sur la PDP qui, additionnées, portent la conversion.
FAQ
Ai-je besoin d'une intégration de stock parfaite pour afficher une date de livraison concrète ?
Utile, oui ; indispensable, non. Même avec la seule heure limite et le délai d'expédition, vous pouvez calculer une date fiable pour les articles en stock. Les données de stock en temps réel rendent l'affirmation plus précise, mais elles ne sont pas obligatoires pour une première étape.
Un compte à rebours ne devient-il pas vite manipulateur ?
Uniquement s'il est faux. Un compte à rebours cut-off reflète une limite d'expédition réelle. Tant que le chiffre est vrai et se comporte correctement au rechargement, il informe au lieu de mettre la pression. Les minuteurs de rareté artificielle sont un autre pattern, bien pire.
L'implémentation accessible n'est-elle pas un effort supplémentaire ?
Si la promesse de livraison est un bloc de composant réutilisable, l'accessibilité est traitée une seule fois et s'applique partout. L'effort n'apparaît que lorsque chaque page reconstruit le pattern à la main.
Prochaines étapes
Si vous souhaitez auditer votre PDP sur les patterns de promesse de livraison et les construire sous forme de bloc réutilisable et conforme en accessibilité : réservez une démo. Nous parcourons votre page produit et vous montrons à quoi ressemblent la date de livraison, le cut-off et les frais de port sous forme de brique composable.
Plus de contenus de la plateforme Laioutr
En savoir plus sur Laioutr : B2C Growth Kit.