Shopify place l'essentiel de la frontière entre accessible et inaccessible à l'intérieur de votre thème, et c'est une bonne nouvelle : le thème est à vous. Le tunnel de paiement ne l'est pas, et cette frontière décide de ce que vous pouvez promettre à un client.
L'acte européen sur l'accessibilité s'applique au commerce en ligne vendu à des consommateurs de l'UE : pour beaucoup de boutiques, cela a cessé d'être facultatif en juin 2025.
Ce que vous contrôlez, et ce que vous ne contrôlez pas
Tout ce qui précède le paiement est du code de thème : gabarits, sections, snippets, et tout ce qu'injectent les applications. Tout cela vous revient.
Le tunnel de paiement hébergé appartient à Shopify. Vous ne pouvez pas en changer le balisage : sa conformité est donc une question à poser à Shopify — et une question légitime à poser par écrit, puisque votre propre déclaration doit en dire quelque chose. Les marchands Shopify Plus disposent de plus de latitude via l'extensibilité du checkout, mais le parcours principal reste le leur.
Les défauts de thème présents sur presque toutes les boutiques
Même les thèmes dérivés de Dawn dérivent une fois qu'une boutique a été personnalisée pendant un an.
- pas çaDes images produit sorties avec `alt="{{ product.title }}"` sur chaque image, si bien qu'une galerie de six annonce six fois la même phrase. Utilisez le champ alt par image, et un alt vide pour les prises purement décoratives.
- pas çaDes boutons en icône seule — panier, recherche, liste d'envies, sélecteurs de quantité — sans nom accessible. Ajoutez un span masqué visuellement ou un `aria-label` nommant l'action.
- pas çaDes pastilles de promotion et des écarts de prix portés par la seule couleur, ce qui échoue à 1.4.1.
- pas çaDes prix soldés balisés de sorte qu'un lecteur d'écran lit les deux nombres sans indiquer lequel est en vigueur. Entourez l'ancien prix de `<s>` et étiquetez-le.
- pas çaDes pastilles de variante construites avec des `div` et des gestionnaires de clic plutôt qu'avec des boutons radio — inatteignables au clavier.
- pas çaDes sélecteurs de quantité sous 24 × 24 pixels CSS, ce qui échoue à 2.5.8 dans WCAG 2.2.
- pas çaLa barre d'annonce qui défile toute seule sans pause, ce qui échoue à 2.2.2.
C'est par les applications que l'accessibilité s'en va discrètement
Une boutique avec quinze applications a quinze sources de balisage injecté que personne n'a relu. Fenêtres d'avis, sélecteurs de devise, bandeaux de cookies et modales de vente additionnelle sont les coupables habituels, et une modale qui piège le focus clavier est un échec à 2.1.2 qui met fin à la session.
Avant d'installer quoi que ce soit qui s'affiche côté boutique, ouvrez-le et appuyez sur Tab. Si vous ne pouvez pas l'atteindre et le fermer au clavier, c'est un risque, quel que soit son effet sur la conversion.
Un enchaînement qui tient dans un sprint
Pas besoin de tout reconstruire. Corrigez les gabarits et chaque produit en hérite.
- à faireAnalysez la page produit, la page collection, le panier et les pages de compte. Quatre gabarits couvrent l'essentiel de la boutique.
- à faireCorrigez une bonne fois la gestion de l'alternative textuelle dans le snippet d'image produit.
- à faireDonnez un nom à chaque bouton en icône dans les snippets d'en-tête et de carte.
- à faireVérifiez le contraste sur les pastilles de promotion, les boutons désactivés et la barre d'annonce — les trois endroits où la couleur de marque perd habituellement.
- à faireTerminez un achat au clavier seul, jusqu'au passage au tunnel de paiement.
- à faireMettez ces gabarits sous analyse hebdomadaire pour que la prochaine mise à jour du thème ne défasse rien.
Ce qu'il faut dire dans votre déclaration
Nommez la frontière explicitement : votre thème relève de votre responsabilité et voici son état ; le tunnel de paiement est fourni par Shopify et voici ce qu'ils en publient. C'est honnête, c'est vérifiable, et c'est bien mieux qu'une affirmation générale que vous ne pouvez pas étayer.
Questions
- Shopify est-il accessible d'origine ?
- Le thème de référence de Shopify, Dawn, part dans un état correct. Ce qui arrive aux clients, c'est votre version personnalisée plus les applications, et c'est là que les défauts s'accumulent. La plateforme ne rend pas votre boutique conforme.
- Puis-je corriger le tunnel de paiement Shopify ?
- Pas sur l'offre standard — le balisage n'est pas le vôtre. Documentez la frontière dans votre déclaration d'accessibilité et remontez des constats précis à Shopify. Les marchands Plus ont plus de marge via l'extensibilité du checkout.
- Les applications d'accessibilité de l'App Store Shopify règlent-elles cela ?
- La plupart sont des surcouches, et elles ne corrigent pas le balisage sous-jacent. Corriger le thème coûte à peu près autant et c'est permanent.
Continuer la lecture