Aller au contenu
Journal

Accessibilité web : par où commencer concrètement

4 min de lecture
AccessibilitéFront-endRGAA

Par où commencer sans tout réécrire

On commence l'accessibilité par les gestes simples qui couvrent déjà la majorité des problèmes réels. La discipline fait peur parce qu'on la croit énorme, alors qu'on progresse vite sans refonte. Premier réflexe : le contraste. Le texte doit ressortir nettement du fond, avec un ratio d'au moins 4,5 pour 1 sur le texte courant, vérifiable en quelques secondes avec un outil gratuit. Ce gris clair élégant sur fond blanc, illisible au soleil ou pour un œil fatigué, est l'erreur que je corrige le plus souvent.

Deuxième réflexe : les alternatives textuelles. Chaque image porteuse de sens reçoit un attribut alt qui décrit ce qu'elle montre, et les images purement décoratives reçoivent un alt vide pour que les lecteurs d'écran les ignorent au lieu d'énoncer un nom de fichier. Ces deux gestes ne demandent ni budget ni refonte, juste de l'attention. Ils s'intègrent dans le flux de développement normal, page par page, et ils changent déjà l'expérience pour beaucoup de visiteurs.

Tester la navigation au clavier

La navigation au clavier est le test le plus parlant qu'on puisse faire en cinq minutes. Posez la souris, parcourez votre site uniquement avec la touche Tab : si vous ne pouvez pas atteindre un lien, ouvrir un menu ou valider un formulaire, une partie de vos visiteurs ne le peut pas non plus. Les personnes qui n'utilisent pas de souris, par handicap moteur ou par habitude, dépendent entièrement de ce parcours.

Le focus visible va de pair avec ce test. Cet anneau qui entoure l'élément actif doit rester bien visible, et le supprimer en CSS « parce que c'est moche » casse l'accessibilité pour tout le monde sans rien apporter. On peut le styliser proprement, jamais le faire disparaître. Quand le focus est net et que l'ordre de tabulation suit la logique de lecture, le site devient utilisable au clavier presque sans effort supplémentaire.

Le HTML sémantique fait le gros du travail

Le HTML sémantique fait le gros du travail d'accessibilité gratuitement, avant même la moindre ligne d'ARIA. Un seul titre h1 par page, une hiérarchie de titres logique du h1 au h2 puis au h3 sans en sauter, de vrais éléments button et nav plutôt que des div habillées en boutons : ces choix de balisage donnent aux technologies d'assistance la structure dont elles ont besoin pour annoncer la page correctement.

C'est aussi la meilleure prévention contre la sur-ingénierie. ARIA sert à enrichir des composants complexes, pas à rattraper du HTML mal posé. Une div transformée en bouton à coups d'attributs ARIA sera toujours plus fragile qu'un vrai bouton qui gère nativement le clavier, le focus et l'annonce vocale. Mon premier réflexe est donc de choisir le bon élément, et de ne recourir à ARIA que lorsque le HTML natif ne suffit vraiment plus.

Mouvement et formulaires, deux détails à fort impact

Deux détails font une vraie différence pour peu d'effort : le mouvement et les formulaires. Pour le mouvement, je respecte prefers-reduced-motion : certaines personnes ressentent vertiges ou nausées face aux animations, et quelques lignes de CSS suffisent pour couper les effets quand le système signale cette préférence. Le site reste parfaitement utilisable, simplement plus calme.

Pour les formulaires, chaque champ a un label associé, les messages d'erreur sont explicites et reliés au champ concerné, et l'on ne signale jamais une erreur par la seule couleur, invisible pour une personne daltonienne. Ces ajustements ne demandent pas de refonte, ils s'intègrent dans le développement courant. L'accessibilité bien faite ne se voit pas, elle se ressent : tout fonctionne, pour tout le monde, sans friction.

Un enjeu aussi légal et SEO

L'accessibilité est aussi un enjeu légal et un levier de référencement, pas seulement une question de confort. En France, le RGAA traduit les critères internationaux WCAG et s'impose au secteur public comme à de nombreuses entreprises, avec des obligations de conformité et d'affichage. Ignorer le sujet, c'est s'exposer à un risque qui grandit à mesure que la réglementation se renforce.

Le recoupement avec le SEO est réel et concret. Titres bien hiérarchisés, textes alternatifs sur les images, HTML sémantique et structure claire sont exactement ce que les moteurs lisent pour comprendre une page. Un site accessible est un site mieux structuré, donc mieux compris par Google. Mon conseil pour démarrer : commencez petit, sur une page, mesurez, corrigez, puis généralisez. L'accessibilité est un chantier qui se construit dans le temps, pas un interrupteur qu'on actionne une fois pour toutes.

Article suivant

Application mobile : pourquoi je choisis Expo et React Native

Lire l'article