Accessibilité web : rendre son site inclusif (WCAG 2.2, RGAA, EAA)

Environ 6 milliards de personnes utilisent internet en 2025, soit 74 % de la population mondiale (UIT, 2025). Parmi elles, des millions naviguent avec un lecteur d’écran, au clavier, avec un zoom à 200 % ou sans le son. Un site qui ne prévoit pas ces usages les exclut, et depuis le 28 juin 2025 il peut aussi exposer son éditeur à des sanctions.

Cet article fait le point sur les enjeux de l’accessibilité du web, sur les règles en vigueur en 2026 (WCAG 2.2, RGAA, European Accessibility Act) et sur les étapes concrètes pour rendre un site accessible, en particulier avec Webflow.

Article publié en 2021, entièrement mis à jour le 5 octobre 2026.

Accessibilité numérique : pourquoi optimiser son site ?

Qu’est-ce que l’accessibilité numérique ?

Un site accessible est un site que chacun peut percevoir, comprendre et utiliser, avec ou sans handicap, sur ordinateur comme sur mobile.

Les WCAG 2.2 (Web Content Accessibility Guidelines) organisent les règles autour de quatre principes. Un site accessible doit être :

• Perceptible : l’information et l’interface sont présentées de façon perceptible par tous (contrastes, textes alternatifs pour les images, sous-titres…).
• Utilisable : toutes les fonctions sont accessibles au clavier, les cibles sont assez grandes, la navigation guide l’utilisateur (titres, liens explicites, focus visible).
• Compréhensible : les contenus sont lisibles et le site aide l’utilisateur à éviter et à corriger ses erreurs de saisie.
• Robuste : le code est assez propre pour être interprété de façon fiable par les navigateurs et les technologies d’assistance, comme les lecteurs d’écran.

L’accessibilité du web : qui est concerné ?

Tout le monde, mais d’abord les personnes en situation de handicap. Selon l’OMS, environ 1,3 milliard de personnes, soit 16 % de la population mondiale, vivent avec un handicap important.

Plusieurs formes de handicap peuvent gêner la navigation :

• déficiences visuelles (cécité, malvoyance, daltonisme) ;
• déficiences auditives ;
• troubles moteurs, qui empêchent par exemple d’utiliser une souris ;
• troubles cognitifs, de l’attention ou de l’apprentissage.

Les seniors sont aussi concernés : les plus de 65 ans représentaient 10,3 % de la population mondiale en 2024, et cette part augmente chaque année (ONU, World Population Prospects 2024). Avec l’âge, la vue, l’ouïe et la précision des gestes baissent.

Enfin, l’accessibilité sert aussi les situations temporaires : un bras dans le plâtre, un écran en plein soleil, une vidéo regardée sans le son dans les transports. Elle concerne tous les appareils, de l’ordinateur au mobile.

Pourquoi concevoir un site accessible ?

Toucher une plus grande audience

Chaque obstacle d’accessibilité fait perdre des visiteurs, et ce sont parfois des clients. Un formulaire de contact impossible à remplir au clavier, c’est une demande de devis qui n’arrive jamais.

Une question d’équité

Rendre ses pages accessibles demande un effort, mais le web a été pensé comme universel. Quand un service n’existe plus qu’en ligne, comme la réservation d’un billet de train, un site inaccessible exclut une partie des gens du service lui-même.

Améliorer son référencement

Les robots des moteurs de recherche, et ceux des moteurs génératifs comme ChatGPT ou Perplexity, lisent une page à peu près comme un lecteur d’écran : ils s’appuient sur la structure des titres, les textes alternatifs, les libellés des liens et les transcriptions. Un site accessible est donc un site plus facile à comprendre et à citer.

Ces améliorations profitent aussi à tous les visiteurs : un texte bien contrasté se lit mieux en plein soleil, un bouton plus grand se touche mieux sur mobile.

Respecter la réglementation

Depuis juin 2025, l’European Accessibility Act s’applique à de nombreux services privés, quelle que soit la taille de l’entreprise ou presque.

Ce que dit la réglementation en 2026

WCAG 2.2 : la référence internationale

Les WCAG sont publiées par la Web Accessibility Initiative (WAI), une initiative du W3C. La version en vigueur est la WCAG 2.2, recommandation du W3C depuis octobre 2023. Elle ajoute neuf critères à la version 2.1, dont la taille minimale des cibles, la visibilité du focus et l’authentification accessible.

Chaque critère a un niveau : A (minimum), AA (le niveau visé par les lois et la plupart des audits) et AAA (le plus exigeant). Une version 3 est en cours de rédaction au W3C, mais elle n’est pas encore une norme.

RGAA : le référentiel français

Le RGAA (Référentiel général d’amélioration de l’accessibilité) traduit ces règles en critères de test vérifiables. La version de référence est le RGAA 4.1. La DINUM a annoncé un RGAA 5, fondé sur les WCAG 2.2, pour la fin de l’année 2026.

Le RGAA s’impose aux services publics et, au titre de l’article 47 de la loi du 11 février 2005, aux entreprises qui réalisent plus de 250 millions d’euros de chiffre d’affaires en France. Ces organismes doivent publier une déclaration d’accessibilité, un schéma pluriannuel et afficher leur niveau de conformité sur la page d’accueil. L’absence de ces éléments est passible d’une amende pouvant atteindre 50 000 euros, renouvelable.

European Accessibility Act : le secteur privé concerné depuis juin 2025

L’European Accessibility Act (directive européenne 2019/882) s’applique depuis le 28 juin 2025. En France, il a été transposé par la loi du 9 mars 2023. Il vise des produits et des services du quotidien, notamment :

• le commerce en ligne ;
• les services bancaires aux particuliers ;
• le transport de voyageurs (information, billetterie) ;
• les services de communications électroniques ;
• les livres numériques et les médias audiovisuels.

Les sites et applications qui fournissent ces services doivent être accessibles, quelle que soit la taille de l’entreprise. Seules les microentreprises de services sont exemptées : moins de 10 salariés et un chiffre d’affaires ou un bilan annuel inférieur à 2 millions d’euros. En France, les contrôles relèvent notamment de la DGCCRF et de l’Arcom, et le non-respect expose à des sanctions.

Comment détecter les problèmes d’accessibilité de son site ?

En 2026, 95,9 % du million de pages d’accueil les plus visitées présentaient au moins une erreur WCAG détectable automatiquement, avec 56 erreurs par page en moyenne (WebAIM Million 2026).

Les outils automatiques ne repèrent qu’une partie des problèmes. Ils trouvent un contraste insuffisant ou une image sans texte alternatif, mais ils ne peuvent pas juger si ce texte alternatif décrit bien l’image. Un audit sérieux combine donc des outils et des tests à la main.

Score d’accessibilité : Lighthouse

Intégré aux outils de développement de Chrome (onglet Lighthouse), Google Lighthouse analyse une page et lui attribue un score d’accessibilité sur 100, accompagné de recommandations. C’est un bon premier contrôle, pas une preuve de conformité.

Test sur tout un domaine : Experte

Le test d’accessibilité d’Experte donne une vue d’ensemble d’un domaine : on saisit le nom de domaine, et l’outil affiche les scores d’accessibilité de toutes les pages trouvées. Les scores sont tirés de Lighthouse.

Repérer les erreurs sur la page : WAVE

WAVE, développé par WebAIM, affiche les erreurs directement sur la page analysée : images sans alternative, champs de formulaire sans libellé, titres mal hiérarchisés, contrastes insuffisants. Il existe en version web et en extension pour Chrome et Firefox.

Auditer en profondeur : axe DevTools

axe DevTools, de Deque, s’installe dans les outils de développement du navigateur. Chaque problème est rattaché au critère WCAG concerné, avec une explication et une piste de correction. La version gratuite suffit pour la plupart des sites.

Tester avec un lecteur d’écran et au clavier

Aucun outil ne remplace l’essai réel. Si vous ne deviez faire qu’un test, faites celui du clavier : quelques minutes suffisent pour repérer les blocages les plus graves.

• Au clavier seul : parcourir la page avec la touche Tab. Chaque lien et chaque bouton doivent être atteignables, dans un ordre logique, avec un focus visible.
• Avec un lecteur d’écran : NVDA, gratuit, sous Windows, ou VoiceOver, intégré à macOS et iOS. Écouter comment la page est annoncée révèle vite les boutons sans nom, les images mal décrites et les titres incohérents.

Et les overlays d’accessibilité ?

Les overlays sont des widgets ajoutés au site qui promettent de le rendre conforme automatiquement. Ils ne corrigent pas le code de la page et sont largement contestés par les experts et les associations de personnes handicapées. En avril 2025, la FTC, l’autorité américaine de protection des consommateurs, a condamné l’éditeur accessiBe à une amende d’un million de dollars et lui a interdit d’affirmer que son outil rend un site conforme aux WCAG sans preuve. Corriger le site reste la seule voie vers la conformité.

Les 3 leviers pour rendre son site accessible

Rendre son site accessible visuellement

Selon l’OMS, au moins 2,2 milliards de personnes ont une déficience de la vision de près ou de loin. Pour en tenir compte :

• Soigner les contrastes : au niveau AA, un rapport de 4,5:1 entre le texte et le fond, 3:1 pour les grands textes. Le vérifier avec contrastchecker.com.
• Choisir une police lisible et une taille de texte suffisante.
• Permettre le zoom jusqu’à 200 % sans perte de contenu ni défilement horizontal.
• Rédiger un texte alternatif pour chaque image porteuse d’information, et laisser vide celui des images décoratives.
• Ne jamais transmettre une information par la couleur seule (un champ en erreur signalé uniquement en rouge, par exemple).

Pour voir son site comme le voit une personne daltonienne ou malvoyante, les outils de développement de Chrome proposent une émulation des déficiences visuelles (menu Rendering, option « Emulate vision deficiencies »). Webflow propose un outil équivalent directement dans le Designer, présenté plus bas.

Rendre son site accessible aux personnes sourdes et malentendantes

L’OMS estime à plus de 430 millions le nombre de personnes ayant une perte auditive invalidante. Pour les inclure :

• Ajouter des sous-titres aux vidéos.
• Proposer une transcription textuelle des contenus audio et vidéo.
• Ne jamais transmettre une information uniquement par le son (une alerte sonore sans équivalent visuel).
• Déclarer la langue de la page, pour que les synthèses vocales la lisent correctement.

Rendre la navigation accessible

Ce levier concerne surtout les personnes ayant un handicap moteur ou cognitif, pour qui une navigation confuse est un vrai obstacle. Les points à vérifier :

• une hiérarchie de titres cohérente (un seul H1, puis H2, H3…) ;
• des liens dont l’intitulé dit où ils mènent, sans « cliquez ici » ;
• des libellés explicites sur chaque champ de formulaire, et des messages d’erreur qui expliquent comment corriger ;
• un fil d’Ariane pour se repérer ;
• des cibles assez grandes : 24 × 24 px au minimum au niveau AA, 44 × 44 px recommandé ;
• un focus visible sur l’élément sélectionné au clavier ;
• une navigation au clavier complète, sans piège ;
• des animations sobres, et la possibilité de les réduire (en respectant le réglage « réduire les animations » du système) ;
• une aide (contact, FAQ) toujours placée au même endroit ;
• un contrôle sur tous les types d’appareils.

La plupart de ces points se règlent dans le code. Dans Webflow, une bonne partie se fait depuis le Designer, sans code.

Améliorer l’accessibilité de son site avec Webflow

Webflow intègre plusieurs outils pour la création de sites web accessibles : un panneau d’audit, une prévisualisation des déficiences visuelles et la gestion des attributs ARIA. Certaines interactions, comme les accordéons, demandent encore un peu de code pour être pleinement accessibles. Webflow fournit pour cela des extraits à copier-coller dans sa checklist d’accessibilité.

Vérifier le contraste des textes

Le contraste entre le texte et le fond est l’un des défauts les plus fréquents. L’outil d’audit natif de Webflow signale les textes qui ne respectent pas les seuils des WCAG, directement dans le Designer.

Découvrir la fonctionnalité dans ce tutoriel 👇

Pour aller plus loin : contrôler l’accessibilité du texte de son site Webflow.

Prévisualiser les déficiences visuelles

L’outil Vision preview du Designer affiche le site tel que le voit une personne atteinte d’une déficience visuelle : différentes formes de daltonisme ou une vision floue, par exemple.

Pour l’activer : ouvrir les Canvas settings en haut du Designer, puis choisir le type de déficience dans la partie Vision preview.

Ne plus oublier les textes alternatifs

Le panneau d’audit de Webflow signale chaque image sans attribut alt.

La bonne pratique : renseigner le texte alternatif d’une image une fois pour toutes dans le panneau Assets, puis indiquer sur chaque image qu’elle reprend le texte alternatif de l’asset. Le texte suit l’image partout où elle est réutilisée.

Ajouter un aria-label pour les lecteurs d’écran

Un lecteur d’écran annonce un élément à partir de son contenu. Quand ce contenu ne suffit pas (une icône seule dans un bouton, plusieurs liens « En savoir plus »), l’attribut aria-label lui donne un nom compréhensible.

Dans Webflow : sélectionner l’élément, ouvrir le panneau Element settings, puis Custom attributes → +, et saisir aria-label avec sa valeur.

Le détail, avec des exemples : améliorer l’accessibilité d’un site grâce aux aria-label.

Des cibles assez grandes

Les WCAG 2.2 fixent une taille minimale de 24 × 24 px au niveau AA pour les liens et les boutons (critère 2.5.8), et recommandent 44 × 44 px au niveau AAA (critère 2.5.5). Viser 44 px rend un site plus simple à utiliser pour les personnes atteintes de tremblements, comme dans la maladie de Parkinson, et pour tous les utilisateurs de mobile.

Dans Webflow, on agrandit la zone cliquable avec du padding sur le lien, sans changer la taille du texte.

Et pour choisir le bon élément, lien ou bouton : lien vs bouton en HTML.

Aller plus loin avec la Webflow Accessibility Checklist

Webflow met gratuitement à disposition une checklist d’accessibilité, l’Accessibility Checklist. Chaque point y est accompagné de recommandations, de tutoriels simples et, si besoin, du code à copier-coller.

La checklist est partageable avec toute une équipe et comporte une barre de progression pour suivre l’avancée du projet.

FAQ sur l’accessibilité web

Mon site est-il concerné par l’European Accessibility Act ?

Oui s’il permet de vendre en ligne aux particuliers, de fournir un service bancaire, de réserver un transport de voyageurs ou d’accéder à un service de communication électronique, à des livres numériques ou à des médias audiovisuels. Seules les microentreprises de services (moins de 10 salariés et moins de 2 millions d’euros de chiffre d’affaires ou de bilan) sont exemptées. Un site vitrine qui ne vend rien en ligne n’entre en principe pas dans le champ de la directive.

Quelle différence entre WCAG et RGAA ?

Les WCAG sont les règles internationales du W3C. Le RGAA est le référentiel français qui les traduit en critères et en méthode de test, et qui précise les obligations légales en France (déclaration d’accessibilité, schéma pluriannuel). Le RGAA 4.1 s’appuie sur les WCAG 2.1 ; le futur RGAA 5 s’appuiera sur les WCAG 2.2.

Quel niveau de conformité viser ?

Le niveau AA. C’est le niveau de référence du RGAA et de la norme européenne EN 301 549, sur laquelle s’appuient la loi française et l’European Accessibility Act. Le niveau AAA est recommandé sur certains critères, comme la taille des cibles, mais il n’est exigé nulle part pour un site entier.

Un overlay d’accessibilité suffit-il à rendre un site conforme ?

Non. Un overlay ajoute une couche par-dessus la page sans corriger son code, et ne rend pas un site conforme aux WCAG. La FTC a sanctionné en 2025 un éditeur d’overlay qui le prétendait. La conformité passe par la correction du site lui-même.

Un score de 100 sur Lighthouse signifie-t-il que mon site est accessible ?

Non. Lighthouse ne teste automatiquement qu’une partie des critères. Un score de 100 est un bon signe, mais seuls des tests au clavier, au lecteur d’écran et un audit selon le RGAA ou les WCAG permettent de conclure à la conformité.