Aller au contenu principal
Accessibilité20 mars 202612 min de lecture

RGAA 4.1 : guide 2026 complet des 106 critères d'accessibilité web

Comprendre les 106 critères du RGAA 4.1 repartis en 13 thematiques. Guide pratique pour développeurs et agences web avec exemples de code.

Le Referentiel General d'Amelioration de l'Accessibilité (RGAA) est le cadre technique de reference en France pour evaluer l'accessibilité des sites web et applications. Dans sa version 4.1, il comprend 106 critères repartis en 13 thematiques. Ce guide detaille chaque thematique avec des exemples concrets de code conforme et non conforme, pour permettre aux développeurs et agences web de comprendre precisement ce qui est attendu.

RGAA et WCAG : quelle relation ?

Le RGAA 4.1 est la transposition operationnelle francaise du WCAG 2.1 (Web Content Accessibility Guidelines) niveau AA, publie par le W3C. La ou le WCAG formule des principes generaux et des critères de succes, le RGAA fournit des critères testables, avec une methodologie de verification precise et un referentiel de tests associe.

Etre conforme au RGAA 4.1 equivaut a etre conforme au WCAG 2.1 AA. L'inverse n'est pas toujours vrai : le RGAA impose des modalites de test specifiques au contexte francais (notamment la declaration d'accessibilité obligatoire et le schema pluriannuel).

Le WCAG repose sur quatre principes fondamentaux, que le RGAA decline en critères concrets :

  1. Perceptible : l'information doit etre presentable de maniere perceptible par tous les utilisateurs
  2. Utilisable : les composants d'interface doivent etre utilisables par tous
  3. Comprehensible : l'information et l'utilisation de l'interface doivent etre comprehensibles
  4. Robuste : le contenu doit etre suffisamment robuste pour etre interprete par les technologies d'assistance

Vue d'ensemble des 13 thematiques

Avant de detailler chaque thematique, voici la repartition des 106 critères :

# Thematique Nombre de critères
1 Images 9
2 Cadres 2
3 Couleurs 3
4 Multimedia 13
5 Tableaux 8
6 Liens 2
7 Scripts 5
8 Elements obligatoires 10
9 Structuration de l'information 4
10 Presentation de l'information 14
11 Formulaires 13
12 Navigation 11
13 Consultation 12

Thematique 1 : Images (9 critères)

La thematique Images couvre toutes les images presentes dans le contenu : images informatives, decoratives, complexes (graphiques, schemas), images texte et les zones cliquables.

Criteres cles

Critere 1.1 : Chaque image porteuse d'information a-t-elle une alternative textuelle ?

Non conforme :

<img src="promo-soldes.jpg">

Conforme :

<img src="promo-soldes.jpg" alt="Soldes d'ete : jusqu'a -50% sur toute la collection">

Critere 1.2 : Chaque image de decoration est-elle correctement ignoree par les technologies d'assistance ?

Non conforme :

<img src="decorative-line.png" alt="ligne decorative">

Conforme :

<img src="decorative-line.png" alt="" role="presentation">

Critere 1.6 : Chaque image porteuse d'information a-t-elle, si necessaire, une description detaillee ?

Pour les images complexes (infographies, graphiques), un attribut alt court ne suffit pas. Une description detaillee doit etre fournie via longdesc, aria-describedby ou un lien adjacent.

Thematique 2 : Cadres (2 critères)

Les cadres (<iframe>) doivent etre identifies et decrits pour les technologies d'assistance.

Criteres cles

Critere 2.1 : Chaque cadre a-t-il un titre de cadre ?

Non conforme :

<iframe src="https://maps.google.com/embed"></iframe>

Conforme :

<iframe src="https://maps.google.com/embed" title="Carte Google Maps de notre agence a Paris"></iframe>

Thematique 3 : Couleurs (3 critères)

Cette thematique verifie que l'information n'est pas transmise uniquement par la couleur et que les contrastes sont suffisants.

Criteres cles

Critere 3.2 : Dans chaque page web, le contraste entre la couleur du texte et la couleur de son arriere-plan est-il suffisamment eleve ?

Les ratios minimaux sont :

  • 4.5:1 pour le texte de taille normale (inferieur a 24px ou 18.5px en gras)
  • 3:1 pour le texte de grande taille (superieur ou egal a 24px ou 18.5px en gras)

Non conforme :

/* Ratio de contraste : 2.3:1 */
.text-light {
  color: #999999;
  background-color: #ffffff;
}

Conforme :

/* Ratio de contraste : 7.4:1 */
.text-accessible {
  color: #595959;
  background-color: #ffffff;
}

Critere 3.1 : L'information ne doit pas etre donnee uniquement par la couleur. Par exemple, un champ de formulaire en erreur ne doit pas etre signale uniquement par une bordure rouge : un message textuel ou une icone doivent accompagner l'indication visuelle.

Thematique 4 : Multimedia (13 critères)

La thematique la plus fournie en critères couvre les contenus audio, video, et les medias temporels.

Criteres cles

Critere 4.1 : Chaque media temporel pre-enregistre a-t-il, si necessaire, une transcription textuelle ou une audiodescription ?

Critere 4.3 : Chaque media temporel synchronise pre-enregistre a-t-il des sous-titres synchronises ?

Non conforme :

<video src="presentation.mp4" controls></video>

Conforme :

<video src="presentation.mp4" controls>
  <track kind="subtitles" src="sous-titres-fr.vtt" srclang="fr" label="Francais" default>
  <track kind="descriptions" src="audiodescription-fr.vtt" srclang="fr" label="Audiodescription">
</video>

Critere 4.13 : Chaque media temporel et non temporel est-il compatible avec les technologies d'assistance ? Les lecteurs multimedia doivent etre navigables au clavier et exposer leurs controles aux technologies d'assistance.

Thematique 5 : Tableaux (8 critères)

Les tableaux de données doivent etre correctement structures pour etre comprehensibles par les technologies d'assistance.

Criteres cles

Critere 5.1 : Chaque tableau de données complexe a-t-il un resume ?

Critere 5.6 : Pour chaque tableau de données, chaque en-tete de colonne et chaque en-tete de ligne sont-ils correctement declares ?

Non conforme :

<table>
  <tr>
    <td>Produit</td>
    <td>Prix</td>
    <td>Stock</td>
  </tr>
  <tr>
    <td>Widget A</td>
    <td>29,90 EUR</td>
    <td>En stock</td>
  </tr>
</table>

Conforme :

<table>
  <caption>Liste des produits et disponibilites</caption>
  <thead>
    <tr>
      <th scope="col">Produit</th>
      <th scope="col">Prix</th>
      <th scope="col">Stock</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Widget A</td>
      <td>29,90 EUR</td>
      <td>En stock</td>
    </tr>
  </tbody>
</table>

Thematique 6 : Liens (2 critères)

Malgre un nombre reduit de critères, cette thematique est cruciale : les liens sont l'element de navigation fondamental du web.

Criteres cles

Critere 6.1 : Chaque lien est-il explicite ?

Non conforme :

<a href="/offres">Cliquez ici</a>

Conforme :

<a href="/offres">Decouvrir nos offres d'accessibilité</a>

Critere 6.2 : Chaque lien ayant un intitule visible a-t-il un nom accessible pertinent ? Le nom accessible (expose aux technologies d'assistance) doit contenir au minimum l'intitule visible du lien.

Thematique 7 : Scripts (5 critères)

Les scripts JavaScript doivent etre accessibles : les composants interactifs crees en JavaScript doivent etre utilisables au clavier et compatibles avec les technologies d'assistance.

Criteres cles

Critere 7.1 : Chaque script est-il, si necessaire, compatible avec les technologies d'assistance ?

Critere 7.3 : Chaque script est-il controlable par le clavier et par tout dispositif de pointage ?

Non conforme :

<div onclick="toggleMenu()">Menu</div>

Conforme :

<button type="button" aria-expanded="false" aria-controls="menu-principal" onclick="toggleMenu()">
  Menu
</button>
<nav id="menu-principal" role="navigation" aria-label="Menu principal" hidden>
  <!-- contenu du menu -->
</nav>

Thematique 8 : Elements obligatoires (10 critères)

Cette thematique couvre les elements HTML fondamentaux que chaque page doit posseder.

Criteres cles

Critere 8.1 : Chaque page web est-elle definie par un type de document ?

Critere 8.3 : Dans chaque page web, la langue par defaut est-elle presente ?

Critere 8.6 : Pour chaque page web ayant un titre de page, ce titre est-il pertinent ?

Non conforme :

<html>
<head>
  <title>Page 1</title>
</head>

Conforme :

<!DOCTYPE html>
<html lang="fr">
<head>
  <title>Audit d'accessibilité web - WebConforme</title>
</head>

Thematique 9 : Structuration de l'information (4 critères)

La structure semantique du document est essentielle pour la navigation par les technologies d'assistance.

Criteres cles

Critere 9.1 : Dans chaque page web, l'information est-elle structuree par l'utilisation appropriee de titres ?

Critere 9.2 : Dans chaque page web, la structure du document est-elle coherente ?

Non conforme :

<div class="titre-principal">Nos services</div>
<div class="sous-titre">Audit accessibilité</div>
<p>Description du service...</p>

Conforme :

<h1>Nos services</h1>
<h2>Audit accessibilité</h2>
<p>Description du service...</p>

Les landmarks ARIA (<main>, <nav>, <header>, <footer>, <aside>) doivent egalement etre utilises pour structurer les zones principales de la page.

Thematique 10 : Presentation de l'information (14 critères)

C'est la deuxieme thematique en nombre de critères. Elle traite de la facon dont le contenu est visuellement presente et de son adaptabilite.

Criteres cles

Critere 10.1 : Dans chaque page web, les feuilles de styles sont-elles utilisees pour controler la presentation de l'information ?

Critere 10.4 : Dans chaque page web, le texte reste-t-il lisible lorsque la taille des caracteres est augmentee jusqu'a 200% ?

Critere 10.7 : Dans chaque page web, pour chaque element recevant le focus, la prise de focus est-elle visible ?

Non conforme :

*:focus {
  outline: none;
}

Conforme :

*:focus-visible {
  outline: 3px solid #4A90D9;
  outline-offset: 2px;
}

Thematique 11 : Formulaires (13 critères)

Les formulaires sont un point de friction majeur en accessibilité. Chaque champ doit etre identifie, les erreurs signalees de maniere accessible, et les aides a la saisie fournies.

Criteres cles

Critere 11.1 : Chaque champ de formulaire a-t-il une etiquette ?

Critere 11.10 : Dans chaque formulaire, le controle de saisie est-il utilise de maniere pertinente ?

Critere 11.13 : La finalite de chaque champ de saisie peut-elle etre deduite pour faciliter le remplissage automatique ?

Non conforme :

<input type="text" placeholder="Votre email">

Conforme :

<label for="email">Adresse email</label>
<input type="email" id="email" name="email" autocomplète="email"
       aria-describedby="email-aide" required>
<p id="email-aide">Format attendu : nom@domaine.fr</p>

Thematique 12 : Navigation (11 critères)

Cette thematique verifie que l'utilisateur peut naviguer efficacement dans le site, quels que soient ses moyens d'interaction.

Criteres cles

Critere 12.1 : Chaque ensemble de pages dispose-t-il de deux systemes de navigation differents au moins ?

Par exemple : un menu de navigation principal ET un moteur de recherche, OU un menu ET un plan du site.

Critere 12.7 : Un lien d'evitement ou d'acces rapide a la zone de contenu principal est-il present ?

Non conforme : absence de lien d'evitement.

Conforme :

<body>
  <a href="#contenu" class="skip-link">Aller au contenu principal</a>
  <header><!-- navigation --></header>
  <main id="contenu">
    <!-- contenu principal -->
  </main>
</body>

Thematique 13 : Consultation (12 critères)

La derniere thematique couvre les aspects lies a la consultation du contenu : documents telechargeables, limites de temps, contenus en mouvement, changements brusques.

Criteres cles

Critere 13.1 : Pour chaque page web, l'utilisateur a-t-il le controle de chaque limite de temps modifiant le contenu ?

Critere 13.7 : Les documents bureautiques en telechargement sont-ils accessibles ?

Critere 13.8 : Le contenu propose est-il accessible quelles que soient les technologies utilisees ?

Chaque document PDF, Word ou Excel propose en telechargement doit lui-meme etre accessible. Dans le cas contraire, une version accessible alternative doit etre proposee.

Ce qui est testable automatiquement vs manuellement

Un point essentiel pour les développeurs et les agences : tous les critères ne sont pas verifiables de la meme maniere.

Tests automatises (~30% des critères)

Environ 30 des 106 critères peuvent etre detectes par des outils automatises :

  • Presence d'attributs alt (mais pas leur pertinence)
  • Ratios de contraste
  • Presence de labels sur les formulaires
  • Structure des titres (hierarchie des balises H)
  • Langue de la page
  • Attribut title des iframes
  • Doctype et validite HTML

L'outil d'analyse automatise de WebConforme couvre l'ensemble de ces critères testables automatiquement. Il permet d'obtenir en quelques secondes un premier diagnostic fiable et priorise. C'est le point de depart recommande avant tout audit approfondi.

Tests manuels (~70% des critères)

Les 70% restants necessitent un examinateur humain :

  • Pertinence des alternatives textuelles
  • Coherence de la navigation
  • Qualite des sous-titres
  • Comprehensibilite des messages d'erreur
  • Compatibilite reelle avec les lecteurs d'ecran
  • Utilisabilite au clavier sur l'ensemble des parcours
  • Pertinence des descriptions detaillees

Un audit complet RGAA combine donc toujours outils automatises et expertise humaine.

RGAA v5 : ce qui arrive fin 2026

La version 5 du RGAA, attendue pour fin 2026, devrait s'aligner sur le WCAG 2.2. Les principaux ajouts concernent :

  • Focus non masque : le focus clavier ne doit pas etre entierement cache par d'autres elements
  • Taille minimale des cibles : les zones cliquables doivent faire au moins 24x24 pixels CSS
  • Aide coherente : les mecanismes d'aide doivent apparaitre de maniere coherente sur l'ensemble du site
  • Authentification accessible : les methodes d'authentification ne doivent pas reposer sur des tests cognitifs

Se mettre en conformité avec le RGAA 4.1 aujourd'hui est une base solide qui facilitera considerablement la transition vers la version 5.

Conclusion : une demarche progressive, pas un big bang

Avec 106 critères, le RGAA peut sembler intimidant. Mais la mise en conformité est une demarche progressive. La strategie la plus efficace consiste a commencer par un diagnostic automatise pour identifier les defauts les plus evidents, puis a corriger par ordre de priorite avant de passer a un audit manuel complet.

La majorite des non-conformités critiques (contrastes, alternatives textuelles, labels, structure) sont corrigeables en quelques jours de developpement. Le reste releve d'une integration progressive de l'accessibilité dans les processus de conception et de developpement.

La premiere etape : lancez un scan gratuit avec WebConforme pour savoir ou en est votre site. En 30 secondes, vous aurez une cartographie claire de vos non-conformités et un plan d'action priorise.


À lire aussi


Testez gratuitement la conformité de votre site sur webconforme.fr — résultat en 30 secondes, sans inscription.

Votre site est-il conforme au RGAA ?

Scan gratuit en 30 secondes — aucune inscription requise.

Lancer un scan gratuit
#RGAA#critères#WCAG#développeurs#guide