Conformité ADA : checklist en 10 points pour votre site

Aux États-Unis, l'Americans with Disabilities Act (ADA) impose que le site de votre entreprise soit accessible aux personnes en situation de handicap. Selon les Centres pour le contrôle et la prévention des maladies (CDC), plus de 70 millions d'adultes américains sont concernés. Si vous vendez aux États-Unis, la conformité ADA vous concerne directement. Et l'Europe suit le même chemin : depuis le 28 juin 2025, de nouvelles règles d'accessibilité s'appliquent à la plupart des boutiques en ligne.

Au-delà du cadre légal, un site accessible permet à chaque visiteur d'arriver sans encombre jusqu'au message « Merci pour votre commande ». À la clé : plus de visiteurs, plus d'engagement et un parcours d'achat plus fluide.

Ce guide vous explique ce que recouvre la conformité ADA, pourquoi l'accessibilité web compte et comment l'appliquer concrètement sur votre site.

Certaines sources citées dans cet article sont en anglais.

Qu'est-ce que la conformité ADA ?

La conformité ADA consiste à respecter les règles fixées par l'Americans with Disabilities Act, une loi fédérale américaine adoptée en 1990. Son objectif : garantir que les personnes en situation de handicap puissent accéder aux bâtiments, aux transports, à l'emploi et aux services publics, mais aussi utiliser sans difficulté les sites web et les applications.

L'ADA interdit toute discrimination dans les « lieux ouverts au public ». Les tribunaux américains ont depuis étendu cette notion aux boutiques en ligne, aux applications mobiles et aux portails des administrations locales. Trois titres de la loi sont concernés :

• Le Titre I couvre les portails d'emploi et les outils RH internes des entreprises de 15 salariés ou plus.
• Le Titre II s'applique aux organismes publics.
• Le Titre III s'applique aux entreprises commerciales, dont les e-commerçants.

Ensemble, ces textes forment le socle de ce que l'on appelle la conformité web ADA. Les sites web ne figurent pas explicitement dans les 2010 ADA Standards for Accessible Design, mais ces normes restent la référence du ministère américain de la Justice pour évaluer si un site respecte l'esprit de la loi.

Qui est concerné ? Les agences fédérales, les États et collectivités locales qui proposent des services en ligne, mais aussi les entreprises privées comme les commerces, les banques ou les prestataires de santé. Les fournisseurs de technologies de l’information qui travaillent pour ces organisations doivent aussi s’y conformer. Certains États, comme la Californie et New York, vont plus loin avec leurs propres règles d’accessibilité. Et si votre boutique est basée en France mais vend aux États-Unis, la question vous concerne aussi : les tribunaux américains peuvent accepter des plaintes contre des sites étrangers qui ciblent des clients américains, par exemple avec une livraison vers les États-Unis ou des prix affichés en dollars. 

Conformité ADA : et en France ?

Si vous vendez uniquement en France, l'ADA ne s'applique pas à votre boutique. En revanche, l'Europe dispose désormais de son propre cadre : la directive européenne sur l'accessibilité, transposée en droit français en 2023, s'applique depuis le 28 juin 2025 aux services de commerce électronique. Seules les microentreprises qui fournissent des services (moins de 10 salariés et un chiffre d'affaires annuel ou un total de bilan inférieur ou égal à 2 millions d'euros) en sont exemptées.

En France, le référentiel général d'amélioration de l'accessibilité (RGAA) s'appuie lui aussi sur les WCAG présentées ci-dessous. La checklist de cet article vous aide donc à avancer sur les deux fronts.

Que sont les WCAG, les règles d'accessibilité des contenus web ?

L'ADA ne fixe pas elle-même de normes techniques pour l'accessibilité web. Elle renvoie les entreprises vers les règles pour l'accessibilité des contenus web (WCAG). La dernière version, les WCAG 2.2, classe ses critères en trois niveaux : A, AA et AAA.

Le niveau A regroupe les exigences de base, comme la possibilité de naviguer sur tout le site au clavier.

Le niveau AA est celui que visent la plupart des sites. Il inclut notamment le contraste des couleurs et le texte alternatif des images. Shopify teste par exemple en continu ses contenus et fonctionnalités pour respecter ce niveau, et propose des ressources de formation aux développeurs, marchands et partenaires.

Le niveau AAA est le plus exigeant. Il prévoit par exemple l'interprétation en langue des signes pour toutes les vidéos préenregistrées, un rapport de contraste d'au moins 7:1 et des contenus rédigés dans un langage plus simple.

Les WCAG reposent aussi sur quatre grands principes :

• Perceptible : associez un texte alternatif à chaque image porteuse de sens, pour que les visiteurs qui utilisent un lecteur d'écran comprennent ce qui s'affiche.
• Utilisable : ne misez pas tout sur la souris. La navigation, les menus déroulants et les formulaires doivent fonctionner aussi bien au clavier.
• Compréhensible : rédigez des libellés et des messages d'erreur clairs, et ajoutez des repères non visuels pour que les visiteurs sachent toujours quoi faire ensuite.
• Robuste : codez en HTML sémantique, pour que les technologies d'assistance et les navigateurs, actuels comme futurs, interprètent correctement votre contenu.

Pourquoi la conformité ADA et l'accessibilité web sont importantes

L'accessibilité dépasse largement la question de la conformité légale. Sara Mote, directrice de création de l'agence de design Studio Mote, conseille à ses clients d'aborder le volet juridique avec leur avocat. Mais pour elle, l'accessibilité relève aussi, tout simplement, des bonnes pratiques de design UX.

« Certains choix de design sont de bonnes pratiques non seulement pour l'accessibilité, mais aussi pour l'expérience utilisateur dans son ensemble, car les deux se recoupent largement, explique-t-elle. Le design a le pouvoir de captiver un public, de transmettre de l'information et de susciter des émotions, ce qui influence directement les décisions d'achat. En résumé, un bon design améliore la qualité de ces échanges. »

Voici d'autres raisons de prendre l'accessibilité web au sérieux :

• Éthique : environ un adulte américain sur quatre vit avec un handicap qui peut compliquer son accès aux sites web, notamment une déficience visuelle, motrice ou auditive. Lever ces obstacles, c'est respecter l'esprit de l'ADA et permettre à chacun de participer pleinement à la vie publique.
• Chiffre d'affaires : une conception inclusive peut faire progresser vos ventes. Un code propre, des textes alternatifs descriptifs et des contrastes élevés élargissent votre audience, améliorent l'expérience utilisateur de votre site e-commerce et soutiennent votre taux de conversion.
• Réputation : un site inaccessible peut susciter des critiques dans les médias ou sur les réseaux sociaux et donner l'image d'une marque indifférente à l'inclusion. La confiance des clients s'érode, et certains acheteurs finissent par se tourner vers d'autres sites.
• Risque juridique : ne pas respecter les normes d'accessibilité expose votre entreprise à des poursuites. En 2023, plus de 4 500 actions en justice liées à l'accessibilité numérique ont été engagées au titre de l'ADA devant les tribunaux américains.

« L'accessibilité revient toujours à une forme de facilité cognitive, précise Sara. Il est vraiment avantageux de l'intégrer dès la conception et de faire des choix qui permettent à l'utilisateur de parcourir le site sans effort. »

Checklist de conformité ADA pour votre site web

1. Proposer des sous-titres et des audiodescriptions pour chaque vidéo
2. Choisir le bon rapport de contraste
3. Permettre de redimensionner le texte ou de changer de police
4. Ajouter des libellés ARIA aux boutons, icônes et champs de formulaire
5. Ajouter un lien « Aller au contenu principal » en haut de chaque page
6. Limiter les clignotements sous les seuils à risque pour l'épilepsie
7. Gérer le focus dans les pop-ups et prévoir un bouton de fermeture accessible au clavier
8. Afficher les erreurs de formulaire en texte et les associer aux bons champs
9. Rédiger des CTA explicites
10. Combiner analyses automatisées et vérifications manuelles

Voici des mesures d'accessibilité concrètes à appliquer sur votre propre site. Elles s'appuient sur les critères WCAG, les bonnes pratiques de Shopify et les checklists de WebAIM, qui traduisent les WCAG en langage clair. Intégrez-les dès la conception de votre site e-commerce pour éviter des corrections coûteuses par la suite.

1. Proposer des sous-titres et des audiodescriptions pour chaque vidéo

Les sous-titres des vidéos préenregistrées font partie des critères de niveau A des WCAG. Ils permettent aux personnes sourdes ou malentendantes d'accéder pleinement à vos contenus vidéo et répondent aux exigences de l'ADA, de la Section 508 et de la FCC, l'autorité américaine des communications. Autre avantage : les moteurs de recherche indexent le texte des sous-titres, ce qui améliore le référencement de vos vidéos.

Le site de la marque de vêtements de sport Gymshark intègre par exemple ses vidéos avec les sous-titres activés.

2. Choisir le bon rapport de contraste

Visez un rapport de contraste d'au moins 4,5:1 pour le texte et les éléments interactifs. Ce seuil permet au texte et aux éléments visuels importants de bien se détacher du fond. Ils restent ainsi lisibles pour les personnes malvoyantes, notamment celles atteintes de basse vision ou de daltonisme. Pour tester vos combinaisons de couleurs, utilisez un outil comme le Contrast Checker de WebAIM, puis ajustez votre palette de couleurs en conséquence. Si vous êtes sur le point de choisir votre thème Shopify, vérifiez ces réglages dès le départ.

La marque de cosmétiques ColourPop respecte par exemple un rapport de contraste de 4,5:1 pour garantir une lisibilité constante.

3. Permettre de redimensionner le texte ou de changer de police

Donner la possibilité d'agrandir le texte ou de passer à une police plus lisible aide les personnes malvoyantes, les personnes dyslexiques et les seniors, qui peinent parfois à lire un texte petit ou dense. Elles se concentrent plus facilement, se fatiguent moins les yeux et comprennent mieux le contenu.

La marque de vêtements de golf Good Good Golf propose ainsi tout un panel d'options d'accessibilité sur chaque page de son site, dont l'ajustement des polices.

4. Ajouter des libellés ARIA aux boutons, icônes et champs de formulaire

Les attributs ARIA permettent aux technologies d'assistance d'annoncer à l'utilisateur la nature de chaque élément interactif et son rôle. La marque de vêtements Taylor Stitch ajoute par exemple des libellés ARIA au code de son site, pour que les lecteurs d'écran indiquent à quoi sert chaque fonctionnalité.

5. Ajouter un lien « Aller au contenu principal » en haut de chaque page

Ce lien d'évitement permet aux personnes qui naviguent au clavier ou avec un lecteur d'écran de passer les menus et l'en-tête pour accéder directement au contenu principal. Elles gagnent du temps et s'épargnent des tabulations ou des défilements inutiles.

Concrètement, le lien est masqué en haut de la page et ne devient visible qu'au moment où il reçoit le focus. Placé avant le code de la navigation dans le HTML, il est le premier élément atteint au clavier. Une règle CSS l'affiche uniquement lorsque l'utilisateur appuie sur la touche Tab après le chargement de la page.

Taylor Stitch applique cette bonne pratique : un bouton « Skip to Content » (aller au contenu) apparaît dès que l'on appuie sur Tab au chargement de la page.

6. Limiter les clignotements sous les seuils à risque pour l'épilepsie

Une animation qui clignote moins de trois fois par seconde respecte les règles WCAG. Les développeurs peuvent garantir ce seuil grâce à des styles CSS adaptés. C'est le cas sur la page d'accueil de la marque de montres MVMT, qui utilise la propriété CSS opacity pour maintenir ses animations sous le seuil susceptible de déclencher des crises.

L'effet d'apparition progressive (ease-in) fait apparaître l'animation en douceur. Tous les visiteurs profitent d'une mise en page plus fluide et plus agréable, et les personnes présentant des troubles cognitifs sont moins gênées par l'agitation visuelle. Les personnes sensibles au mouvement ou à risque de crises d'épilepsie peuvent, elles aussi, consulter le contenu en toute sécurité.

7. Gérer le focus dans les pop-ups et prévoir un bouton de fermeture accessible au clavier

À l'ouverture d'une pop-up, le focus clavier doit se déplacer automatiquement vers le premier élément interactif, comme un bouton de fermeture ou un champ de saisie. Les personnes qui naviguent au clavier ou avec un lecteur d'écran ne restent ainsi pas bloquées derrière la fenêtre modale et peuvent la fermer sans souris.

Sur le site de la marque de linge de maison Brooklinen, le bouton de fermeture du panier latéral, en haut à droite, est accessible au clavier, pour les utilisateurs de lecteurs d'écran comme pour ceux qui naviguent uniquement au clavier.

8. Afficher les erreurs de formulaire en texte et les associer aux bons champs

Quand un visiteur oublie une information ou saisit une donnée incorrecte dans un formulaire, affichez un message d'erreur textuel clair. Associé techniquement au champ concerné, ce message reste accessible aux lecteurs d'écran, aux personnes aveugles ou malvoyantes et aux personnes présentant des troubles cognitifs.

Dans l'exemple ci-dessous, le champ de saisie du thème Dawn de Shopify affiche le message « aucune adresse e-mail » lorsque l'utilisateur clique sur le bouton gris sans avoir renseigné son adresse.

9. Rédiger des CTA explicites

Des libellés de boutons et des textes d'ancrage clairs aident les personnes aveugles ou malvoyantes qui utilisent un lecteur d'écran à savoir ce que fait un bouton avant de l'activer. Les personnes présentant des troubles cognitifs profitent aussi d'un langage clair, comme tous vos visiteurs : un bouton bien nommé rend la page plus facile à parcourir et à utiliser. Des CTA explicites contribuent d'ailleurs à l'optimisation du taux de conversion.

Sur le site de Brooklinen, le bouton bleu au centre droit de la page indique clairement « Find Your Store » (trouver votre magasin). Inutile de le survoler ou de cliquer dessus pour comprendre son rôle.

10. Combiner analyses automatisées et vérifications manuelles

Pour détecter les problèmes d'accessibilité, vos équipes web peuvent utiliser des outils automatisés comme Axe ou Lighthouse, qui mesure aussi la performance web de vos pages. Vous pouvez également analyser votre site avec une application d'accessibilité de l'App Store de Shopify. 

« Shopify propose toute une boîte à outils intégrée pour appliquer certaines bonnes pratiques d'accessibilité, explique Sara. Beaucoup de nos clients utilisent une application qui vérifie leur conformité, ou font appel à une équipe externe hautement spécialisée pour un audit complet. »

Les tests manuels, idéalement menés avec des personnes qui utilisent un lecteur d'écran ou vivent avec un autre handicap, révèlent des problèmes que les outils automatisés ne voient pas. Vous repérez ainsi les lacunes d'accessibilité et pouvez les corriger au lancement de votre site, puis avant chaque mise à jour, par exemple lors de la refonte de votre page d'accueil.