Skip to content
Enjoy 20% off for 12 months on all plans. Use promo code: HYPERGROWTHClaim it

Accessibilité web : ce que la loi demande et ce qu'il faut corriger en premier

Par Toy Wen Da, Cofondateur · · 14 min de lecture

Traduit de l'original en anglais. Lire en anglais

L'accessibilité web, c'est concevoir votre site pour que les personnes en situation de handicap puissent le percevoir, le comprendre, s'y repérer et l'utiliser, qu'elles se servent d'un lecteur d'écran, d'un clavier, de sous-titres ou du zoom du navigateur. Concrètement, cela revient à respecter les Web Content Accessibility Guidelines (WCAG), la norme à laquelle renvoient la plupart des lois sur l'accessibilité.

Place de parking avec symbole de fauteuil roulant sur fond bleu, signalant l'accessibilité.

Ce guide s'adresse aux chefs d'entreprise et aux responsables marketing qui s'occupent du site de leur société. Il présente les personnes concernées, ce qu'exige la loi américaine, les obstacles que l'on retrouve sur la plupart des sites, les corrections que vous pouvez faire vous-même, et le moment où un spécialiste vaut son prix.

Ce que couvre l'accessibilité web

Le W3C, l'organisme qui fixe les standards du web, définit l'accessibilité web comme des sites, des outils et des technologies conçus pour que les personnes en situation de handicap puissent les utiliser. Autrement dit, elles peuvent percevoir le web, le comprendre, y naviguer, interagir avec lui, et aussi y contribuer.

Tim Berners-Lee, l'inventeur du web, a énoncé l'objectif simplement : « La force du Web réside dans son universalité. Que chacun puisse y accéder, quel que soit son handicap, en est un aspect essentiel. » L'Introduction to Web Accessibility du W3C s'ouvre sur cette phrase.

Panneau jaune d'accessibilité en fauteuil roulant peint sur un trottoir urbain parsemé de feuilles.

Qui a besoin d'un site accessible

WebAIM, qui forme les développeurs à la conception accessible, rappelle qu'un adulte américain sur quatre vit avec un handicap. Tous les handicaps n'affectent pas la façon dont on utilise internet. Pourtant, comme le dit WebAIM, peu d'entreprises écarteraient sciemment un quart de leurs clients potentiels, ni même 5 %.

Voici les principaux groupes :

  • Visuel : cécité, malvoyance et daltonisme. Ces personnes peuvent utiliser des lecteurs d'écran, qui lisent la page à voix haute, ou des loupes d'écran.
  • Auditif : surdité et perte d'audition. Ces personnes comptent sur les sous-titres et les transcriptions.
  • Moteur : motricité fine limitée ou impossibilité d'utiliser une souris. Ces personnes peuvent se servir d'un clavier, d'une baguette buccale, d'un logiciel de suivi du regard ou de commandes vocales.
  • Cognitif : troubles de l'apprentissage, distractibilité et difficulté à retenir beaucoup d'informations à la fois. Ici, une écriture claire et une mise en page logique comptent avant tout.

Le W3C cite aussi dans sa définition les handicaps de la parole et les handicaps neurologiques.

Les bénéfices vont bien au-delà du handicap

Le W3C énumère plusieurs groupes qui profitent d'une conception accessible sans avoir de handicap :

  • les personnes qui utilisent un téléphone ou une télévision connectée, avec des écrans réduits ou d'autres modes de saisie
  • les personnes âgées dont la vue ou l'ouïe évolue avec l'âge
  • les personnes atteintes d'un handicap temporaire, comme un bras cassé ou des lunettes perdues
  • les personnes limitées par leur situation, par exemple en plein soleil ou dans un lieu où elles ne peuvent pas écouter de son
  • les personnes disposant d'une connexion internet lente ou coûteuse

Ce recoupement explique pourquoi le travail sur l'accessibilité et celui sur l'ergonomie vont dans le même sens. Si vous suivez déjà un plan pour améliorer l'expérience utilisateur de votre site, beaucoup de ces changements comptent double.

La norme WCAG en termes simples

Les WCAG sont rédigées par le World Wide Web Consortium (W3C) et, selon le W3C, la version 2.2 est aussi une norme ISO, ISO/IEC 40500. WebAIM la décrit comme la base de la plupart des lois sur l'accessibilité web dans le monde.

Gros plan d'un symbole handicapé usé, peint sur le bitume, illustrant l'accessibilité.

Les lignes directrices reposent sur quatre principes, dont les initiales forment le mot POUR (« POUR » en anglais, pour Perceivable, Operable, Understandable, Robust) :

  1. Perceptible. Les utilisateurs peuvent accéder au contenu avec les sens dont ils disposent, ou grâce à une technologie d'assistance. Les images ont des alternatives textuelles et les vidéos des sous-titres.
  2. Utilisable. Chaque commande fonctionne au clavier ou avec un dispositif d'assistance aussi bien qu'à la souris. Rien ne dépend d'un mouvement précis de la souris.
  3. Compréhensible. Le contenu est clair et le site se comporte de manière prévisible.
  4. Robuste. Le code est assez propre pour que de nombreux navigateurs et outils d'assistance, anciens et récents, puissent le lire.

Pour les composants interactifs construits en JavaScript, les développeurs utilisent WAI-ARIA. Cette technologie du W3C ajoute un sens que les navigateurs et les outils d'assistance peuvent transmettre aux utilisateurs. La documentation MDN sur l'accessibilité de Mozilla la détaille en profondeur. MDN fait aussi une remarque plus simple : une grande quantité de contenu devient accessible simplement en utilisant le bon élément HTML pour chaque usage.

L'accessibilité web est-elle obligatoire ?

Souvent, oui. Les détails dépendent de qui vous êtes et de l'endroit où vous exercez. Lisez ce qui suit comme un résumé de recommandations publiques, et interrogez un avocat sur votre propre situation.

Panneau bleu de stationnement handicapé indiquant l'obligation d'identifier le véhicule et l'amende encourue.

L'ADA et votre site web

L'Americans with Disabilities Act couvre les États et les collectivités locales au titre du Title II. Il couvre les entreprises ouvertes au public au titre du Title III. Dans ses recommandations sur l'accessibilité web et l'ADA, datées du 18 mars 2022, le Department of Justice indique qu'il a toujours considéré que l'ADA s'applique aux services et aux biens proposés sur le web.

Parmi les exemples du DOJ pour le Title III figurent les commerces de détail, les banques, les hôtels, les hôpitaux et cabinets médicaux, les établissements de restauration et de boissons, ainsi que les théâtres et les stades. Si des clients peuvent entrer dans votre établissement, le DOJ estime que ce que vous proposez sur votre site web est couvert aussi.

Les mêmes recommandations précisent que les entreprises peuvent choisir comment se mettre en conformité, car le DOJ n'avait pas fixé de normes techniques détaillées pour elles. Elles doivent tout de même rendre accessible ce qu'elles proposent en ligne, et le DOJ cite les WCAG et les Section 508 Standards fédéraux comme références utiles.

États et collectivités locales : la règle de 2024

La page d'ADA.gov comporte sa propre réserve. Les recommandations de 2022 ne reflètent pas les exigences applicables aux États et aux collectivités locales publiées au Federal Register le 24 avril 2024. Si vous gérez ou construisez des sites pour un organisme public, lisez directement cette règle plutôt qu'un ancien résumé.

Section 504, Section 508 et autres pays

Le Rehabilitation Act de 1973 ajoute les Sections 504 et 508. La Section 508 fixe les normes que l'État fédéral applique à ses propres sites. En dehors des États-Unis, WebAIM note que de nombreuses lois internationales traitent aussi de l'accessibilité. La Convention des Nations unies relative aux droits des personnes handicapées va plus loin et considère l'accès au web comme un droit humain fondamental.

Règle ou norme À qui elle s'applique Ce que cela signifie pour un site web Où la lire
ADA Title II États et collectivités locales Le DOJ considère leurs services et programmes en ligne comme couverts ADA.gov, ainsi que la règle publiée le 24 avril 2024
ADA Title III Entreprises ouvertes au public, comme les commerces, banques, hôtels et cabinets médicaux Le DOJ considère les biens et services proposés en ligne comme couverts, avec de la souplesse sur la manière de s'y conformer Recommandations du DOJ datées du 18 mars 2022
Section 508 du Rehabilitation Act de 1973 Agences fédérales Fixe les normes d'accessibilité que suivent les sites fédéraux Les Section 508 Standards
WCAG du W3C Tout le monde ; la plupart des lois sur l'accessibilité s'en inspirent La liste de contrôle technique que la plupart des équipes utilisent pour leurs tests ; les WCAG 2.2 sont aussi la norme ISO/IEC 40500 La Web Accessibility Initiative du W3C
Convention des Nations unies relative aux droits des personnes handicapées Pays qui l'ont ratifiée Considère l'accès au web comme un droit humain fondamental Les Nations unies

Les obstacles d'accessibilité que la plupart des sites ont encore

UserWay, une entreprise qui vend des logiciels d'accessibilité, indique que 96 % des principaux sites web présentent des problèmes d'accessibilité facilement détectables. C'est un chiffre du fournisseur lui-même, mais il rejoint l'analyse de WebAIM selon laquelle le potentiel du web pour les personnes en situation de handicap « reste largement inexploité ».

Mur de béton brun orné d'un symbole de fauteuil roulant peint, indiquant l'accessibilité. Large espace libre pour du texte.

Les recommandations du DOJ reviennent sans cesse sur les mêmes obstacles. Les voici avec leur correction et une réponse franche sur la possibilité de la faire vous-même.

Obstacle Qui il bloque La correction Pouvez-vous le corriger vous-même ?
Images sans texte alternatif Utilisateurs aveugles qui se servent de lecteurs d'écran Ajouter un court texte alternatif qui dit à quoi sert l'image Oui, dans la plupart des systèmes de gestion de contenu
Faible contraste des couleurs Personnes malvoyantes ou daltoniennes Assombrir le texte ou éclaircir l'arrière-plan jusqu'à ce que le texte ressorte nettement En général, même si les changements de couleurs de marque peuvent nécessiter un designer
Couleur comme seul signal Utilisateurs daltoniens et utilisateurs de lecteurs d'écran Ajouter une indication textuelle, comme le mot « obligatoire » à côté d'un champ de formulaire rouge Oui
Vidéos sans sous-titres Personnes sourdes ou malentendantes Ajouter des sous-titres précis et synchronisés qui identifient les locuteurs Oui, ou avec un service de sous-titrage
Audio sans transcription Personnes sourdes ou malentendantes Publier une transcription textuelle avec l'audio Oui ; le W3C juge les transcriptions faciles et relativement peu coûteuses
Champs de formulaire sans libellé ou messages d'erreur vagues Utilisateurs de lecteurs d'écran et personnes ayant des troubles cognitifs Libeller chaque champ, donner des instructions claires et expliquer chaque erreur et comment la corriger En partie ; il faut souvent un développeur
Menus et boutons qui exigent une souris Personnes qui ne peuvent pas utiliser de souris, y compris les utilisateurs de commande vocale Rendre chaque fonction utilisable au clavier Il faut généralement un développeur
Titres choisis pour leur taille de police Utilisateurs de lecteurs d'écran qui passent d'un titre à l'autre Utiliser de vraies balises de titre dans un ordre logique Oui
Liens qui disent « cliquez ici » Utilisateurs de lecteurs d'écran qui parcourent une liste de liens Rédiger des textes de lien qui se comprennent seuls Oui

Images, vidéo et audio

Le texte alternatif doit décrire la fonction d'une image. Le DOJ précise que, pour être utile, il doit être court et descriptif. Une photo de produit a besoin du nom du produit. Un graphique a besoin de l'idée qu'il illustre.

Pour la vidéo, le DOJ demande des sous-titres synchronisés, précis, qui identifient la personne qui parle. Pour l'audio archivé, comme un ancien épisode de podcast, WebAIM indique qu'une transcription peut suffire.

Formulaires et utilisation du clavier

Les formulaires sont l'endroit où les problèmes d'accessibilité vous coûtent le plus directement de l'argent. Un client qui ne peut pas valider un formulaire de réservation ou de paiement s'en va, tout simplement. Chaque champ a besoin d'un libellé qu'un lecteur d'écran peut annoncer, comme « numéro de carte bancaire » sur le champ de la carte. Quand quelqu'un se trompe, la page doit le lui signaler immédiatement, dire ce qui n'a pas fonctionné et expliquer comment le corriger. Une date saisie dans le mauvais format est l'exemple donné par le DOJ lui-même.

L'accès au clavier est l'autre moitié du sujet. Certaines personnes ne peuvent pas du tout utiliser de souris, et beaucoup d'utilisateurs âgés dont la motricité fine est limitée en font partie. Quand chaque menu et chaque formulaire fonctionnent au clavier, les personnes qui utilisent la saisie vocale et d'autres outils qui se comportent comme un clavier peuvent aussi utiliser votre site. La taille du texte compte également : les personnes malvoyantes doivent pouvoir zoomer avec le navigateur sans que la page se désagrège.

Structure : titres, liens, tableaux et documents

Les utilisateurs de lecteurs d'écran se déplacent souvent dans une page grâce à ses titres, ou écoutent uniquement ses liens. Les titres doivent donc être de véritables éléments de titre dans un ordre cohérent, et chaque lien doit avoir un sens hors contexte. Vous pouvez voir le plan des titres d'une page, ainsi que sa balise title, dans un outil gratuit de vérification des titres et des balises meta.

Les tableaux de données ont besoin de cellules d'en-tête pour qu'un lecteur d'écran puisse relier chaque valeur à sa ligne et à sa colonne. Les PDF et les fichiers Word demandent le même soin. WebAIM recommande les PDF balisés, ou une version HTML lorsqu'un document ne peut pas être rendu accessible. Un lien « Aller au contenu principal » en haut de chaque page permet aux utilisateurs du clavier de passer le menu qui se répète sur toutes les pages.

Comment l'accessibilité web et le SEO se recoupent

Une bonne partie de ce qui rend une page accessible la rend aussi plus facile à lire pour les moteurs de recherche. Le W3C souligne que les moteurs de recherche ne voient pas non plus les images. Ils lisent le texte alternatif, comme le fait un lecteur d'écran, et une transcription transforme l'audio en texte qu'ils peuvent lire.

Le recoupement dépasse les médias :

  • Les titres donnent aux utilisateurs de lecteurs d'écran une carte de la page. Ils donnent aux robots d'exploration un plan clair du sujet de la page.
  • Un texte de lien descriptif indique à l'utilisateur d'un lecteur d'écran comme au moteur de recherche ce que couvre la page suivante. « Tarifs de nettoyage de bureaux » vaut mieux que « cliquez ici » pour les deux.
  • Un HTML propre est aussi payant. WebAIM note qu'un code accessible est généralement plus léger et plus efficace, et que du HTML et du CSS valides rendent le code plus solide.
  • De nombreux obstacles qui gênent les personnes en situation de handicap frustrent aussi les utilisateurs de téléphones sur de petits écrans.

Soyez réaliste sur ce que cela signifie. Le travail d'accessibilité ne fera pas à lui seul classer une page, et la raison de corriger un obstacle est que, sans cela, des personnes ne peuvent pas utiliser votre site. Le bénéfice pour la recherche vient d'une structure plus claire et d'un meilleur contenu. Pour en savoir plus sur la façon dont la structure, le contenu et les corrections techniques s'articulent, parcourez le blog SearchBlueprint.

Comment vérifier vous-même l'accessibilité de votre site

Vous pouvez repérer beaucoup de choses en un après-midi, sans logiciel particulier. Le W3C publie un guide intitulé « Easy Checks », un premier examen de l'accessibilité web, fondé sur cette idée précise : des étapes simples, comme modifier les paramètres du navigateur, vous montrent où se trouvent les problèmes évidents.

Des vérifications rapides à faire dès aujourd'hui

  1. Lâchez la souris et parcourez avec la touche Tab votre page d'accueil et votre formulaire le plus important. Voyez-vous toujours où vous en êtes, pouvez-vous atteindre chaque lien et envoyer le formulaire ?
  2. Poussez le zoom de votre navigateur bien au-delà de la taille normale et vérifiez si le texte reste lisible ou s'il commence à se chevaucher et à être coupé.
  3. Examinez vos images. Regardez le texte alternatif sur vos pages clés. Est-il absent, ou bourré de mots-clés au lieu de décrire l'image ?
  4. Lisez vos titres dans l'ordre. Forment-ils un plan logique, ou sautent-ils de H1 à H4 parce que quelqu'un aimait la taille de la police ?
  5. Lancez une vidéo sans le son. Y a-t-il des sous-titres, et sont-ils précis ?
  6. Provoquez volontairement une erreur dans un formulaire. Laissez un champ obligatoire vide et envoyez. L'erreur explique-t-elle le problème avec des mots, ou se contente-t-elle de colorer une case en rouge ?
  7. Lancez un outil de vérification automatique. Les outils gratuits signalent en quelques minutes les textes alternatifs manquants et les contrastes trop faibles.

Si vous voulez une liste plus large à parcourir en parallèle, cette liste de contrôle d'audit de site avec 25 vérifications gratuites couvre les bases techniques et celles de la page.

Pourquoi les outils automatiques et les overlays ont des limites

Les outils de vérification automatique sont utiles. Ils passent aussi à côté de beaucoup de choses. Le W3C est direct sur ce point : aucun outil ne peut à lui seul déterminer si un site respecte les lignes directrices d'accessibilité, et une évaluation humaine compétente est nécessaire. Le DOJ compare les vérificateurs automatiques et les overlays aux correcteurs d'orthographe et de grammaire, qui n'aident que si on les utilise avec soin, et il avertit qu'un rapport « propre » ne signifie pas forcément que le site est accessible.

Cette prudence vaut pour les overlays, ces widgets qui ajoutent une barre d'outils d'accessibilité et promettent de corriger les problèmes courants au chargement de chaque page. Des fournisseurs comme UserWay les vendent avec des audits manuels et du suivi. Un widget ne peut pas savoir si votre texte alternatif décrit le bon élément, ni si les messages d'erreur de vos formulaires ont du sens. Considérez-le comme une couche supplémentaire par-dessus la correction de vos pages.

Quand faire appel à un professionnel

Faire soi-même fonctionne bien pour les corrections de contenu : textes alternatifs, sous-titres, titres, textes de lien et écriture claire. Faites appel à un expert lorsque :

  • vous utilisez des composants JavaScript sur mesure, comme des sélecteurs de date ou des carrousels, qui exigent ARIA et une gestion du clavier
  • vos formulaires de paiement, de réservation ou de candidature sont complexes
  • vous prévoyez une refonte, puisque le W3C indique qu'il est plus efficace d'intégrer l'accessibilité dès le départ plutôt que de refaire le travail plus tard
  • vous avez besoin d'un audit formel, par exemple parce que le processus d'achat d'un client ou un courrier juridique en réclame un

La courbe d'apprentissage est plus courte que beaucoup ne le pensent. WebAIM affirme qu'un développeur peut apprendre les bases de l'accessibilité web en quelques jours, même s'il faut souvent des mois pour que l'état d'esprit et les techniques deviennent un réflexe. Si vous voulez vous former vous-même, le W3C propose une vidéo d'introduction de 4 minutes et un cours en ligne gratuit, Digital Accessibility Foundations.

Intégrez l'accessibilité à votre façon de publier

Les corrections ponctuelles se dégradent. Un nouvel article de blog est mis en ligne sans texte alternatif, une nouvelle vidéo sort sans sous-titres, et une refonte supprime le lien d'évitement. Le conseil de WebAIM aux organisations est de sensibiliser, de rallier la direction et d'appuyer la démarche sur une politique écrite, pour que l'accessibilité entre dans la routine quotidienne.

Pour une petite équipe, cela peut se résumer à quelques lignes ajoutées à chaque brief de contenu :

  • chaque image reçoit un texte alternatif qui dit ce qu'elle montre ou ce qu'elle fait
  • chaque vidéo reçoit des sous-titres avant sa mise en ligne
  • les titres suivent un ordre logique
  • le texte du lien indique où mène le lien
  • les formulaires sont testés au clavier avant le lancement

Relancez ensuite vos vérifications après chaque mise en production, comme vous réauditeriez tout ce qui dérive avec le temps. Vous pouvez voir cette habitude à l'œuvre dans notre étude de cas, où nous avons audité notre propre site.

Questions fréquentes

L'accessibilité web est-elle une obligation légale pour les petites entreprises ?

Aux États-Unis, la position du DOJ est que l'ADA couvre les entreprises ouvertes au public, et que les biens et services qu'elles proposent en ligne sont couverts aussi. Le DOJ laisse aux entreprises une certaine souplesse sur la manière de se conformer, mais attend que le résultat soit accessible. D'autres pays ont leurs propres lois : vérifiez donc les règles de l'endroit où vous exercez.

Qu'est-ce que les WCAG, et quelle version suivre ?

Les WCAG, les Web Content Accessibility Guidelines, sont la norme internationale du W3C pour un contenu web accessible. Le W3C note que les WCAG 2.2 sont aussi publiées comme norme ISO ISO/IEC 40500, ce qui en fait la version naturelle pour vos tests.

Un overlay d'accessibilité rendra-t-il mon site conforme ?

Pas à lui seul. Le DOJ explique que les vérificateurs automatiques et les overlays peuvent aider mais demandent une utilisation prudente, et qu'un rapport propre ne signifie pas forcément que le site est accessible. Le W3C ajoute qu'une évaluation humaine est nécessaire pour confirmer qu'un site respecte les lignes directrices.

L'accessibilité web aide-t-elle le SEO ?

Indirectement. Les textes alternatifs, les transcriptions, des titres logiques et des liens descriptifs aident les moteurs de recherche à comprendre une page, tout comme les personnes qui utilisent une technologie d'assistance. Considérez le bénéfice pour la recherche comme un bonus.

Combien de temps faut-il pour rendre un site web accessible ?

Cela dépend. Les corrections de contenu, comme les textes alternatifs et les sous-titres, peuvent démarrer dès cette semaine, tandis que les problèmes de code, comme l'accès au clavier, demandent du temps de développeur et dépendent de la façon dont le site a été construit. WebAIM affirme qu'un développeur peut apprendre les bases en quelques jours. Intégrer l'accessibilité dès le départ, note le W3C, est plus efficace que de revenir refaire le travail.

Parcourez votre page la plus importante avec la touche Tab cette semaine

Choisissez la page qui rapporte le plus d'affaires et lâchez la souris. Essayez d'accomplir sa tâche principale avec le seul clavier, et notez chaque endroit où vous êtes bloqué. Cette liste est le point de départ de votre travail d'accessibilité web. Pour voir comment un examen complet d'un site présente les problèmes et les corrections, consultez notre exemple de rapport d'audit SEO, puis parlez à l'équipe de ce que couvrirait un examen de votre propre site.

Ressources / Références

  1. Introduction to Web Accessibility
  2. WebAIM
  3. Documentation MDN sur l'accessibilité
  4. recommandations sur l'accessibilité web et l'ADA
Voyez ce que cela donne sur votre propre siteCollez une URL et SearchBlueprint la note avec le même moteur de contenu que celui qui a noté cet article, puis vous indique les correctifs à apporter, dans l'ordre où ils rapportent le plus.Obtenir votre plan gratuit

Sources

À propos de l'auteur

SearchBlueprint a recherché, rédigé et noté cet article avec la chaîne de production de contenu que nos clients utilisent sur leurs propres sites. La note affichée dans la signature est celle que notre moteur de contenu a attribuée à cette page avant sa publication. Rien ici n'est relu à la main, et c'est tout l'intérêt : c'est le résultat du produit, publié là où chacun peut le vérifier.