Erreurs courantes d'accessibilité web (et comment les éviter)

L’accessibilité web répond à une question simple : est-ce que tout le monde peut réellement utiliser votre site, y compris les personnes qui voient mal, qui n’utilisent pas de souris ou qui se servent d’un lecteur d’écran ? Si vous l’avez perdue de vue, vous excluez des visiteurs, et un visiteur exclu ne devient jamais client. Dans cet article, vous découvrez les erreurs les plus courantes, pourquoi elles touchent votre chiffre d’affaires et comment les corriger. Bonne nouvelle : les plus gros gains se trouvent dans quelques erreurs de base que vous pouvez traiter dès aujourd’hui.

Qu’est-ce que l’accessibilité web exactement ?

L’accessibilité web signifie que votre site est utilisable par le plus grand nombre de personnes possible, quels que soient leur handicap ou l’appareil avec lequel elles naviguent. Le cadre de référence mondial est le WCAG (Web Content Accessibility Guidelines) du W3C, bâti sur quatre principes faciles à retenir avec l’acronyme POUR : perceptible, utilisable (opérable), compréhensible et robuste.

En pratique, cela revient à ceci : une personne qui ne perçoit pas les couleurs peut-elle distinguer vos boutons ? Une personne sans souris peut-elle remplir votre formulaire ? Un lecteur d’écran comprend-il ce qui se trouve sur votre page ? Souvent, la réponse est non, et presque jamais volontairement.

Pourquoi un site inaccessible vous coûte-t-il des clients ?

Très simplement : qui ne peut pas utiliser votre site n’achète pas, ne remplit aucun formulaire et ne prend pas contact. La barrière que vous dressez est un mur pour ce visiteur.

Et il ne s’agit pas d’une poignée de personnes. L’étude annuelle WebAIM Million analyse les pages d’accueil d’un million de sites web et a trouvé, dans son édition la plus récente, des erreurs WCAG détectables sur 95,9 pour cent d’entre elles, avec en moyenne quelque 56 erreurs par page. Ce ne sont pas des cas exotiques et marginaux. C’est la norme.

Chez nous, tout tourne autour d’une seule question : votre site web vous apporte-t-il des clients ? Un beau site qui exclut une partie de vos visiteurs fait fuir du taux de conversion que vous ne voyez jamais dans vos rapports, car ces personnes abandonnent en silence. C’est exactement pour cela que l’accessibilité a sa place dans tout projet sérieux de création de site web, et pas comme un détail ajouté après coup.

Soyons honnêtes : l’accessibilité, c’est presque toujours simplement une bonne UX pour tout le monde, un point que le W3C souligne aussi sans relâche dans ses explications sur les normes d’accessibilité. Un meilleur contraste aide aussi le visiteur en plein soleil. Un texte de bouton clair aide aussi celui qui est pressé. Vous améliorez l’expérience largement, pas seulement pour un groupe de niche.

Quelles erreurs rencontre-t-on le plus souvent ?

La plupart des problèmes ne relèvent pas d’une technique avancée, mais de fondamentaux qui se sont glissés lors de la construction. Voici les grands classiques.

Textes alternatifs manquants sur les images

Le texte alternatif est un morceau de HTML qui décrit ce que représente une image. Un lecteur d’écran lit ce texte à haute voix pour une personne qui ne voit pas l’image. S’il manque, le lecteur d’écran lit souvent tout simplement le nom du fichier, ce qui est inutile pour un graphique ou une infographie.

Attention à la différence entre vide et manquant. Une image purement décorative appelle un texte alternatif vide (alt=""), que le lecteur d’écran ignore proprement. Une image informative appelle un texte alternatif descriptif. Bonus : ces textes alternatifs aident aussi votre SEO.

Contraste de couleur trop faible

Essayez donc de lire du texte blanc sur un fond jaune. Pour beaucoup de gens, chaque page au contraste insuffisant produit cette sensation. Du texte gris clair sur du blanc, une couleur de marque comme texte de bouton sur un bouton juste un peu trop clair : cela paraît épuré dans la maquette, mais devient illisible pour une partie de vos visiteurs.

Le WCAG fournit ici des repères chiffrés stricts. Le texte normal a besoin d’un rapport de contraste d’au moins 4,5 pour 1, le grand texte d’au moins 3 pour 1. Avec le Contrast Checker gratuit de WebAIM, vous vérifiez cela en une minute. Portez un regard particulièrement critique sur vos boutons et vos formulaires, car c’est précisément là que la conversion se joue.

Impossible à utiliser au clavier

Tout le monde n’utilise pas de souris. Beaucoup de gens naviguent avec la touche Tab et la barre d’espace, parfois via un logiciel d’assistance. Pouvez-vous parcourir tout votre site et remplir chaque formulaire uniquement au clavier ? Sur les sites plus complexes, cela échoue souvent, parce que les menus, les pop-ups ou les boutons faits maison ne reçoivent pas le focus.

Deux améliorations rapides : faites en sorte que tout ce que l’on peut cliquer soit aussi accessible avec Tab et doté d’un contour de focus visible, et ajoutez un lien “aller au contenu” en haut de la page. Ainsi, un utilisateur au clavier n’a pas à parcourir tout votre menu avec Tab à chaque nouvelle page.

Champs de formulaire sans label

Vous avez presque certainement au moins un formulaire, ne serait-ce que sur votre page de contact. Mais chaque champ a-t-il un vrai label ? Le texte d’espace réservé (le texte gris qui disparaît dès que vous tapez) ne compte pas, car les lecteurs d’écran l’ignorent souvent et son contraste est généralement trop faible.

Utilisez un label visible relié à chaque champ via l’élément <label>. Ainsi, tout le monde sait, humain et lecteur d’écran, ce qui doit figurer dans chaque champ. Les formulaires sont votre moteur de conversion, donc rien ici ne doit être laissé au hasard. Vous en apprenez davantage dans notre guide sur la landing page.

Textes de lien vagues et tableaux illisibles

“Cliquez ici” ne dit rien, ni pour un visiteur avec un lecteur d’écran, ni pour Google. Un lecteur d’écran lit parfois tous les liens hors de leur contexte, et une liste pleine de “cliquez ici” et d’URL brutes devient alors inutilisable. Rédigez un texte de lien qui décrit où l’on arrive.

Les tableaux de données sont un autre écueil. Les lecteurs d’écran lisent souvent les tableaux dans le mauvais ordre. Gardez les tableaux simples et utilisez des en-têtes corrects (<th> avec scope) pour que la structure reste claire. Vous vous demandez si ce tableau doit vraiment être un tableau ? Alors, la plupart du temps, il ne l’est pas.

Que signifie l’European Accessibility Act pour vous ?

Depuis le 28 juin 2025, l’European Accessibility Act (EAA) s’applique. Cette réglementation européenne sur l’accessibilité web oblige de nombreuses entreprises à rendre leurs produits et services numériques accessibles, en particulier celles qui proposent des services en ligne ou du e-commerce aux consommateurs. En pratique, elle renvoie aux normes WCAG que nous avons abordées plus haut.

Nous ne donnons pas ici de conseil juridique, et toutes les organisations ne relèvent pas des mêmes obligations. Mais la direction est claire : l’accessibilité passe de “nice to have” à “attendu”. Faites vérifier par un spécialiste si et comment l’EAA s’applique à votre situation. Le bon côté des choses, c’est qu’en traitant les erreurs ci-dessus, vous allez de toute façon dans la bonne direction.

Comment vous y prendre concrètement ?

Vous n’avez pas à tout rendre parfait d’un coup. Travaillez dans cet ordre et vous engrangez rapidement des gains visibles :

1. Faites un contrôle manuel rapide. Naviguez sur votre propre site uniquement au clavier et baissez la luminosité de votre écran. Vous ressentez les points de douleur immédiatement.
2. Cueillez les fruits mûrs. Ajoutez des textes alternatifs, corrigez le contraste sur les boutons et reliez des labels aux champs de formulaire. Ce sont souvent les plus gros gains pour le moindre effort.
3. Testez avec de vrais outils. Les directives WCAG du W3C et des outils gratuits comme le WebAIM Contrast Checker vous donnent un retour objectif.
4. Reliez-le à vos objectifs. Une accessibilité qui ne débouche pas sur plus de pages utilisables et plus de conversion n’est qu’à moitié faite. Combinez-la avec votre travail sur augmenter votre taux de conversion et votre socle technique comme les Core Web Vitals.

Ne le traitez pas comme un grand nettoyage ponctuel. Chaque nouvelle page ou campagne peut introduire de nouvelles barrières, alors intégrez cette checklist par défaut.

Questions fréquentes

L’accessibilité web est-elle réservée aux personnes en situation de handicap ? Non. Elle aide tout le monde : les visiteurs en plein soleil, les personnes ayant une connexion lente, celles qui sont pressées ou qui naviguent sur un petit écran. C’est simplement une bonne UX.

Quelle est la différence entre le WCAG et l’European Accessibility Act ? Le WCAG est la directive technique (le “comment”). L’European Accessibility Act est une réglementation européenne qui détermine quelles organisations doivent être accessibles (le “qui et pourquoi”), et renvoie en pratique aux normes WCAG.

Quelle erreur dois-je traiter en premier ? Commencez par les trois fondamentaux : textes alternatifs, contraste de couleur et navigation au clavier. C’est là que se trouve le plus d’impact pour le moins d’effort.

L’accessibilité aide-t-elle aussi mon SEO ? Oui. Les textes alternatifs, les textes de lien clairs et une structure HTML propre rendent votre site plus lisible aussi bien pour les lecteurs d’écran que pour les moteurs de recherche.

Dois-je reconstruire tout mon site pour qu’il soit accessible ? La plupart du temps, non. La majorité des erreurs sont des ajustements ciblés sur des pages existantes. Une reconstruction complète n’est nécessaire que si les fondations sont techniquement vraiment bancales.

Prêt à faire fonctionner votre site pour tout le monde ?

L’accessibilité n’est pas une case à cocher, mais la manière la plus simple de convertir malgré tout en clients les visiteurs que vous perdez aujourd’hui en silence. Nous sommes une petite équipe, donc nous bougeons vite et regardons toujours au-delà du design : nous demandons ce que cela vous rapporte. Planifiez votre intake gratuit