Audit Accessibilité Shopify : Guide E-commerce RGAA 2026
Shopify propulse plus de 4 millions de boutiques en ligne. L'accessibilité e-commerce n'est pas qu'une obligation légale : elle élargit votre audience et améliore l'expérience de tous vos clients. Ce guide couvre les spécificités Shopify : thèmes Liquid, checkout verrouillé et apps tierces.
E-commerce accessible : un enjeu business
En France, 12 millions de personnes vivent avec un handicap. Une boutique inaccessible perd potentiellement 15-20% de clients. Au-delà de l'éthique, l'accessibilité améliore le SEO, le taux de conversion et la satisfaction client. Les grandes marques sont désormais soumises à des obligations légales (European Accessibility Act 2025).
12M+
Personnes handicapées en France
+35%
Amélioration conversion possible
2025
European Accessibility Act
En Bref : L'essentiel à retenir
- Framework : Shopify nécessite une attention particulière à la sémantique HTML.
- Point Critique : Gestion du focus lors de la navigation dynamique.
- Outil Recommandé : Shopify Dawn Theme.
- Critères RGAA clés : 1.1, 3.1, 7.3.
Accessibilité selon les thèmes Shopify
| Version | Support | Fonctionnalités A11y |
|---|---|---|
| Thèmes Legacy (Vintage) | Obsolète |
|
| Thèmes OS 2.0 (Dawn) | Standard |
|
| Thèmes 2024+ (Taste, Sense) | Recommandé |
|
Comment auditer un site Shopify en 5 étapes
Suivez ce guide étape par étape pour réaliser un audit RGAA complet de votre application Shopify.
Scanner RGAA automatique
Analysez votre boutique Shopify avec RGAA Checker. L'outil détecte les erreurs dans le thème, les pages produits et le panier.
Tester la navigation clavier
Parcourez le parcours d'achat complet au clavier : navigation, fiche produit, ajout au panier, jusqu'au checkout.
Vérifier les fiches produits
Alt text des images, sélecteurs de variantes (couleur/taille) accessibles, prix et promos annoncés correctement.
Auditer les apps installées
Chaque app (popup, chat, reviews) peut introduire des problèmes. Testez-les individuellement au clavier et lecteur d'écran.
Test lecteur d'écran du tunnel
Validez avec NVDA/VoiceOver le parcours complet jusqu'à la confirmation de commande. Le checkout Shopify est généralement accessible.
Erreurs Fréquentes avec Shopify
Apps marketing inaccessibles
Les roues de la fortune, chatbots, popups de newsletter et apps de reviews sont souvent des cauchemars d'accessibilité : pas de fermeture clavier, focus trap cassé, contenu non annoncé.
Sélecteurs de variantes visuels uniquement
Les pastilles de couleur sans texte ou les boutons de taille sans label accessible excluent les utilisateurs de lecteurs d'écran.
<button style="background: red" @click="selectColor('red')"></button><button @click="selectColor('red')"><span class="sr-only">Rouge</span><span class="color-swatch" style="background: red"></span></button>Prix barrés sans contexte
Afficher "29€ 19€" sans indication du prix original vs réduit est inaccessible. Les lecteurs d'écran lisent juste deux prix sans contexte.
<s>29€</s> 19€<span class="sr-only">Prix original :</span><s>29€</s> <span class="sr-only">Prix réduit :</span>19€Mega menus et dropdowns complexes
Les menus de navigation à plusieurs niveaux sont souvent inutilisables au clavier si le thème ne les gère pas correctement.
Carrousels de produits automatiques
Les sliders qui défilent automatiquement sans bouton pause sont non conformes et perturbent la navigation clavier.
Quick view / ajout rapide
Les modales d'ajout rapide au panier oublient souvent le focus trap et la fermeture avec Échap.
Plugins à éviter
Ces plugins/modules sont connus pour causer des problèmes d'accessibilité. Évitez-les ou configurez-les correctement.
Privy Popups (config défaut)
Popups sans focus trap ni fermeture clavier accessible
Alternative : Configurer manuellement ou utiliser Klaviyo avec settings a11y
Tidio Chat
Widget chat avec navigation clavier limitée
Alternative : Gorgias ou configuration Tidio accessible
Loox Reviews (anciennes versions)
Galerie de photos sans alt text ni navigation clavier
Alternative : Judge.me ou Loox mis à jour avec config a11y
Apps de slider "gratuits"
Carrousels sans contrôles accessibles ni pause
Alternative : Fonctionnalité native du thème ou supprimez le slider
Bonnes Pratiques Shopify
Thèmes du Shopify Theme Store
Privilégiez les thèmes récents du Theme Store officiel (Dawn, Taste, Sense). Ils ont des standards d'accessibilité plus élevés que les thèmes tiers (Themeforest, etc.).
Alt text descriptifs sur les produits
Décrivez le produit, pas des mots-clés SEO : "T-shirt coton bio rouge avec logo blanc sur la poitrine" plutôt que "t-shirt homme pas cher livraison gratuite".
Sélecteurs de variantes accessibles
Ajoutez des labels texte aux sélecteurs de couleur/taille. Utilisez les paramètres du thème ou ajoutez des spans .sr-only pour les lecteurs d'écran.
Navigation clavier dans les menus
Vérifiez que vos menus déroulants fonctionnent avec Tab, Entrée pour ouvrir, Échap pour fermer, et flèches pour naviguer. Testez sur mobile aussi.
Minimiser les apps marketing
Chaque app ajoutée est un risque d'accessibilité. Gardez seulement les essentielles et testez-les individuellement. Moins d'apps = moins de problèmes.
Tester le checkout
Le checkout Shopify est généralement accessible car géré par Shopify. Testez quand même avec votre configuration de paiement et apps de checkout.
Critères RGAA clés pour Shopify
Ces critères du référentiel RGAA sont particulièrement importants pour les sites Shopify.
Images produits
Alt text descriptif sur toutes les photos produits
Information par la couleur
Pastilles de couleur doivent avoir une alternative texte
Composants interactifs
Sélecteurs, menus et modales utilisables au clavier
Focus visible
Le thème ne doit pas masquer le focus sur les boutons
Labels formulaires
Newsletter, compte client et checkout avec labels
Navigation clavier
Menu principal et sous-menus sans piège
Checklist accessibilité Shopify
Vérifiez ces points essentiels avant de mettre votre site Shopify en production.
- Thème récent du Shopify Theme Store (Dawn, Taste, Sense)
- Alt text descriptifs sur toutes les images produits
- Sélecteurs de variantes avec labels texte (pas seulement couleur)
- Prix promotionnels avec contexte (original/réduit)
- Navigation clavier fonctionnelle dans le menu
- Pas de carrousel automatique sans pause
- Apps testées individuellement au clavier
- Focus visible sur tous les boutons et liens
- Parcours d'achat complet testable au clavier
- Checkout vérifié avec lecteur d'écran
Questions Fréquentes sur Shopify et l'accessibilité
Comment auditer l'accessibilité d'une boutique Shopify ?
Utilisez RGAA Checker pour un scan automatique, puis testez manuellement le parcours d'achat au clavier : navigation, fiche produit, panier, checkout. Auditez chaque app installée séparément car elles sont souvent la source des problèmes.
Le checkout Shopify est-il accessible ?
Oui, le checkout standard Shopify est généralement bien accessible car c'est Shopify qui le maintient. Cependant, les apps de checkout et personnalisations peuvent introduire des problèmes. Testez toujours le parcours complet.
Quel thème Shopify choisir pour l'accessibilité ?
Privilégiez les thèmes du Theme Store officiel : Dawn (gratuit, référence), Taste, Sense, ou Craft. Évitez les thèmes Themeforest ou Envato qui ont rarement été audités pour l'accessibilité.
Comment rendre les sélecteurs de couleur accessibles ?
Ajoutez un label texte caché visuellement (classe .sr-only) dans chaque bouton de couleur : <span class="sr-only">Rouge</span>. Les lecteurs d'écran annonceront ainsi la couleur, pas seulement "bouton".
Les apps Shopify sont-elles accessibles ?
Rarement. La plupart des apps de popup, chat, reviews et marketing n'ont pas été conçues avec l'accessibilité en tête. Testez chaque app au clavier et lecteur d'écran. Envisagez de supprimer celles qui échouent.
Shopify est-il soumis aux obligations d'accessibilité ?
Les marchands Shopify en France et UE sont concernés par les obligations légales selon leur taille et secteur. L'European Accessibility Act (2025) étend ces obligations au e-commerce. L'accessibilité devient un standard obligatoire.
Outils Recommandés pour Shopify
Shopify Dawn Theme
Le thème de référence Shopify OS 2.0, gratuit et accessible. Excellente base pour personnalisation.
shoplab Accessibility Check
Application Shopify qui lance des audits WCAG 2.2 automatisés sur votre boutique avec rapports PDF exportables.
Shopify Theme Tools
Outils officiels Shopify pour développeurs de thèmes : linting, formatage et Language Server pour code Liquid accessible.
Lighthouse CI
Intégrez Lighthouse dans votre CI/CD pour surveiller l'accessibilité à chaque déploiement de thème.
Auditez votre site Shopify gratuitement
Vérifiez si votre application respecte les 106 critères RGAA en moins de 30 secondes.
Lancer un audit RGAA gratuit