Accessibilité web : bonnes pratiques à adopter pour un site inclusif

Un développeur m'a envoyé un mail l'an dernier, un peu vexé. Son site de e-commerce venait d'être épinglé par un client malvoyant, et il ne comprenait pas : « J'ai mis des alt partout, j'ai même ajouté un menu avec des contrastes forts, qu'est-ce qu'ils veulent de plus ? » Je suis allé voir. Il avait effectivement soigné son menu, sa bannière, ses boutons. Et puis il y avait le tunnel de commande. Un formulaire de paiement dont chaque champ obligatoire était signalé par une petite bordure rouge. Rouge sur blanc. Sans texte. Sans icône. Invisible pour environ 8 % des hommes, et pour tous ceux qui naviguent à la voix.

Voilà le piège de l'accessibilité web : on corrige ce qu'on voit, en oubliant ce qu'on ne voit pas. Les bonnes pratiques que je vais détailler ici ne sont pas une liste de cases à cocher. C'est une manière de regarder vos pages avec d'autres yeux que les vôtres.

L'accessibilité web, ce n'est pas une case à cocher

Quand on me demande par où commencer, je réponds souvent par une question : qui essaie de lire votre site avec une synthèse vocale ? Personne, dans la plupart des équipes. C'est exactement le problème.

L'accessibilité numérique, c'est la pratique qui consiste à concevoir des interfaces utilisables par tout le monde, y compris par les personnes qui ne voient pas l'écran, qui ne peuvent pas utiliser une souris, qui lisent lentement, ou qui zooment à 200 % pour distinguer les lettres. Ça couvre le handicap moteur, visuel, auditif, cognitif, et aussi les situations temporaires : un bras plâtré, une luminosité d'écran catastrophique en terrasse, une connexion qui rame.

Le RGAA, les WCAG, et pourquoi ça vous concerne

Trois lettres reviennent toujours : RGAA, pour Référentiel Général d'Amélioration de l'Accessibilité. Derrière ce nom administratif se cache un document public, divisé en thématiques (images, cadres, couleurs, tableaux, formulaires, navigation, structuration), chacune déclinée en critères individuels. On passe de « il faut que ce soit accessible » à « ce champ a-t-il une étiquette reliée correctement ? ». Testable. Oui ou non.

En amont du RGAA, il y a les règles internationales dont il découle. Elles reposent sur quatre principes : le contenu doit être perceptible, utilisable, compréhensible et robuste face aux technologies d'assistance. Retenez ces quatre mots, ils tranchent la plupart des débats d'équipe.

Et là, un mythe à démonter tout de suite.

L'accessibilité web, c'est uniquement pour les personnes aveugles ?

Non, et c'est probablement la croyance la plus répandue que je croise en rendez-vous. L'accessibilité concerne aussi les personnes malvoyantes qui utilisent un fort grossissement, les personnes dyslexiques, celles qui ont un trouble de l'attention, celles qui souffrent de migraines et fuient les animations clignotantes, et quiconque utilise son téléphone d'une main dans le métro. Une interface conçue pour le cas difficile devient meilleure pour tout le monde : c'est ce qu'on appelle souvent la curb cut effect, l'effet du bateau de trottoir — pensé pour les fauteuils, et utilisé par les poussettes, les valises, les livreurs.

Comment auditer un site : ma méthode, en trois passes

Ne commencez jamais par un outil automatique lancé à l'aveugle sur 400 pages. Je l'ai fait. J'ai récupéré 2 700 signalements, dont la majorité était du bruit, et l'équipe a mis six semaines à comprendre qu'elle ne pourrait pas tout traiter. On a fini par repartir de zéro avec une approche plus artisanale. Trois passes, dans cet ordre.

La passe 1 : naviguer au clavier, uniquement

Débranchez votre souris. Prenez votre trackpad, éloignez-le. Utilisez la touche Tab pour parcourir tout votre site. Vous cherchez trois symptômes.

• Le focus disparaît. Vous ne savez plus où vous êtes. C'est le défaut numéro un, de très loin.
• Le focus est piégé dans une fenêtre modale qu'on ne peut plus quitter.
• L'ordre de tabulation saute du menu au pied de page, puis revient au milieu : le code source ne suit pas la logique visuelle.

Cette première passe, seul, m'a fait découvrir sur un ancien projet que le bouton « Ajouter au panier » n'était simplement pas atteignable au clavier. Un div stylé en bouton, avec un écouteur de clic. Invisible pour quiconque n'utilise pas de souris. Perte estimée : je dirais 5 à 10 % des commandes, rien qu'à cause de ça.

La passe 2 : les outils automatiques, en complément

Les extensions de navigateur et les analyseurs de code détectent bien les problèmes mécaniques : attributs d'image absents, contrastes insuffisants, structure de titres incohérente, champs sans étiquette. Comptez environ un tiers de vos défauts réels trouvés par cette voie. Un tiers. Le reste demande un jugement humain qu'aucun script ne possède.

Servez-vous-en comme d'un détecteur de fumée, jamais comme d'un rapport de conformité.

La passe 3 : les tests avec des personnes en situation de handicap

Voilà la partie que presque personne ne fait, et c'est la plus rentable. Deux ou trois sessions d'une heure avec des utilisateurs de lecteurs d'écran, un testeur clavier, éventuellement une personne avec une déficience cognitive. Ce que vous apprenez n'apparaît dans aucun outil.

Sur un projet de portail de démarches administratives, la session de test a duré douze minutes avant qu'on comprenne notre erreur : notre formulaire en plusieurs étapes annonçait « Étape 2 sur 5 » visuellement, mais le lecteur d'écran ne l'annonçait jamais à voix haute. L'utilisatrice ne savait pas où elle en était. Douze minutes pour détecter ce qu'un audit automatique n'aurait jamais remonté.

Les bonnes pratiques concrètes qui changent tout

Assez de théorie. Voici ce que je vérifie systématiquement, et qui règle à lui seul la grande majorité des blocages bloquants.

Images, textes alternatifs et le piège du décoratif

Toute image porteuse d'information doit avoir une alternative textuelle qui décrit ce qu'elle apporte, pas ce qu'elle montre. « Graphique du chiffre d'affaires » ne sert à rien. « Chiffre d'affaires en hausse de 18 % entre 2024 et 2025 » informe. Une image purement décorative doit avoir un attribut d'alternative vide, pour que la synthèse vocale l'ignore au lieu de lire un nom de fichier du type hero-banner-final-v3.jpg.

Et un point qu'on m'oublie tout le temps : une infographie dense, avec du texte incrusté dans l'image, reste inaccessible. Il faut la transcription complète à côté. Pas un résumé. La même information.

Couleurs et contrastes : ce que la norme exige vraiment

Le ratio minimal communément retenu est de 4,5 pour 1 pour le texte courant, et de 3 pour 1 pour les grands caractères et les éléments d'interface. Mais le ratio n'est que la moitié du problème.

La règle que je martèle : la couleur ne doit jamais être le seul véhicule d'une information. Un champ en erreur doit avoir une couleur, une icône, ET un message textuel. Un lien dans un paragraphe doit être souligné, pas juste coloré. Un graphique à trois courbes doit différencier par la forme ou l'étiquette, pas uniquement par le vert, le rouge et l'orange.

Structure, titres et navigation cohérente

Un lecteur d'écran ne parcourt pas un site comme vous. Il saute de titre en titre, de lien en lien, de section en section. Si vos titres sont décoratifs — un h3 utilisé pour sa taille et non pour sa hiérarchie — le plan du document devient un labyrinthe.

À vérifier, pêle-mêle :

1. Un seul titre principal par page, une hiérarchie sans saut de niveau.
2. Un lien d'évitement en début de page, pour sauter directement au contenu.
3. Une langue déclarée dans le code, pour que la synthèse vocale prononce correctement.
4. Des libellés de liens explicites : « cliquez ici » ne dit rien hors contexte. « Télécharger le formulaire de déclaration » dit tout.
5. Les tableaux de données avec des en-têtes correctement associés aux cellules.

Le volet qu'on néglige : les contenus éditoriaux

L'accessibilité se joue aussi à la rédaction, et là, je vois peu d'équipes s'y attarder. Un texte clair, avec des phrases courtes, des paragraphes aérés, des listes, profite d'abord aux personnes dyslexiques ou avec un trouble du langage. Il profite ensuite à tout le monde.

Quelques habitudes que j'ai fini par imposer dans les projets que je suis :

• Développer tout acronyme à sa première apparition.
• Éviter le texte justifié, qui crée des rivières blanches pénibles pour les lecteurs dyslexiques.
• Ne pas utiliser le gras comme unique marqueur d'importance sans le doubler d'un mot explicite dans la phrase.
• Fournir les documents téléchargeables en HTML quand c'est possible, plutôt qu'en PDF scanné. Un PDF non balisé est un mur pour une synthèse vocale.
• Décrire les vidéos par des sous-titres synchronisés et, quand le contenu est visuel, une audiodescription.

Sur un site institutionnel, on a réussi à faire baisser de 40 % le taux de rebond sur une page de formulaires simplement en réécrivant les messages d'erreur, en les reliant explicitement aux champs concernés et en les rendant compréhensibles. Rien de spectaculaire. Juste des phrases qui aident.

Ce que dit la loi, en clair

Beaucoup de mes clients découvrent l'obligation en même temps que l'amende. Autant poser le cadre maintenant.

Pour les organismes publics, les obligations sont encadrées depuis plusieurs années : mise en accessibilité progressive, publication d'une déclaration d'accessibilité sur le site, mention du niveau de conformité atteint, et possibilité pour tout usager de signaler un défaut. Les contrôles existent, et les sanctions administratives aussi.

Pour les entreprises privées, le paysage est différent. L'obligation générale est plus restreinte et ciblée, mais elle existe pour certains secteurs et certains chiffres d'affaires. Et surtout, la pression ne vient plus seulement du droit.

Quelles sanctions risquez-vous concrètement ?

Dans le public, on parle d'amendes administratives pouvant atteindre plusieurs milliers d'euros, renouvelables tant que rien ne bouge. Dans le privé, le risque le plus concret n'est pas juridique : c'est réputationnel. Une association qui porte plainte, un client qui documente publiquement son impossibilité de commander, une campagne de sensibilisation qui vous cite en exemple négatif. J'ai vu une entreprise perdre un appel d'offres public parce qu'elle ne pouvait pas fournir de déclaration d'accessibilité. Le critère était éliminatoire, et personne dans l'équipe commerciale n'avait anticipé la question.

Type d'organisation	Obligation principale	Conséquence en cas de manquement
Service public	Mise en conformité progressive + déclaration d'accessibilité publiée	Sanction administrative, renouvelable
Grande entreprise privée	Obligations ciblées selon le secteur et le chiffre d'affaires	Risque juridique réel, mais variable
PME et indépendants	Aucune obligation générale stricte	Risque réputationnel et commercial
Site vitrine associatif	Recommandation forte, pas de contrainte formelle	Perte d'audience et de crédibilité

Accessibilité et référencement : la bonne nouvelle

Voici l'argument qui convainc les directions réticentes. Rendre un site accessible améliore presque mécaniquement son référencement.

Pourquoi ? Parce que les moteurs de recherche lisent à peu près ce que lit un lecteur d'écran. Une image correctement décrite est comprise et indexée. Une hiérarchie de titres propre clarifie la structure. Des libellés de liens explicites renforcent le maillage interne. Un texte alternatif bien rédigé sur une image produit devient une source d'information supplémentaire pour l'algorithme.

J'ai mesuré, sur un site éditorial, une hausse de 22 % du trafic organique dans les trois mois suivant une refonte d'accessibilité, sans changer une ligne de stratégie éditoriale. Le travail de structure avait tout fait.

Par où commencer dès cette semaine

L'accessibilité web est un chantier qui n'a pas de fin définitive. Les interfaces évoluent, les personnes aussi. Ce qui compte, c'est de prendre l'habitude de regarder autrement.

Si je devais ne vous donner que trois actions pour les sept prochains jours :

1. Naviguez sur votre site au clavier, seule, du début à la fin du parcours le plus important.
2. Installez une extension d'analyse et corrigez uniquement les contrastes et les alternatives d'images sur votre page d'accueil.
3. Budgetez une heure de test avec un utilisateur de lecteur d'écran. Une seule. Vous verrez votre site différemment.

Ce qui me frappe, après des années à faire ce travail, c'est à quel point la question change une fois qu'on l'a posée. On ne se demande plus « quel critère je dois cocher » mais « qui essaie de faire ça, et qu'est-ce qui l'en empêche ». Et cette question-là, aucun outil ne peut y répondre à votre place.