Rendre son site web accessible : Guide pratique en 10 étapes

Depuis le 28 juin 2025, l'accessibilité web est obligatoire pour la grande majorité des entreprises. Mais par où commencer quand on fait face aux 106 critères du RGAA ? Voici un guide pratique en 10 étapes pour transformer votre site en une plateforme vraiment accessible.

Étape 1 : Réaliser un audit initial

Avant toute action, vous devez connaître votre point de départ.

Diagnostic automatisé rapide

Commencez par un test automatisé gratuit pour identifier les problèmes les plus évidents :

• Images sans texte alternatif
• Contrastes insuffisants
• Formulaires mal étiquetés
• Structure de titres incohérente

Audit manuel approfondi

Pour une vision complète, faites réaliser un audit manuel couvrant les 106 critères du RGAA. Cela vous donnera :

• Votre taux de conformité réel
• La liste priorisée des corrections à apporter
• Un rapport détaillé pour votre déclaration d'accessibilité

[!NOTE] Un site e-commerce moyen répond à moins de 50% des critères d'accessibilité. Ne vous découragez pas si votre score initial est bas.

Étape 2 : Établir un plan d'action priorisé

Toutes les corrections ne se valent pas. Priorisez en fonction de :

Critères bloquants d'abord

Concentrez-vous sur ce qui empêche totalement l'accès :

• Navigation clavier impossible
• Lecteur d'écran inutilisable
• Formulaires non soumissibles

Parcours critiques ensuite

Identifiez les parcours utilisateur essentiels et rendez-les accessibles en priorité :

• Page d'accueil
• Processus d'achat ou d'inscription
• Formulaire de contact
• Pages de contenu principal

Étape 3 : Corriger la structure HTML

La base d'un site accessible est une structure HTML sémantique.

Hiérarchie des titres

Utilisez les balises h1 à h6 dans l'ordre logique :

• Un seul h1 par page (le titre principal)
• Les h2 pour les sections principales
• Les h3 pour les sous-sections, etc.

Balises sémantiques

Remplacez les div génériques par des balises appropriées :

• <nav> pour la navigation
• <main> pour le contenu principal
• <article> pour les contenus autonomes
• <aside> pour les contenus complémentaires
• <footer> pour le pied de page

Étape 4 : Rendre les images accessibles

Chaque image doit avoir un texte alternatif pertinent.

Images informatives

Décrivez ce que l'image apporte à la compréhension :

<img src="graphique.png" alt="évolution des ventes : +15% en 2025">

Images décoratives

Les images purement décoratives doivent avoir un alt vide :

<img src="decoration.png" alt="">

Images complexes

Pour les graphiques et infographies, fournissez une description détaillée accessible via un lien ou un attribut longdesc.

Étape 5 : Assurer les contrastes suffisants

Le RGAA exige des ratios de contraste minimum.

Les seuils à respecter

• Texte normal : ratio minimum de 4.5:1
• Grand texte (24px ou 18.5px gras) : ratio minimum de 3:1
• Éléments graphiques porteurs d'information : ratio minimum de 3:1

Comment vérifier

Utilisez des outils comme :

• L'extension Colour Contrast Analyser
• Les DevTools de Chrome (onglet accessibilité)
• Notre outil d'audit qui détecte les problèmes de contraste

[!TIP] Consultez notre guide complet sur les contrastes pour tout savoir sur ce sujet crucial.

Étape 6 : Rendre les formulaires utilisables

Les formulaires sont souvent le maillon faible de l'accessibilité.

Labels explicites

Chaque champ doit avoir un label associé :

<label for="email">Adresse email</label>
<input type="email" id="email" name="email">

Messages d'erreur accessibles

• Indiquez clairement quel champ est en erreur
• Expliquez comment corriger l'erreur
• Associez le message au champ via aria-describedby

Champs obligatoires

Signalez les champs requis de manière accessible :

<label for="nom">Nom <span aria-label="obligatoire">*</span></label>

Pour aller plus loin, consultez notre guide des formulaires accessibles.

Étape 7 : Garantir la navigation clavier

Tous les éléments interactifs doivent être utilisables au clavier.

Tester la navigation

Parcourez votre site uniquement avec :

• Tab pour avancer
• Shift+Tab pour reculer
• Entrée pour activer
• Flèches pour naviguer dans les menus

Points de vigilance

• L'indicateur de focus est-il visible ?
• L'ordre de tabulation est-il logique ?
• Y a-t-il des pièges clavier (impossible de sortir d'un élément) ?

Skip link

Ajoutez un lien d'évitement vers le contenu principal :

<a href="#main" class="skip-link">Aller au contenu principal</a>

Découvrez notre guide sur les skip links pour une implémentation parfaite.

Étape 8 : Rendre les médias accessibles

Vidéos et audios nécessitent des alternatives.

Pour les vidéos

• Sous-titres pour les dialogues et sons importants
• Audiodescription pour les informations visuelles essentielles
• Transcription textuelle complète

Pour les audios

• Transcription textuelle de tout le contenu audio

Pour les animations

• Respectez la préférence prefers-reduced-motion
• Permettez de mettre en pause les animations automatiques

Étape 9 : Former les équipes

L'accessibilité n'est pas un projet ponctuel mais une pratique continue.

Qui former ?

• Développeurs : HTML sémantique, ARIA, tests automatisés
• Designers : Contrastes, tailles de cibles, hiérarchie visuelle
• Contributeurs : Rédaction de textes alternatifs, structure des contenus
• Product managers : Intégration dans les specs et les critères d'acceptance

Ressources de formation

• Certification Opquast
• Formations Access42
• Documentation RGAA officielle

Étape 10 : Mettre en place le suivi continu

L'accessibilité doit être maintenue dans le temps.

Intégrer dans la CI/CD

Ajoutez des tests automatisés d'accessibilité à votre pipeline de déploiement pour détecter les régressions.

Audits périodiques

Planifiez un audit complet au minimum une fois par an, ou après toute refonte majeure.

Canal de signalement

Mettez en place un moyen pour les utilisateurs de reporter les problèmes rencontrés et traitez ces signalements rapidement.

Documentation

Tenez à jour votre déclaration d'accessibilité et votre schéma pluriannuel.

Conclusion

Rendre un site accessible peut sembler intimidant face aux 106 critères du RGAA, mais en procédant étape par étape et en priorisant intelligemment, c'est un objectif atteignable. Commencez aujourd'hui par un audit gratuit et construisez votre plan d'action. Chaque correction améliore l'expérience pour tous vos utilisateurs.