Accessibilité numérique : les critères WCAG 2.2 incontournables pour réussir vos sites pro et publics

Les WCAG (Web Content Accessibility Guidelines), pilotées par le W3C, sont la référence internationale pour les standards d’accessibilité du web. Leur adoption est d’autant plus stratégique :

• Obligation légale : Pour les sites publics et entreprises de plus de 250 salariés, la loi française (loi n°2005-102, décret 2019-768) impose la conformité au RGAA, qui s’appuie largement sur les WCAG 2.1, mais intègre progressivement les apports du 2.2 (notamment pour la commande publique depuis 2023).
• Avantage concurrentiel : Un site inclusif touche plus d’usagers – salariés, clients, citoyens, partenaires – et limite le risque d’exclusion, de réputation ou de contentieux.
• Démarche RSE et qualité : L’accessibilité témoigne d’une philosophie positive, attentive et universelle. C’est aussi une marque de sérieux en UX.

Si les critères WCAG ne sont pas tous obligatoires, leur respect à minima au niveau AA s’impose aujourd’hui comme bon usage et vise à prévenir toute difficulté d’usage liée au handicap, quel qu’il soit : moteur, visuel, auditif, cognitif, etc.

La version WCAG 2.2 introduit 9 nouveaux critères, affinant la protection dans certains cas d’usage clés, notamment autour de la navigation au clavier, des interactions tactiles et de la compréhension des parcours. Elle conserve, bien sûr, l’ossature des principes fondateurs du standard : Perceptible, Utilisable, Compréhensible, Robuste (POUR).

Tour d’horizon des nouveautés marquantes à intégrer :

• Critères renforcés pour la navigation au clavier et les interactions tactiles
• Mise en lumière de la simplification des parcours utilisateurs
• Plus grande exigence sur la visibilité et la taille des commandes (pour mobiles et interfaces tactiles)

Voici les principaux critères, regroupés par thématique, à appliquer sans hésiter sur tout site à destination professionnelle ou collective.

1. Alternatives textuelles et média

• Fournir un équivalent texte à toutes les images (critère 1.1.1), y compris les icônes fonctionnelles, schémas et logos
• Proposer des sous-titres avec synchronisation sur toutes les vidéos (1.2.2 Audio Description et 1.2.5), en particulier pour les contenus institutionnels

2. Contraste et visibilité

• Respecter un contraste de 4.5:1 minimum entre texte et fond (1.4.3), et 3:1 au niveau des composants d’interface (1.4.11)
• Veiller à la visibilité permanente du focus clavier lors de la navigation (2.4.11 nouveau)

3. Navigation et structure logique

• Structurer les pages avec des balises sémantiques et des titres clairs (bon usage des h1, h2, h3…)
• Permettre la navigation uniquement au clavier, sans blocage ni piège de focus (2.1.1, 2.1.2, 2.1.4)
• Fournir une alternative aux actions nécessitant « drag & drop » (2.5.7 nouveau)
• S’assurer de la cohérence de l’aide, présente à l’emplacement identique sur chaque page (3.2.6 nouveau)

4. Composants interactifs et formulaires

• Avoir des zones interactives d’au moins 24x24 px (2.5.8 nouveau), espacées pour éviter les erreurs de manipulation
• Limiter la saisie redondante dans les formulaires (3.3.7) : pré-remplir les champs déjà connus, ou proposer de récupérer sa saisie précédente
• Assurer une validation explicite, des messages d’erreurs explicatifs et localisés (3.3.1, 3.3.3, 3.3.7)

5. Prévoir la robustesse technique et la portabilité

• Respecter les standards HTML/CSS (4.1.1, 4.1.2)
• Garantir la compatibilité avec les technologies d’assistance courantes (lecteurs d’écran, loupe, commande vocale…)
• Préserver l’accessibilité mobile/tablette : responsive design, éléments tactiles accessibles

• 2.4.11 Focus Not Obscured (Minimum) : S’assurer que le focus de navigation est OBLIGATOIREMENT visible en toute circonstance. Un overlay, un bandeau ou une modale ne doivent jamais masquer le focus !
• 2.5.7 Dragging Movements : Penser systématiquement à une alternative clavier pour bouger ou organiser (par exemple trier des listes). Pratique à mettre en place, mais peu souvent fait !
• 2.5.8 Target Size (Minimum) : Tous les boutons et liens doivent faire 24x24px au minimum, sauf s’ils sont suffisamment espacés de tout autre composant cliquable. Cela favorise aussi l’ergonomie sur mobile.
• 3.2.6 Consistent Help : Sur tout site pro/public, intégrer une fonctionnalité d’aide ou de support (chat, mail, FAQ) et la placer à l’endroit identique dans toutes les pages. Simplicité = efficacité.
• 3.3.7 Redundant Entry : Pour les formulaires multi-pages, permettre à l’utilisateur de ne jamais ressaisir les informations déjà communiquées (ex : nom, adresse, contact). Source d’irritation et d’erreur réduite pour tous.

Appliquer toutes ces règles, c’est garantir l’accessibilité mais aussi l’ergonomie de manière globale. Voici une séquence d’actions recommandées pour entreprendre la mise en conformité, même dans un univers d’entreprise ou de collectivité qui avance souvent par étapes :

1. Effectuer un audit initial : Relever les points bloquants sur l’existant grâce à un audit manuel et outillé (ex : Wave, AccessiScan, Diagnostic RGAA du DesignGouv)
2. Prioriser les correctifs : Résoudre les sujets lourds en premier (navigation au clavier, contrastes, formulaires), puis affiner sur les éléments spécifiques des WCAG 2.2
3. Documenter les écarts : Rédiger une page « Accessibilité » sur le site explicitant les points non encore corrigés, obligation légale y compris pour le privé
4. Sensibiliser l’équipe : Former développeurs, designers, éditeurs de contenu aux principaux réflexes : alternative textuelle, balises sémantiques, navigation clavier, taille des boutons, relecture inclusive…
5. Veiller à la conformité continue : Réintégrer chaque nouveau critère et vérifier périodiquement après chaque mise à jour du site

• W3C - Documentation officielle WCAG 2.2
• DesignGouv - Guide d’accessibilité des sites publics français
• Ministère de la Transition Numérique - obligations accessibilité
• WAVE - outil de test accessibilité rapide
• AccessScan - auto-diagnostic gratuit

Respecter les critères WCAG 2.2 n’est pas seulement une contrainte légale ou une question technique. C’est un pilier de la qualité et de l’innovation web, qui sécurise vos projets sur le long terme, réduit les irritants utilisateurs et débloque de nouveaux usages, notamment sur mobile ou dans les solutions SaaS/BtoB.

L’accessibilité numérique s’impose déjà comme un révélateur de maturité digitale et de responsabilité sociétale. En anticipant ces évolutions dès aujourd’hui sur vos sites pro ou publics, vous faites plus que cocher une case : vous rendez service à tous vos utilisateurs… et vous préparez vos plateformes aux défis de demain.