BLOG · E-COMMERCE · PARCOURS
Panier, quantité, commande : les trois parcours à vérifier sur une boutique
Par Théodis Guyon · Publié le · Mis à jour le · Lecture : 3 min
L’essentielUn site marchand n’est pas une suite de pages, c’est une suite d’actions. Si l’une d’elles bloque, la vente s’arrête. Voici les trois parcours que nous examinons en premier, et ce que nous y regardons.
1. Consulter un produit et l’ajouter au panier
Le nom du produit, son prix, ses variantes et le bouton d’ajout doivent pouvoir être lus et actionnés sans souris et sans voir l’écran. Les points de blocage habituels : un bouton d’ajout sans nom annoncé, une variante choisie par une couleur seule, un prix lu comme une image.
2. Modifier une quantité et retirer un article
Les boutons plus et moins doivent être atteignables au clavier, nommés, et leur effet annoncé. Un panier qui se met à jour sans le dire laisse la personne sans savoir si son geste a compté.
3. Passer la commande
Adresse, livraison, paiement : chaque champ a une étiquette visible, chaque erreur est expliquée près du champ et en tête de formulaire, et le bouton final dit ce qu’il fait. Un délai de session trop court, ou une validation qui vide le formulaire, fait recommencer tout le parcours.
Comment nous testons
Chaque parcours est joué de bout en bout, au clavier, avec un lecteur d’écran, et au zoom du navigateur. Les constats sont remis sous forme de fiches, une par défaut, avec la page, l’effet, la correction et la vérification attendue. Le format est décrit dans une fiche de correction.
Fiche de recette des parcours e-commerce
À utiliser sur un environnement de test autorisé avec des données fictives. Faites désactiver les débits, les notifications et les expéditions réelles. Si ce cadre manque, arrêtez-vous avant toute validation de commande. Cette fiche prépare des constats, elle ne mesure pas la conformité.
- Préparer. Notez la version du site, le navigateur, le mode de navigation et les produits de test. Prévoyez un produit simple, une variante indisponible et une erreur de saisie. Rejouez les étapes au clavier, puis avec un lecteur d’écran que vous savez utiliser.
- Produit. Rejoignez le choix de variante puis le bouton d’ajout avec Tab. Vérifiez que le nom, le prix, la variante sélectionnée et l’indisponibilité sont compréhensibles. Attendu : les informations utiles ne dépendent ni d’une image ni de la couleur seule.
- Panier. Ajoutez un produit, changez sa quantité et retirez-le. Attendu : les commandes sont nommées, le focus reste utilisable et les changements de quantité et de total sont perceptibles sans rechercher toute la page.
- Formulaire. Sur le site de test, laissez un champ obligatoire vide puis corrigez-le. Attendu : le champ possède une étiquette, l’erreur est explicite et reliée au champ, les autres saisies utiles sont conservées.
- Confirmation. En mode de paiement de test uniquement, relisez le récapitulatif et corrigez une donnée avant de confirmer. Attendu : on peut vérifier et corriger la commande, puis comprendre si elle a réussi ou échoué. Incluez les fenêtres et services tiers dans le périmètre.
- Transmettre et retester. Pour chaque blocage, joignez l’URL de test, les étapes, le résultat attendu, le résultat obtenu et l’environnement. Désignez la personne responsable : équipe contenu, agence ou fournisseur tiers. Après correction, rejouez le parcours complet.
La fiche de constat distingue « réussi dans cet environnement », « obstacle observé », « non testé » et « non applicable, motif précisé ». Conservez une preuve sans donnée client. Une capture seule ne décrit pas une difficulté au clavier ou au lecteur d’écran.
Exemple fictif : après le passage de un à deux articles, le total change visuellement mais aucun message ne l’annonce au lecteur d’écran. Le ticket décrit le produit de test et les touches utilisées ; l’agence reçoit la correction, puis une nouvelle recette vérifie le message et le total.
Télécharger la fiche « Fiche de recette des parcours e-commerce » (TXT, 2,7 Ko, français). Le contenu complet est aussi lisible sur cette page.
Sources consultées le 5 octobre 2026 : W3C, formulaires accessibles (en anglais) ; W3C, alternatives des images (en anglais).
Sources
- W3C, tutoriel sur les formulaires accessibles (en anglais), consulté le 5 octobre 2026.
- Parcours examinés sur la page E-commerce de ce site.
À lire ensuite : E-commerce : qui est concerné par l’accessibilité depuis le 28 juin 2025.