Checklist fiche produit : ce qui freine l’achat en ligne

Checklist fiche produit d’après Baymard et WebAIM : prix, livraison et retours, photos, avis, ajout au panier sur mobile, pop-ups, recherche, clavier.

Rédaction FixReports14 min de lecture

Sur une fiche produit, les acheteurs renoncent le plus souvent lorsqu’ils ne parviennent pas à connaître le coût total, ne trouvent pas les conditions de livraison et de retour, ne peuvent pas juger le produit d’après ses photos et ses avis, ou n’accèdent pas facilement au bouton d’achat, en particulier sur mobile. Les pop-ups qui recouvrent la page, les pages de politique difficiles à trouver, une recherche interne incapable de répondre à des questions simples et des commandes inutilisables au clavier bloquent aussi les achats. Les chiffres ci-dessous sont issus d’études sectorielles de Baymard Institute et de WebAIM, menées sur de vastes échantillons de sites et d’acheteurs ; ils décrivent des tendances courantes, et non des prévisions pour une boutique en particulier.

Points clés

  • Dans l’enquête 2026 de Baymard menée auprès de 1 083 adultes américains ayant acheté en ligne au cours des trois derniers mois, 40 % déclarent avoir abandonné un achat au moment du paiement parce que les coûts supplémentaires, comme la livraison, les taxes et les frais, étaient trop élevés (Baymard Institute (s’ouvre dans un nouvel onglet)).
  • Le benchmark des fiches produit de Baymard a montré que 67 % des grands sites e-commerce ne donnent aucune estimation du coût total près de la zone d’achat, et que 44 % n’affichent pas la politique de retour et n’y renvoient pas depuis le contenu principal du produit (Baymard Institute (s’ouvre dans un nouvel onglet), mis à jour le 18 mars 2026).
  • Dans ce même benchmark, 62 % des sites mobiles offraient une UX de fiche produit « médiocre » ou pire.
  • WebAIM a détecté des non-conformités WCAG sur 95,9 % des pages d’accueil du million de sites les plus visités en février 2026 (WebAIM (s’ouvre dans un nouvel onglet)).
  • Dans une étude Baymard de 2021 portant sur 33 sites e-commerce parmi ceux qui réalisent le plus gros chiffre d’affaires, 45 % comportaient des fonctionnalités impossibles à utiliser au clavier (Baymard Institute (s’ouvre dans un nouvel onglet)).

Pourquoi les acheteurs abandonnent-ils un achat ?

La réponse la plus fréquente est que les acheteurs ne faisaient que regarder ; viennent ensuite les coûts supplémentaires, la lenteur de la livraison, le manque de confiance dans le traitement des données de carte bancaire et la création de compte obligatoire.

La page de Baymard consacrée à l’abandon de panier situe le taux d’abandon moyen documenté à 70,22 %, calculé à partir de 50 études (page mise à jour le 22 septembre 2025). Son graphique des motifs, présenté comme des données 2026, provient d’une enquête menée auprès de 1 083 adultes américains ayant acheté en ligne au cours des trois mois précédents. Les répondants pouvaient choisir plusieurs motifs (Baymard Institute (s’ouvre dans un nouvel onglet), en octobre 2026) :

Motif d’abandon d’un achat en ligne au moment du paiementPart des répondants
Je ne faisais que regarder / je n’étais pas prêt à acheter42 %
Coûts supplémentaires trop élevés (livraison, taxes, frais)40 %
La livraison était trop lente20 %
Je ne faisais pas confiance au site pour mes données de carte bancaire19 %
Le site voulait que je crée un compte18 %
Processus de paiement trop long ou trop compliqué17 %
Le site présentait des erreurs ou a planté17 %
La politique de retour n’était pas satisfaisante13 %
Je ne pouvais pas voir ni calculer le coût total de la commande à l’avance12 %
La carte bancaire a été refusée10 %
Il n’y avait pas assez de moyens de paiement9 %

Ce sont des résultats d’enquête américains portant sur le paiement, et non des mesures de votre boutique. Plusieurs de ces motifs apparaissent plus tôt, sur la fiche produit, là où les acheteurs découvrent le prix, les conditions de livraison et les conditions de retour. Seules vos propres statistiques peuvent montrer lesquels comptent pour vous.

Le prix complet est-il clair sur la fiche produit ?

Le prix actuel, l’éventuel prix d’origine, ce qui est inclus ou non, et une estimation des frais de livraison doivent tous se trouver à côté du bouton d’achat.

Le benchmark 2026 des fiches produit de Baymard a montré que 67 % des sites ne fournissent aucune estimation du « coût total de la commande » près de la zone d’achat, et que 81 % n’affichent pas de prix unitaire pour les produits vendus en différentes quantités ou tailles (Baymard Institute (s’ouvre dans un nouvel onglet)). Vérifiez que la page affiche :

  • Le prix actuel et, pour les articles en promotion, le prix d’origine.
  • Un prix unitaire pour les produits vendus en plusieurs formats.
  • Si les taxes ou les droits de douane sont inclus.
  • Les frais de livraison, ou le montant de commande à partir duquel la livraison est offerte.

Shopify : dans le thème Dawn, le bloc de prix ajoute la mention « Taxes included. » (taxes incluses) et un lien « Shipping calculated at checkout. » (frais d’expédition calculés lors du paiement) lorsque ces paramètres et une politique d’expédition existent (source de Dawn (s’ouvre dans un nouvel onglet)). C’est exact, mais ce n’est pas une estimation : ajoutez donc vos tarifs réels ou votre seuil de livraison gratuite dans un bloc de texte.

WooCommerce : les options qui activent le calculateur de frais de livraison sur la page panier et qui masquent les frais de livraison jusqu’à la saisie d’une adresse, sous WooCommerce > Settings > Shipping (WooCommerce > Réglages > Expédition si votre interface est en français), concernent le panier et le paiement, pas la fiche produit (source de WooCommerce (s’ouvre dans un nouvel onglet)). Indiquez vos tarifs dans le modèle de produit ou dans la description courte.

Les acheteurs trouvent-ils les informations de livraison et de retour avant d’ajouter au panier ?

Placez près du bouton d’achat un court résumé du délai de livraison, des frais de livraison et du délai de retour, avec un lien vers la politique complète.

Dans l’enquête Consideration & Purchase Behavior de Baymard, menée auprès de 1 032 répondants, 60 % déclarent chercher les informations sur la politique de retour sur la fiche produit ; pourtant, 44 % des sites étudiés ne l’affichent pas et n’y renvoient pas depuis le contenu principal du produit (Baymard Institute (s’ouvre dans un nouvel onglet)). Dans l’enquête 2026 sur l’abandon citée plus haut, 20 % évoquent une livraison trop lente et 13 % une politique de retour insatisfaisante.

<details class="product-policy">
  <summary>Shipping and returns</summary>
  <p>Ships in 1 to 2 business days. Free shipping on orders over $75.</p>
  <p>Free returns within 30 days. <a href="{{ shop.refund_policy.url }}">Read the return policy</a></p>
</details>

Shopify : rédigez vos politiques sous Settings > Policies (Paramètres > Politiques si votre interface est en français) (centre d’aide Shopify (s’ouvre dans un nouvel onglet)). Dans Dawn, un bloc Collapsible row (ligne réductible) sur la fiche produit peut afficher du texte ou le contenu d’une page (source de Dawn (s’ouvre dans un nouvel onglet)) : une seule page livraison et retours peut ainsi apparaître sur tous les produits.

WooCommerce : WooCommerce crée une page « Refund and Returns Policy » (politique de remboursement et de retour) à l’état de brouillon (source de WooCommerce (s’ouvre dans un nouvel onglet)). Elle reste non publiée tant que vous ne l’avez pas modifiée et publiée.

Les photos produit répondent-elles aux questions des acheteurs ?

Les images doivent montrer le produit sous plusieurs angles, à l’échelle et en situation, car beaucoup d’acheteurs jugent la taille et la coupe d’après les photos plutôt que d’après les caractéristiques techniques.

Les tests de Baymard ont montré que 42 % des utilisateurs essaient de déduire la taille d’un produit à partir de ses images, alors que 37 % des sites étudiés ne proposent pas d’image « à l’échelle » montrant le produit à côté d’une personne ou d’un objet familier. Et 23 % ne proposent pas de photo portée par un mannequin, ce qui compte surtout pour les vêtements, les accessoires et les cosmétiques (Baymard Institute (s’ouvre dans un nouvel onglet)).

Vérifiez aussi que la galerie passe à la bonne image lorsqu’une couleur est choisie, que le zoom fonctionne sur mobile et que chaque image possède un texte alternatif décrivant ce que montre cette vue, par exemple « Chemise en lin, vue de dos ».

Les avis sont-ils faciles à trouver et inspirent-ils confiance ?

Affichez la note moyenne et le nombre d’avis près du titre du produit, avec un lien vers l’ensemble des avis, et répondez aux avis négatifs.

Baymard a constaté que 89 % des sites étudiés ne répondent pas aux avis négatifs, et que 63 % ne permettent pas aux acheteurs de passer des photos d’un auteur d’avis à celles du suivant (Baymard Institute (s’ouvre dans un nouvel onglet)). Les widgets d’avis qui se chargent tardivement peuvent aussi décaler la page vers le bas : réservez-leur de l’espace.

Shopify : le bloc Product rating (évaluation du produit) de Dawn affiche les étoiles d’une application d’avis, et le thème précise qu’une application est nécessaire (source de Dawn (s’ouvre dans un nouvel onglet)).

WooCommerce : sous WooCommerce > Settings > Products (WooCommerce > Réglages > Produits si votre interface est en français), les options d’avis permettent d’activer les avis produits, d’afficher le libellé « propriétaire vérifié » sur les avis clients, de réserver les avis aux « propriétaires vérifiés » et d’activer la notation par étoiles (source de WooCommerce (s’ouvre dans un nouvel onglet)).

Le bouton d’ajout au panier est-il facile à atteindre et à toucher sur mobile ?

Sur mobile, les acheteurs doivent pouvoir voir le prix, choisir une variante et toucher le bouton d’ajout au panier sans chercher, avec des commandes assez grandes pour être touchées sans erreur.

Dans le benchmark 2026 de Baymard, 52 % des sites sur ordinateur et 62 % des sites mobiles offraient une UX de fiche produit « médiocre » ou pire, et 57 % des sites n’utilisaient pas de boutons pour le choix de la taille, laissant les tailles cachées dans des listes déroulantes (Baymard Institute (s’ouvre dans un nouvel onglet)).

Ouvrez une fiche produit sur un vrai téléphone et vérifiez :

  • Premier écran. Dans une mise en page mobile empilée, la galerie vient souvent en premier : une image haute peut alors repousser le titre, le prix et le bouton sous le premier écran.
  • Barres d’achat fixes. Si vous en utilisez une, elle ne doit pas recouvrir les éléments ayant le focus. La synthèse du W3C sur le critère 2.4.11 des WCAG 2.2 (niveau AA) prend justement pour exemple un pied de page fixe qui masque les éléments ayant le focus (W3C (s’ouvre dans un nouvel onglet)).
  • Cibles tactiles. Le critère 2.5.8 des WCAG (niveau AA) fixe un minimum de 24 × 24 pixels CSS, avec des exceptions (W3C (s’ouvre dans un nouvel onglet)) ; les recommandations de Shopify pour les thèmes préconisent au moins 48 × 48 pixels sur mobile (Shopify (s’ouvre dans un nouvel onglet)).
  • Défilement horizontal. Le critère 1.4.10 Redistribution des WCAG exige que le contenu reste utilisable sur une largeur de 320 pixels CSS sans défilement dans deux directions (W3C (s’ouvre dans un nouvel onglet)). Les guides des tailles et les tableaux comparatifs trop larges en sont des causes fréquentes.

Les pop-ups gênent-elles l’achat ?

Les pop-ups qui recouvrent la fiche produit dès l’arrivée masquent les informations que les acheteurs sont venus chercher : préférez de petites bannières et limitez les invitations à s’inscrire.

Les recommandations de Google Search Central décrivent les interstitiels et boîtes de dialogue intrusifs comme des éléments qui empêchent de voir le contenu, et conseillent de petites bannières plutôt que des superpositions en pleine page (Google Search Central (s’ouvre dans un nouvel onglet)). Shopify signale que le contenu des pop-ups peut aussi provoquer des décalages de mise en page (centre d’aide Shopify (s’ouvre dans un nouvel onglet)). Toute boîte de dialogue que vous conservez doit pouvoir se fermer au clavier : le critère 2.1.2 Pas de piège au clavier des WCAG (niveau A) exige que le focus puisse quitter un composant à l’aide du seul clavier (W3C (s’ouvre dans un nouvel onglet)).

Les acheteurs trouvent-ils vos pages de confiance et vos politiques ?

Placez des liens vers les pages remboursement, livraison, confidentialité, conditions générales et contact dans le pied de page de chaque page.

Dans l’enquête 2026 de Baymard, 19 % des répondants déclarent avoir abandonné un achat parce qu’ils ne faisaient pas confiance au site pour leurs données de carte bancaire. Des politiques claires et des coordonnées de contact sont des signaux élémentaires de la légitimité d’une boutique.

Shopify : une fois vos politiques ajoutées sous Settings > Policies, Shopify les affiche automatiquement en lien dans le pied de page du tunnel de paiement ; pour les afficher dans la boutique, ajoutez-les à un menu sous Content > Menus (Contenu > Menus si votre interface est en français) (centre d’aide Shopify (s’ouvre dans un nouvel onglet)) ou activez le paramètre de pied de page Policy links (liens vers les politiques) de Dawn.

WooCommerce : publiez la page de remboursement restée en brouillon, puis ajoutez vos pages de politique et de contact au pied de page.

La recherche interne trouve-t-elle les produits et les réponses ?

La recherche doit renvoyer les bons produits pour les noms, les fautes de frappe et les synonymes, et répondre aussi à des questions comme « retours » ou « livraison ».

Le benchmark 2026 de Baymard consacré à la recherche, portant sur plus de 170 sites et applications, a jugé « médiocres » ou pires 46 % des expériences sur ordinateur, 58 % sur mobile et 64 % dans les applications, et a relevé sur 66 % des sites des problèmes avec les recherches qui ne portent pas sur un produit, par exemple une recherche de la politique de retour qui renvoie des produits (Baymard Institute (s’ouvre dans un nouvel onglet), mis à jour le 29 avril 2026).

Testez votre boutique avec le nom d’un best-seller, ce même nom mal orthographié, un mot de catégorie et « retours ». Sur Shopify, la recherche de la boutique renvoie des produits, des articles de blog et des pages, avec la recherche prédictive et la tolérance aux fautes de frappe activées par défaut, et l’application Search & Discovery ajoute des filtres et la mise en avant de produits (centre d’aide Shopify (s’ouvre dans un nouvel onglet)). Une page classique qui résume la livraison et les retours peut donc apparaître pour ces recherches.

Peut-on acheter en utilisant uniquement le clavier ?

Chaque étape, du choix d’une variante jusqu’au bouton de paiement, doit fonctionner au seul clavier, avec un indicateur de focus visible.

Les WCAG 2.2 exigent que toutes les fonctionnalités soient utilisables au clavier (2.1.1, niveau A), sans piège au clavier (2.1.2, niveau A), avec un indicateur de focus visible (2.4.7, niveau AA) et des éléments ayant le focus qui ne soient pas entièrement masqués par d’autres contenus (2.4.11, niveau AA) (W3C (s’ouvre dans un nouvel onglet)). Ces bases font souvent défaut. L’étude Baymard de 2021 portant sur 33 sites parmi ceux qui réalisent le plus gros chiffre d’affaires a montré que 45 % comportaient des fonctionnalités impossibles à utiliser au clavier et que 48 % ne gardaient pas l’indicateur de focus visible en permanence (Baymard Institute (s’ouvre dans un nouvel onglet)). L’analyse de WebAIM de février 2026 a relevé en moyenne 56,1 erreurs détectées par page d’accueil, et 71,0 pour les sites de sa catégorie Shopping (WebAIM (s’ouvre dans un nouvel onglet)).

Un test de cinq minutes :

  1. Chargez une fiche produit et appuyez sur Tab sans toucher à la souris.
  2. Vérifiez que vous voyez toujours où se trouve le focus.
  3. Choisissez une taille et une couleur, puis modifiez la quantité.
  4. Appuyez sur le bouton d’ajout au panier et vérifiez que le focus passe dans le tiroir du panier et que celui-ci se ferme au clavier.
  5. Atteignez le bouton de paiement.
/* A visible focus style for keyboard users */
:focus-visible {
  outline: 3px solid #1a5fb4;
  outline-offset: 2px;
}

Une analyse gratuite vérifie bon nombre de ces points en une minute environ. Le Rapport Conversion transforme des vérifications de pages, comme la visibilité du prix, l’ajout au panier sur mobile, les informations de livraison et de retour, les pop-ups, les liens vers les politiques en pied de page, la recherche, le parcours d’achat au clavier et le défilement horizontal, en recommandations classées par priorité. Il repose sur des vérifications de pages, et non sur vos données de ventes, et ne garantit aucune vente.

Foire aux questions

Quelle est la raison la plus fréquente pour laquelle les acheteurs abandonnent un achat ?

Dans l’enquête 2026 de Baymard menée auprès de 1 083 adultes américains, la première réponse était « je ne faisais que regarder » (42 %). Parmi les autres motifs, les coûts supplémentaires comme la livraison, les taxes et les frais arrivaient en tête avec 40 %, devant la lenteur de la livraison avec 20 %.

Corriger ces problèmes va-t-il augmenter mon taux de conversion ?

Personne ne peut le promettre. Les études décrivent des freins courants sur de vastes échantillons de sites et d’acheteurs ; l’effet de leur suppression sur vos résultats dépend de vos produits, de vos prix et de votre trafic, alors mesurez avant et après chaque modification.

Où placer les informations de livraison et de retour sur une fiche produit ?

Près du prix et du bouton d’achat, sous forme de court résumé avec un lien vers la politique complète. Dans les études de Baymard, 60 % des répondants déclarent chercher les informations sur la politique de retour sur la fiche produit.

Le bouton d’ajout au panier doit-il être visible sans défilement sur mobile ?

Aucune règle ne l’impose, mais les acheteurs doivent voir le prix et atteindre le bouton rapidement. Une barre d’achat fixe est une option, à condition qu’elle ne masque ni les éléments ayant le focus ni d’autres contenus.

L’accessibilité fait-elle partie de la conversion ?

Oui, au sens le plus simple : un acheteur qui ne peut pas utiliser le sélecteur de variantes ou le bouton d’ajout au panier avec un clavier ou un lecteur d’écran ne peut pas acheter. Le niveau AA des WCAG 2.2 couvre ces bases.

Sources

Tous les guides