Liste de vérification gratuite du site Web de conformité ADA

Pourquoi avez-vous besoin d'un site Web conforme à l'ADA

Toute entreprise ou institution publique qui doit être conforme à l'ADA à son emplacement physique et "qui utilise [s] Internet pour les communications concernant leurs programmes, biens ou services doit être prête à offrir ces communications également par des moyens accessibles ". selon une lettre ouverte du ministère de la Justice.

Toute entreprise qui compte plus de 15 employés à temps plein et qui est ouverte plus de 20 semaines par an est tenue de respecter le titre III de l'Americans with Disabilities Act en étant facilement accessible au grand public. Les militants ont récemment commencé à rechercher et à poursuivre des sites Web non conformes ; 2250 poursuites ont été déposées en 2018 seulement.

Si votre site Web s'avère non conforme, vous perdrez des milliers de dollars en amendes et en frais de justice. Vous subirez également un cauchemar de relations publiques lorsque les médias d'information rapporteront que votre entreprise a été poursuivie pour discrimination à l'égard des personnes handicapées.

Alors que « l'accessibilité » était vaguement définie en 1996 lorsque la lettre du DOJ a été publiée, la Directives pour l'accessibilité du contenu Web sont maintenant la norme utilisée par le gouvernement fédéral pour sa propre présence sur le Web et par les tribunaux pour évaluer les violations du titre III de l'ADA.

Votre site Web actuel est probablement non conforme

Les cadres réalisent rarement que la conformité ADA est une préoccupation lors de l'achat d'un nouveau site Web. Ceux qui le font croient souvent que toute personne capable de créer des sites Web élégants et attrayants crée également des sites Web conformes à l'ADA. Malheureusement, les concepteurs de sites Web ignorent souvent les meilleures pratiques en matière de conformité ADA ou les ignorent pour mettre en œuvre de nouvelles fonctionnalités de conception intéressantes.

Les équipes publicitaires de nombreuses marques ignorent également les exigences. D'autres les prennent comme des suggestions et ignorent les problèmes majeurs tels que le contraste des couleurs et la taille de la police, car cela nécessiterait un changement de marque ou des modifications d'une campagne en cours pour s'y conformer.

Si vous n'êtes pas sûr de la conformité de votre site Web, testez-le par rapport à notre liste de contrôle. Une heure de votre temps pourrait faire économiser à votre entreprise des dizaines de milliers de dollars et l'humiliation publique.

Testez votre site Web pour la conformité ADA

Chez Sagapixel Web Design, nous avons créé une liste de contrôle pour tester la conformité ADA d'un site Web. Cela permet à nos équipes de conception Web et de création de contenu de s'assurer que leur travail est accessible au plus grand nombre de visiteurs et de clients potentiels.

Comment utiliser la liste de contrôle

Le test de conformité ADA nécessite plusieurs outils pour tester différentes zones de votre site Web. Il existe une variété d'outils gratuits comme WAVE qui peuvent tester les facteurs de conformité les plus importants, mais un examen humain est nécessaire pour des choses comme les sous-titres codés et les cas aberrants que l'outil ne peut pas détecter, comme les problèmes de refusion et les images avec un texte alternatif qui ne décrit pas ce qui est dans le cadre.

Descendez notre liste de contrôle et testez pour chaque élément. Si vous réussissez le niveau AA, félicitations ! Votre entreprise est accessible à la plupart des personnes handicapées. Si vous échouez à un article, vous vous exposez à un procès. Si vous échouez à plusieurs critères, acheter un nouveau site Web sera probablement moins cher que de faire appel à un développeur pour dépanner ce que vous avez actuellement.

Consultez la liste de contrôle en ligne ci-dessous ou téléchargez un PDF de la liste de contrôle pour l'imprimer ou la consulter hors ligne.

Liste de contrôle

Conformité de niveau A

• Tout contenu non textuel a une alternative textuelle qui sert le même objectif.
• Tous les médias basés sur le temps, y compris les présentations uniquement audio et uniquement vidéo, ont une alternative facilement accessible.
• Tous les médias synchronisés préenregistrés ont des sous-titres codés.
• L'ordre de lecture de tout contenu peut être déterminé par programmation. Le contenu est présenté dans un ordre logique, et la navigation au clavier suit cet ordre.
• Les instructions ne reposent pas uniquement sur des caractéristiques sensorielles, telles que la couleur, le son ou l'orientation visuelle, pour expliquer comment utiliser le contenu du site Web.
• La couleur n'est jamais utilisée comme seul moyen de communiquer la présence d'invites, de liens ou d'autres éléments visuels.
• Si l'audio est programmé pour jouer automatiquement pendant plus de 3 secondes, un mécanisme est disponible pour mettre en pause l'audio ou baisser le volume indépendamment du volume du système.
• Les utilisateurs peuvent accéder à toutes les fonctions d'un site Web avec un seul clavier.
• Les champs d'entrée peuvent ne pas nécessiter de minutage de frappe spécifique à moins que le minutage des mouvements d'un utilisateur ne soit essentiel à la fonction du champ.
• Si un composant est accessible au clavier, il doit également être possible de quitter ce composant à l'aide d'un clavier.
• S'il est nécessaire d'avoir une commande de sortie à partir d'un composant sur la page, il doit s'agir d'une touche unique non imprimable, telle que Escape ou Tab.
• Les raccourcis à une seule lettre doivent avoir au moins l'une des fonctionnalités suivantes :
  • Il doit toujours y avoir un moyen de désactiver le raccourci.
  • Il existe un mécanisme pour remapper le raccourci vers un caractère non imprimable.
  • Le raccourci ne fonctionne que dans un composant spécifique et n'est actif que lorsque ce composant a le focus.
• Les utilisateurs doivent pouvoir prolonger ou désactiver les limites de temps dans le contenu, à moins que cette limite de temps ne soit une partie essentielle d'une fonction réelle, comme une enchère.
• Les utilisateurs doivent pouvoir masquer toutes les fonctions de clignotement ou de défilement. La seule exception concerne les véritables alertes d'urgence.
• Aucune caractéristique ne peut clignoter plus de trois fois en une seconde.
• Un mécanisme doit exister pour contourner les blocs de contenu dupliqués.
• Tous les titres de page doivent décrire le sujet et le but de la page.
• Lorsqu'une page est parcourue de manière séquentielle, les composants doivent recevoir le focus dans le bon ordre lorsqu'ils sont accessibles au clavier.
• Tout geste à entrées multiples a une seule alternative d'entrée.
• Lorsqu'une fonction est activée par un clic, elle doit utiliser l'une des fonctionnalités d'accessibilité suivantes :
  • Le clic bas seul n'active pas la fonction.
  • Il existe une option pour annuler ou abandonner le clic.
  • Relâcher le bouton du pointeur annule le clic.
  • La seule exception est lorsque la fonction est conçue pour émuler un clavier ou un pavé numérique.
• Lorsqu'un bouton comprend du texte ou des images, le nom du bouton contient ce nom ou décrit le contenu visuel du bouton.
• Les fonctions activées par le mouvement doivent également pouvoir être activées via l'interface utilisateur. La seule exception est lorsque le mouvement est une partie essentielle de l'activité et que l'interface graphique ne peut pas reproduire la fonction.
• La langue par défaut d'une page Web peut être déterminée par programmation.
• Les boutons et autres composants interactifs ne peuvent pas changer leur objectif lorsqu'ils reçoivent le focus de l'utilisateur.
• La modification des paramètres utilisateur ne doit pas modifier le contexte des boutons ou des éléments interactifs.
• Les erreurs de saisie doivent avoir un nom clair et une description textuelle.
• Tout champ de saisie doit avoir une étiquette et des instructions claires.
• Le nom, le rôle et l'état de tous les composants de l'interface utilisateur peuvent être déterminés par programmation.
• Tout contenu ou fonctionnalité implémenté avec un langage de balisage possède des balises précises et utilise des identifiants uniques.

Conformité au niveau AA

• Le contenu multimédia synchronisé en direct sera présenté avec des sous-titres codés.
• Les médias préenregistrés doivent avoir des sous-titres codés avec description audio.
• L'orientation d'une page (paysage ou portrait) ne limite pas la vue ou le fonctionnement, sauf si l'orientation est une caractéristique essentielle du contenu.
• L'objectif de toute entrée qui collecte des informations sur l'utilisateur est clairement étiqueté et peut être déterminé par programmation.
• Le texte normal doit avoir un contraste de 4,5:1.
• Le texte avec une taille de police de 18 pt ou plus peut avoir un rapport de contraste aussi bas que 3:1. Les textes purement décoratifs et les logos d'entreprise sont exemptés de ces normes.
• Le texte doit conserver tout le contenu et toutes les fonctionnalités lorsqu'il est redimensionné jusqu'à 200 %.
• Les images de texte ne doivent pas être utilisées là où le texte réel suffirait. Si l'image n'a pas d'alternative pratique, comme des présentations d'œuvres d'art ou de documents anciens, une description de l'image doit être disponible.
• Le contenu doit être redistribué dans une largeur de 320 pixels CSS (défilement vertical) ou 256 pixels CSS (défilement horizontal) lorsqu'il est mis à l'échelle jusqu'à 400 %
• Les composants de l'interface utilisateur et toute séparation de couleurs non décorative doivent avoir un contraste d'au moins 3:1.
• Espacement minimal du texte :
  • La hauteur de ligne correspond à 1,5 fois la taille de la police.
  • L'espacement des paragraphes est 2x la taille de la police
  • L'espacement des lettres est 0,12x la taille de la police
  • L'espacement des mots correspond à 0,16 fois la taille de la police.
  • Si une langue ou une écriture donnée ne prend pas en charge l'une de ces options d'espacement, elle est exemptée de cette option à des fins d'accessibilité.
• Lorsque le contenu apparaît au survol ou au clavier :
  • Il devrait y avoir un moyen de rejeter le contenu sans changer de focus.
  • Le contenu ne doit pas disparaître tant que le pointeur ou le focus reste dessus.
  • Le contenu ne doit pas disparaître à moins que l'utilisateur ne le déclenche (c'est-à-dire en changeant le focus ou en rejetant le contenu) ou que l'information ne devienne invalide.
• Il existe plusieurs façons d'accéder à une page Web dans un ensemble d'autres pages Web, à moins que cette page ne soit une étape d'un processus.
• Tous les titres et étiquettes décrivent le sujet ou le but du contenu en dessous.
• L'indicateur de focus du clavier doit toujours être visible, le cas échéant.
• La langue d'un passage de texte est marquée par programmation.
  • Des exceptions peuvent être faites pour les noms, le jargon technique et la langue vernaculaire raisonnable.
• Les éléments de navigation doivent partager la même conception, le même emplacement et le même objectif sur toutes les pages Web.
• Les erreurs de saisie sont automatiquement détectées et des suggestions sont faites sur la façon de les résoudre.
• Si une page Web entraîne un engagement juridique, aboutit à une transaction financière ou soumet des réponses de test, elle doit inclure au moins l'une des caractéristiques suivantes :
  • La soumission est réversible.
  • Le site Web vérifie les omissions et les erreurs de données et offre à l'utilisateur la possibilité de les corriger.
  • L'utilisateur a la possibilité d'examiner, de corriger et de confirmer toute information qu'il a saisie.
• Le site Web présente des messages d'erreur et d'état à la technologie d'assistance même lorsque l'utilisateur ne se concentre pas sur le message d'erreur.

Conformité au niveau AAA

• Une interprétation en langue des signes est fournie pour tout média synchronisé préenregistré.
• Les médias préenregistrés ont des sous-titres codés avec une description audio étendue.
• Des alternatives non chronométrées sont fournies pour les médias vidéo uniquement.
• Des alternatives non chronométrées sont fournies pour les médias uniquement audio.
• Le contenu implémenté via des langages de balisage et l'objectif des composants de l'interface utilisateur peuvent être déterminés par programmation.
• Le contraste du texte normal est d'au moins 7:1. et le texte en gras est d'au moins 4,5:1.
• Si l'audio préenregistré est principalement de la parole, il ne doit y avoir aucun bruit de fond, ou la différence entre le bruit de fond et la parole doit être d'au moins 20 dB. Le contenu musical est exonéré.
• L'utilisateur doit pouvoir modifier le format des blocs de texte afin que :
  • les couleurs de premier plan et d'arrière-plan sont sélectionnables par l'utilisateur,
  • les paragraphes ne dépassent pas 80 caractères ou 40 glyphes chinois/japonais/coréens,
  • l'interligne est d'au moins 1,5 et l'espacement des paragraphes est d'au moins 3,
  • Le texte n'oblige pas l'utilisateur à faire défiler horizontalement lorsqu'il est redimensionné jusqu'à 200 %.
  • Les images de texte sont purement utilisées comme décoration. Les logos sont exemptés.
• Toutes les fonctionnalités d'un site Web sont accessibles uniquement avec une interface clavier.
• Aucune fonction sur un site Web ne doit être sensible au temps, à moins qu'elle ne soit liée à des événements du monde réel.
• Toute interruption non urgente peut être interrompue ou rejetée par l'utilisateur.
• Lorsqu'une session expire, les utilisateurs doivent pouvoir se ré-authentifier et reprendre la saisie d'informations.
• Les utilisateurs doivent être clairement informés si des données seront perdues après une période d'inactivité, et une option doit être fournie pour enregistrer les données de l'utilisateur et continuer à une date ultérieure.
• Les mouvements animés ne sont pas essentiels pour transmettre des informations.
• Les animations peuvent être désactivées.
• Lorsque les pages Web sont un ensemble connecté, il doit y avoir une indication visuelle et programmatique claire de l'emplacement d'un utilisateur.
• Le texte d'un lien doit identifier le but d'un lien.
• Le texte est organisé avec des balises d'en-tête HTML.
• Les boutons et autres cibles d'un pointeur doivent mesurer au moins 44 pixels sur 44 pixels.
• Les modalités d'entrée alternatives ne peuvent être bloquées par programmation que lorsque la restriction est nécessaire à des fins de sécurité valables.
• Les emprunts étrangers, les idiomes et le jargon technique sont définis avec un balisage de texte ou par des liens vers un dictionnaire approprié.
• Les abréviations sont définies ou peuvent être développées pour montrer le terme complet.
• Une version simplifiée du contenu devrait être disponible lorsqu'elle est écrite au-dessus d'un niveau de lecture de 9e année.
• Lorsque la prononciation d'un mot est ambiguë, une clé de prononciation doit être incluse.
• Les éléments de navigation ne doivent jamais changer de contexte, à moins que l'utilisateur n'initie le changement.
• Une aide contextuelle ou des info-bulles sont toujours disponibles.
• Lorsqu'une page Web demande à un utilisateur de soumettre des informations personnelles, au moins l'une de ces fonctionnalités est incluse :
  • La soumission est réversible.
  • Le site Web vérifie les omissions et les erreurs de données et offre à l'utilisateur la possibilité de les corriger.
  • L'utilisateur a la possibilité d'examiner, de corriger et de confirmer toute information qu'il a saisie.

FAQ sur la conception Web conforme

Quelles sont les directives officielles du site Web de l'ADA ?

Malgré des révisions aussi récentes que 2008, l'ADA ne mentionne pas spécifiquement les sites Web ou l'accessibilité à Internet. Des milliers de procès sont intentés chaque année au sujet de l'accessibilité en ligne, et les tribunaux ont utilisé les directives publiées par le World Wide Web Consortium (W3C), une organisation internationalement reconnue pour les normes Internet, comme modèle de conception conforme. Les directives pour l'accessibilité des contenus Web (WCAG) du Consortium sont publiées depuis 1999. Ces normes ont été adoptées en tant que norme ISO en 2012 et constituent la base des lois sur l'accessibilité du Web en Europe et en Asie. Les États-Unis imposent désormais la conformité WCAG AA-Tier pour tous les sites Web gouvernementaux, et les juges fédéraux font référence à ces normes lorsqu'ils statuent sur l'accessibilité des sites Web et les violations du titre III de l'ADA.

À quelle fréquence les directives de conformité changent-elles ?

Les directives ont été publiées pour la première fois en 1999, avec des révisions majeures en 2008 et 2018. WCAG 2.1 est la dernière mise à jour, publiée en juin 2018. Elle contient 17 nouveaux critères, principalement destinés à l'accessibilité pour les smartphones et autres petits appareils à écran tactile.

Le respect des directives 2.0 se traduira toujours par un site de bureau accessible. Cependant, les normes 2.0 ont été publiées il y a 11 ans et n'ont pas prédit la révolution des smartphones. Par conséquent, il n'y a pas de directives pour créer des sites Web mobiles conformes, et peu de conseils pour les entrées d'exploitation tactiles et gestuelles. Si votre site Web a été conçu pour être conforme à l'ADA avant 2018, il se peut qu'il ne réponde plus aux normes minimales de conformité, en particulier lorsqu'il est consulté sur un smartphone.

Quelle est la différence entre les niveaux de conformité A, AA et AAA ?

Les niveaux A sont des éléments et des fonctions qui doivent absolument être présents pour qu'une personne handicapée puisse utiliser votre site Web. Si une fonctionnalité de niveau A est absente, votre site Web n'est tout simplement pas accessible.

Le niveau AA contient des éléments fortement recommandés pour l'accessibilité. Si des fonctionnalités AA manquent, il sera très difficile pour les personnes ayant une déficience visuelle ou un handicap physique de naviguer sur votre site Web. Pour la conformité ADA, il s'agit du niveau d'accessibilité minimal acceptable.

Le niveau AAA contient les fonctionnalités d'accessibilité les plus avancées. Toutes ces fonctionnalités ne sont pas disponibles sur tous les sites Web ou plateformes numériques. Il est recommandé d'inclure autant de fonctionnalités AAA ou de fonctionnalités AAA partielles que possible, mais la conformité AAA totale n'est pas un objectif raisonnable pour la plupart des sites Web ou des types d'entreprises.

Les principes de la conception Web conforme à l'ADA

Perceptible

• Adaptable : le contenu ne doit pas perdre de structure ou de fonctionnalité lorsqu'il est présenté dans un autre format, par exemple lorsqu'il est agrandi ou traité par un lecteur d'écran.
• Distinguable : le contenu visuel et audio doit être clair et distinct, y compris le contraste entre les couleurs du texte et de l'arrière-plan, ainsi que les hyperliens et les boutons clairement marqués.
• Alternatives multimédias basées sur le temps : il devrait y avoir des alternatives facilement accessibles pour le contenu audio et vidéo, telles qu'une transcription complète des extraits sonores et des explications écrites de tous les graphiques ou tableaux.

Opérable

• Accessible au clavier : Toutes les fonctions d'un site Web doivent être disponibles avec un simple clavier. Les gestes et l'utilisation de la souris ne doivent jamais être la seule méthode de saisie.
• Navigable : il doit y avoir des indications claires sur l'endroit où se trouve un utilisateur sur un site Web et sur la manière d'accéder aux différentes pages connectées. Tous les boutons, liens et champs de saisie doivent être clairement étiquetés et faciles à distinguer.
• Gestes et entrées accessibles : la fonctionnalité ne doit jamais dépendre des gestes basés sur le chemin ou multipoints ou de l'activité du pointeur, et toute entrée doit avoir une option d'abandon ou d'annulation.

Compréhensible

• Lisible : tout contenu textuel doit pouvoir être analysé par un équipement d'assistance.
• Prévisible : les pages Web doivent fonctionner de manière cohérente et logique. Les boutons de navigation doivent conserver le même contexte avant et après utilisation, et tout changement de contexte doit être clair pour l'utilisateur.
• Aide à la saisie : les pages Web doivent aider les utilisateurs à éviter et à corriger les éventuelles erreurs. Tout message d'erreur doit avoir une explication claire, une suggestion pour le résoudre et une étiquette.

Robuste

• Compatibilité descendante : les sites Web doivent être capables de s'interfacer avec les générations précédentes de technologies d'assistance, ainsi que de répondre à toutes les normes actuelles.
• Conçu pour les technologies d'assistance : tous les éléments d'un site Web doivent avoir des noms, des rôles et des valeurs qui peuvent être déterminés par programmation par des lecteurs d'écran et d'autres appareils d'assistance.
• Balisage et messages d'état : le balisage du texte et les messages d'état importants doivent être programmés de manière à être accessibles aux lecteurs d'écran, même si le message n'est pas actuellement mis au point.

Les petites entreprises devraient-elles être conformes à l'ADA ?

Les petites entreprises, la plupart des entreprises saisonnières et les institutions religieuses sont légalement exemptées de la plupart des exigences du Titre III. Une sandwicherie familiale n'est pas légalement tenue d'installer une rampe pour fauteuil roulant, et un magasin de bricolage local ne peut pas être poursuivi pour avoir oublié de mettre du texte alternatif sur les photos de produits de son site Web. Même ainsi, il est logique, même pour la plus petite entreprise ayant une présence en ligne, de penser à la conformité ADA.

Être non conforme signifie plus que du texte difficile à lire et une navigation difficile. Lorsque des éléments essentiels comme le texte alternatif sur les images et les instructions pour remplir les champs de saisie sont manquants, les clients peuvent ne pas être en mesure de finaliser un achat. Certaines caractéristiques de conception plus anciennes peuvent même empêcher ceux qui disposent d'une technologie d'assistance à la lecture d'écran de voir votre numéro de téléphone et votre adresse. Être facilement accessible en ligne est logique pour presque tous les petits magasins.