UX e-commerce : où les boutiques en ligne perdent leurs clients

L’UX e-commerce n’est pas une seule chose à corriger — ce sont trois endroits différents du parcours d’achat où le client peut abandonner avant de payer : la recherche et les filtres, la fiche produit, et le panier avec le paiement. Le mobile n’est pas un quatrième élément de cette liste. C’est le contexte dans lequel le client traverse chacune de ces trois étapes — avec ses propres pièges liés au tactile et au petit écran, à chaque étape.

Cet article montre l’ampleur du problème à chaque étape à l’aide des benchmarks publics du Baymard Institute, distingue deux mesures de l’usage des appareils qui répondent à des questions différentes, aborde l’accessibilité numérique pour les boutiques en ligne suisses, et renvoie vers quatre articles de la section UX/UI qui développent chacun de ces sujets en détail.

L’UX e-commerce en trois points : recherche, fiche produit, paiement

Recherche et filtres. Le Baymard Institute a testé l’utilisabilité de la recherche interne sur « 19 leading e-commerce sites across 8 different verticals » — traduction libre : 19 sites e-commerce de référence dans 8 secteurs différents — et a relevé, pendant ces tests, « more than 700 search-specific usability issues » — plus de 700 problèmes d’utilisabilité spécifiques à la recherche. À partir de ces constats, l’institut a établi 31 recommandations pour la recherche e-commerce, utilisées pour évaluer « 344 leading US and European e-commerce sites » — 344 sites e-commerce américains et européens de référence (baymard.com/research/ecommerce-search, consulté le 5 octobre 2026). Pour les listes de produits et les filtres — une étude distincte du même institut, avec sa propre méthodologie — pas moins de « 36% of sites » — 36 % des sites — présentaient des défauts de conception ou de fonctionnement suffisamment graves pour que Baymard les qualifie de « downright harmful » — carrément nuisibles — à l’utilisabilité (baymard.com/research/ecommerce-product-lists, consulté le 1er octobre 2026). Sur mobile, cette étape ajoute ses propres pièges : les suggestions de recherche ne doivent pas se cacher derrière le clavier virtuel, et les filtres doivent pouvoir s’ouvrir et se fermer d’une seule main, au pouce, sans faire défiler toute la page pour trouver le bouton « Appliquer ».

Fiche produit. Le même institut a évalué l’utilisabilité des fiches produit sur 344 boutiques et a constaté que « 49% » ont une UX de fiche produit jugée « decent » ou « good » — correcte ou bonne — tandis que « 51% » sont jugées « mediocre » ou pire (baymard.com/research/product-page, consulté le 5 octobre 2026). Un article distinct de cette section — fiche produit — détaille ce qui distingue réellement une bonne fiche produit d’une faible : photos, prix, disponibilité et informations légalement obligatoires. Sur mobile, la fiche produit doit aussi intégrer une galerie photo que l’on fait défiler du doigt, et le bouton d’ajout au panier doit rester visible sans faire défiler toute la description.

Panier et paiement. Dans le benchmark de Baymard consacré au checkout, « 65% of sites have a performance of ‘mediocre’ or worse » — 65 % des sites ont une performance « médiocre » ou pire —, « 35% of sites feature a ‘decent’ or better checkout flow » — 35 % ont un parcours de paiement « correct » ou meilleur —, et seulement « 2% are ‘good’ » — 2 % sont « bons » — aucun des 344 sites évalués n’atteignant le niveau « perfect » (baymard.com/research/checkout-usability, consulté le 5 octobre 2026). Cette étape a son propre article détaillé dans cette section — abandon de panier — car c’est là que se cumulent les effets des erreurs des deux étapes précédentes : un client qui a déjà traversé la recherche et la fiche produit abandonne précisément à la dernière étape.

Le mobile comme contexte de chaque étape, pas une quatrième étape

La part des appareils et l’appareil sur lequel un achat est réellement finalisé répondent à deux questions différentes, qu’il ne faut pas mélanger. StatCounter mesure la part des appareils sur l’ensemble des pages vues de son panel — pas dans une catégorie d’achat précise, pas sur une boutique précise. Pour la Suisse, en septembre 2026 : ordinateur 51,71 %, mobile 46,59 %, tablette 1,7 % (gs.statcounter.com/platform-market-share/desktop-mobile-tablet/switzerland, consulté le 1er octobre 2026). Ce sont des données pondérées par pages vues dans le panel de ce fournisseur, pas un recensement de toutes les visites effectuées en Suisse.

Une autre mesure pose une question différente — pas celle de l’appareil sur lequel les gens naviguent, mais celle de l’appareil sur lequel ils finalisent réellement un achat donné. Nous ne disposons d’aucune étude publique répondant à cette seconde question pour le marché suisse à citer ici, donc il n’y a pas de chiffre à mettre en regard des données StatCounter ci-dessus. Le point méthodologique reste néanmoins valable : il s’agirait de deux mesures différentes répondant à deux questions différentes — si vous voyez un jour les deux côte à côte dans un même document, ne les lisez pas comme la même réalité vue deux fois.

Accessibilité numérique pour les boutiques en ligne suisses

La Suisse n’est pas un État membre de l’UE, et la directive (UE) 2019/882 sur l’accessibilité (European Accessibility Act) ne s’y applique pas. Cela ne tranche pas la question de savoir si une boutique en ligne suisse doit être accessible — cela signifie seulement que la réponse européenne ne franchit pas la frontière pour les ventes en Suisse. Vendre dans l’UE est une autre affaire : la directive considère comme prestataire de services toute personne qui fournit un service sur le marché de l’Union ou propose de le fournir à des consommateurs dans l’Union (art. 3, point 4), et elle couvre les services de commerce électronique (art. 2, par. 2, point f) — une boutique suisse qui vise des consommateurs de l’UE doit donc vérifier la loi de transposition des États membres où elle vend. Pour le marché suisse lui-même, nous n’avons pas pu confirmer d’obligation suisse visant les boutiques en ligne privées suffisamment précise pour citer une loi, une échéance ou une autorité ; nous n’en citons donc pas.

Ce que l’on peut dire sans forcer le trait : l’accessibilité est une bonne pratique partout, y compris pour les boutiques suisses. Le point de référence du secteur est le même que dans l’UE — les WCAG 2.2, publiées par le W3C sous forme de recommandation le 5 octobre 2023 (mises à jour le 12 décembre 2024). Attention, la compatibilité ne joue que dans un sens : un contenu conforme aux WCAG 2.2 l’est aussi aux WCAG 2.1, mais pas l’inverse — les WCAG 2.2 ajoutent de nouveaux critères, par exemple Target Size (Minimum) et Focus Not Obscured (Minimum) au niveau AA, si bien qu’une boutique conçue selon les WCAG 2.1 AA doit être vérifiée sur ces points (w3.org/WAI/standards-guidelines/wcag/new-in-22, consulté le 1er octobre 2026). Un contraste suffisant, de grandes zones cliquables et un code compréhensible par les lecteurs d’écran facilitent l’usage du site pour chaque visiteur, et réduisent le risque juridique et de réputation lié à l’exclusion de certains d’entre eux — indépendamment du fait qu’une loi suisse contraignante nomme ou non vos obligations précises. Si vous avez besoin d’une réponse définitive sur une loi suisse contraignante en matière d’accessibilité pour les boutiques en ligne privées, c’est une question pour une vérification juridique dédiée, pas une conclusion à tirer de cet article.

La vitesse, c’est aussi de l’UX

Une fiche produit lente à charger ou un paiement qui se bloque, c’est aussi de l’UX, pas seulement un facteur de référencement. Un changement de terminologie à connaître : le First Input Delay (FID), encore mentionné dans d’anciens guides, a cessé d’être un Core Web Vital le 12 mars 2024 — remplacé par l’Interaction to Next Paint (INP), une métrique qui mesure la réactivité de toute une interaction, pas seulement du premier clic (web.dev/blog/inp-cwv-launch, consulté le 1er octobre 2026). Comment mesurer et améliorer la vitesse d’une boutique — LCP, INP et CLS, avec le rapport Core Web Vitals dans Search Console — est traité séparément dans notre article sur les Core Web Vitals d’une boutique.

Quelques dates venues d’autres domaines ont aussi changé ce qu’une boutique doit respecter. À partir du 31 janvier 2027, Merchant Center commencera à appliquer une taille minimale de 500 × 500 pixels pour les images produit (spécification des données produit). Et si vous vendez aussi dans l’UE, le règlement européen sur la sécurité générale des produits (GPSR) s’y applique depuis le 13 décembre 2024 et fixe les informations produit qu’une offre en ligne doit contenir (règlement (UE) 2023/988, art. 52, consulté le 5 octobre 2026) ; c’est du droit européen, il ne régit pas les ventes à l’intérieur de la Suisse.

Carte de la section UX/UI

Cet article est le point d’entrée vers quatre articles qui développent chacun une de ces étapes en détail :

• Abandon de panier — pourquoi les clients abandonnent au panier et au paiement, ce que disent les données de Baymard, comment le mesurer dans GA4.
• Fiche produit — ce qu’une fiche produit doit couvrir pour satisfaire le client, la loi et Google.
• Recherche sur le site — comment lire les données de la recherche interne et des filtres, ce que les clients cherchent sans le trouver.
• Création de site e-commerce — un modèle prêt à l’emploi ou une boutique sur mesure, structure de la page d’accueil et de la navigation.

Pour un audit autonome de votre propre boutique, utilisez la checklist UX de boutique — elle reprend chaque étape de cet article sous forme de points concrets à cocher.

Par où commencer — 5 étapes

1. Parcourez tout le trajet d’achat sur mobile — de la recherche, en passant par la fiche produit, jusqu’au paiement — et notez chaque point où vous avez hésité.
2. Vérifiez si la recherche et les filtres de votre boutique mènent réellement à un produit, plutôt qu’à une page sans résultat.
3. Évaluez la fiche produit du point de vue du client : le prix, la disponibilité, le coût de livraison et tout ce que la loi exige sont-ils visibles avant qu’il doive cliquer pour continuer ?
4. Mesurez le paiement — le nombre d’étapes, le nombre de champs de formulaire, et si le coût total est visible avant la dernière étape.
5. Vérifiez les bases de l’accessibilité (contraste, navigation au clavier, descriptions d’images) — une bonne pratique, qu’une loi suisse contraignante s’applique ou non à votre activité.