Un site web inaccessible, c’est comme une porte fermée à 12 millions de personnes en France. Pourtant, rendre un site accessible n’est pas si compliqué, à condition de suivre les bonnes étapes et de comprendre les règles du RGAA.
Ce guide va droit au but : comprendre ce qu’est le RGAA, à qui il s’applique, et comment intégrer concrètement l’accessibilité dans vos projets. Que vous soyez développeur, designer ou chef de projet, vous trouverez ici des réponses claires, des outils concrets et des bonnes pratiques faciles à mettre en œuvre.
Objectif : un site utilisable par tous, respectueux de la loi, et prêt pour le référencement. On commence.
Comprendre le RGAA et les enjeux de l'accessibilité numérique
Qu'est-ce que le RGAA et à qui s'applique-t-il ?
Le RGAA, c'est le Référentiel Général d'Amélioration de l'Accessibilité. Il a été créé par l'État français pour rendre les sites web accessibles à tous, y compris aux personnes en situation de handicap.
Il s'appuie sur les normes WCAG du W3C (le World Wide Web Consortium). Ces normes définissent les bonnes pratiques à suivre pour que l'information soit lisible, compréhensible et utilisable par tous.
Le RGAA s'applique à toutes les administrations publiques, les collectivités locales, les établissements publics, et depuis peu, certaines entreprises privées (notamment celles avec un chiffre d'affaires élevé ou une mission de service public).
En clair, si vous êtes concerné, vous devez garantir la conformité RGAA de votre site. Cela passe par un audit accessibilité, des tests utilisateurs handicap, et la mise en place de correctifs techniques.
Pourquoi l'accessibilité web est-elle essentielle ?
L'accessibilité numérique, ce n'est pas juste une obligation légale. C'est une question d'inclusion. En France, plus de 12 millions de personnes sont touchées par un handicap. Un site inaccessible, c'est un mur pour elles.
Imaginez : vous ne pouvez pas utiliser une souris. Ou vous êtes aveugle. Si le site ne permet pas la navigation clavier ou ne fournit pas d'alternative textuelle aux images, vous êtes bloqué.
Découvre quels sont les types de handicap concernés par l'accessibilité web.
Mais l'accessibilité ne concerne pas que le handicap. Un site bien conçu est plus facile à utiliser pour tout le monde : seniors, utilisateurs sur mobile, ou dans un environnement bruyant.
Un site accessible permet une meilleure ergonomie web, un affichage correct sur tous les écrans (accessibilité mobile), un bon contraste couleurs pour les malvoyants, et une structure sémantique claire pour les lecteurs d'écran.
Et en bonus, ça aide aussi le SEO. Un site structuré, compréhensible, rapide à lire pour les machines, c'est aussi plus facile à indexer pour Google.
Pour y arriver, on peut s'appuyer sur des balises ARIA, des outils de validation comme AccessiWeb ou Tanaguru, et surtout, une bonne formation accessibilité pour les équipes.
Quelles sont les obligations légales en matière d'accessibilité numérique ?
Loi, décret et sanctions : ce que dit la réglementation
En France, l'accessibilité numérique est encadrée par la loi. C'est la loi n°2005-102 du 11 février 2005 qui a posé les bases. Elle impose à tous les services publics de rendre leurs sites accessibles à tous, y compris aux personnes en situation de handicap.
Le décret n°2019-768 du 24 juillet 2019 précise les modalités. Il impose la mise en conformité avec le RGAA (Référentiel Général d'Amélioration de l'Accessibilité), basé sur les normes WCAG du W3C.
En cas de non-respect, il y a des sanctions. L'amende peut aller jusqu'à 25 000 € par an. Mais au-delà de l'amende, c'est surtout une question d'image et d'éthique. Ne pas être accessible, c'est exclure une partie de vos utilisateurs.
Quels sites et services sont concernés par le RGAA ?
Le RGAA s'applique à toutes les administrations publiques (État, collectivités, établissements publics), les entreprises délégataires de service public, et les organismes privés avec un chiffre d'affaires supérieur à 250 millions d'euros.
Ça concerne aussi bien les sites web que les applications mobiles. Même les intranets sont concernés s'ils sont utilisés par des agents en situation de handicap.
Donc si vous êtes une mairie, un ministère, une grande entreprise ou un prestataire d'un service public, vous devez respecter la conformité RGAA.
Déclaration d'accessibilité et schéma pluriannuel : obligations à respecter
Deux documents sont obligatoires :
- La déclaration d'accessibilité : elle indique le niveau de conformité du site avec le RGAA. Elle doit être publiée sur le site, accessible depuis toutes les pages.
- Le schéma pluriannuel : c'est un plan d'action sur 3 ans pour améliorer l'ergonomie web et l'accessibilité. Il doit être mis à jour tous les ans.
Ces documents doivent être rédigés après un audit accessibilité. L'audit permet d'identifier les écarts avec le RGAA. Il peut être fait en interne ou par un prestataire spécialisé.
Pour être dans les clous, vous devez aussi publier un plan d'action annuel. Il décrit les actions concrètes prévues pour améliorer l'accessibilité mobile, la navigation clavier, les balises ARIA, etc.
Et surtout, n'oubliez pas de former vos équipes. La formation accessibilité est essentielle pour garantir une mise en œuvre durable.
Les principes fondamentaux pour rendre un site accessible
Structuration sémantique et navigation
Pour que votre site respecte le référentiel général d'amélioration de l'accessibilité (RGAA), la première étape, c'est la structure sémantique. En clair, il faut utiliser les bonnes balises HTML pour chaque type de contenu. Un titre doit être dans une balise <h1>, un paragraphe dans une balise <p>, une liste dans une balise <ul> ou <ol>.
Cela permet aux lecteurs d'écran de comprendre la hiérarchie de la page. Et ça aide aussi le référencement naturel. Par exemple, un menu doit être dans une balise <nav> et un pied de page dans <footer>.
Pensez aussi à la navigation clavier. Une personne qui ne peut pas utiliser une souris doit pouvoir naviguer avec la touche Tab. Testez votre site sans souris : si vous êtes bloqué, c'est qu'il y a un souci.
Gestion des images, médias et alternatives textuelles
Chaque image doit avoir une alternative textuelle via l'attribut alt. Ce texte décrit l'image pour les personnes qui ne peuvent pas la voir. Si l'image est décorative, laissez l'attribut vide : alt="".
Pour les vidéos, ajoutez des sous-titres et, si possible, une transcription. Pour les contenus audio, proposez une version texte. Ces éléments sont essentiels pour respecter les normes WCAG et le RGAA.
Les lecteurs d'écran ne peuvent pas interpréter les images ou les sons. Il faut donc toujours fournir une version accessible de ces contenus.
Contrastes, couleurs et présentation de l'information
Le contraste couleurs entre le texte et le fond doit être suffisant. Le RGAA recommande un ratio minimum de 4,5:1 pour le texte normal. Utilisez des outils de validation comme Color Contrast Checker pour vérifier ça.
Ne comptez jamais uniquement sur la couleur pour transmettre une information. Par exemple, si un champ est en erreur, ne le montrez pas seulement en rouge. Ajoutez un message clair à côté, comme "Ce champ est obligatoire".
Voici un exemple simple : un bouton qui devient vert et affiche "Validé" est préférable à un bouton qui devient simplement vert sans indication textuelle.
Accessibilité des formulaires et contenus interactifs
Les formulaires sont souvent un point noir en accessibilité numérique. Chaque champ doit avoir un <label> associé. Et ce label doit être lié au champ avec l'attribut for.
Ajoutez des indications claires : format attendu, champs obligatoires, messages d'erreur. Ces messages doivent être lisibles par les lecteurs d'écran, donc utilisez les balises ARIA si besoin, comme aria-describedby.
Les boutons, menus déroulants, carrousels, etc. doivent être accessibles au clavier. Si vous utilisez du JavaScript, testez avec un lecteur d'écran ou faites un audit accessibilité avec un outil comme Axe ou Wave.
Enfin, testez avec de vraies personnes. Rien ne remplace les tests utilisateurs handicap. Ils vous diront ce qui fonctionne ou pas, mieux que n'importe quel outil.
Étapes pratiques pour créer un site conforme au RGAA
Intégrer l'accessibilité dès la conception
Quand je commence un projet web, je pense accessibilité numérique dès les premières maquettes. C'est comme construire une maison : si les portes sont trop étroites dès le plan, on ne pourra pas les élargir facilement plus tard.
Je recommande de travailler avec un designer qui connaît le référentiel général d'amélioration de l'accessibilité (RGAA). Il doit penser aux contrastes, à la structure sémantique, aux tailles de texte et à la navigation clavier.
J'intègre dès le début les contrastes de couleurs conformes aux normes WCAG, une hiérarchie claire avec des balises HTML appropriées, des menus accessibles au clavier, et la présence d'alternative textuelle pour les images.
Je conseille aussi de prévoir des composants compatibles avec les balises ARIA. Ça permet de mieux décrire les éléments pour les lecteurs d'écran. Je te conseille de suivre mes ressources pour savoir comment créer un site web accessible et conforme au RGAA.
Utiliser les bons outils et frameworks
Il existe des frameworks qui facilitent la conformité RGAA. Par exemple, Bootstrap propose une bonne base, mais il faut le configurer correctement. Je préfère souvent utiliser des composants maison pour garder le contrôle.
Quelques outils utiles sont WAVE (extension pour analyser les problèmes d'accessibilité), axe DevTools (très utile dans Chrome pour tester rapidement), Color Contrast Analyzer (pour vérifier les contrastes couleurs), et ARIA landmarks (pour baliser les zones importantes du site).
Je recommande aussi d'utiliser des CMS ou frameworks qui respectent les standards du W3C. WordPress, par exemple, peut être accessible si on choisit bien le thème.
Procéder à des tests et audits d'accessibilité
Une fois le site en place, je ne me contente pas d'un test automatique. J'effectue un audit accessibilité complet. Les outils détectent beaucoup de choses, mais pas tout.
Je fais toujours des tests de navigation clavier (tout doit être accessible sans souris), des vérifications avec un lecteur d'écran (NVDA ou VoiceOver), et des tests utilisateurs handicap pour voir les vrais blocages.
Pour aller plus loin, je recommande de faire appel à un expert RGAA ou à un organisme comme AccessiWeb. Ils peuvent valider la conformité RGAA et proposer des pistes d'amélioration.
Enfin, je forme les équipes. Une formation accessibilité permet à chacun de coder ou rédiger en pensant à tous les utilisateurs. C'est un vrai changement de culture, mais ça vaut le coup.
Outils et ressources pour valider l'accessibilité de votre site
Outils de vérification automatique et manuelle
Pour vérifier la conformité RGAA de votre site, il faut combiner des outils automatiques et des tests manuels. Les outils automatiques détectent les erreurs techniques. Les tests manuels permettent de valider l'expérience réelle, notamment pour les utilisateurs en situation de handicap.
Voici quelques outils particulièrement utiles :
- AChecker : outil en ligne qui scanne vos pages selon les normes WCAG et le RGAA.
- Tanaguru : open source, il permet un audit accessibilité complet avec des rapports détaillés.
- Wave : extension de navigateur qui montre visuellement les erreurs d'accessibilité numérique.
- axe DevTools : extension Chrome/Firefox pour inspecter les erreurs d'HTML et de balises ARIA.
- NVDA ou VoiceOver : lecteurs d'écran pour tester l'expérience utilisateur réelle.
Ces outils ne remplacent pas les tests humains. Il est essentiel de tester la navigation clavier, le contraste des couleurs, la présence d'alternatives textuelles sur les images, et la structure sémantique des pages.
Je vous conseille aussi de faire appel à des tests utilisateurs handicap. Rien ne vaut un retour réel pour détecter les problèmes invisibles.
Se former et rester à jour sur les évolutions du RGAA
Le référentiel général d'amélioration de l'accessibilité évolue régulièrement. Il suit les mises à jour des normes WCAG du W3C. Il faut donc se former en continu.
Plusieurs ressources peuvent vous aider :
- AccessiWeb : propose des guides et des formations sur l'accessibilité numérique.
- Le site officiel du RGAA : contient la documentation complète et les dernières versions du référentiel.
- Formation accessibilité de l'INRIA ou de l'ENI : pour les développeurs, intégrateurs et designers.
- MOOC Accessibilité numérique sur Fun-MOOC : gratuit et très pédagogique.
Je vous recommande aussi de suivre les actualités du W3C et de participer à des événements comme Paris Web ou Accessibilité Days. C'est un bon moyen d'échanger avec la communauté et de rester à jour.
Enfin, intégrez des outils de validation dans votre workflow : linters, CI/CD, tests unitaires. Ça vous évite les oublis.
Bonnes pratiques pour une accessibilité durable et inclusive
Créer un site accessible, ce n'est pas juste cocher des cases. C'est un travail continu. Pour garantir une accessibilité numérique durable, il faut intégrer les bonnes pratiques dès le départ et les maintenir dans le temps.
Je vous partage ici les réflexes que j'applique sur tous les projets web. Ces pratiques sont simples, mais elles font toute la différence pour les personnes en situation de handicap.
Commencez toujours par une structure sémantique claire. Utilisez les balises HTML comme il faut : <header>, <nav>, <main>, <footer>, <section>, <article>. Ces balises aident les lecteurs d'écran à comprendre la page.
Ensuite, pensez à la navigation clavier. Tout doit être accessible sans souris. Vérifiez que les menus, les formulaires et les boutons sont utilisables avec la touche Tab. C'est une base de l'ergonomie web.
Pour les images, ajoutez toujours une alternative textuelle avec l'attribut alt. Si l'image est décorative, laissez l'attribut vide : alt="". Ça évite de polluer la lecture vocale.
Le contraste couleurs est un autre point clé. Le texte doit être lisible, même pour les personnes malvoyantes ou daltoniennes. Utilisez les outils de validation comme le contrast checker de WebAIM pour tester vos couleurs.
Les balises ARIA peuvent compléter le HTML, mais ne doivent pas le remplacer. Utilisez-les pour préciser le rôle d'un élément ou l'état d'un composant dynamique. Par exemple : aria-expanded pour un menu déroulant.
Voici quelques bonnes pratiques essentielles :
- Respecter le référentiel général d'amélioration de l'accessibilité (RGAA)
- Faire un audit accessibilité à chaque refonte
- Former les équipes à l'accessibilité mobile et desktop
- Prévoir des tests utilisateurs handicap réguliers
Enfin, l'accessibilité web ne doit pas dépendre d'une seule personne. C'est une culture à diffuser dans toute l'équipe : développeurs, designers, rédacteurs, chefs de projet. Une formation accessibilité régulière aide à garder les bons réflexes.
Suivez les recommandations du W3C et les normes WCAG pour rester aligné avec les standards internationaux. Et surtout, pensez toujours à l'utilisateur final. C'est lui qui donne du sens à votre travail.