Accessibilité et conception de site web : mise en conformité ou refonte ?

accessibility-check-ascensus.gif
Votre site exclut des utilisateurs ? Agissez dès maintenant

L’accessibilité web est bien plus qu’une exigence réglementaire : c’est une condition essentielle pour garantir à tous un accès équitable à l’information et aux services en ligne. Pourtant, la conception de sites web accessibles n'est pas encore la norme. De nombreux sites web restent donc aujourd’hui inaccessibles à une partie de leurs utilisateurs, souvent sans que leurs éditeurs en aient conscience. Comment savoir si votre site est concerné ? Est-il possible de corriger les problèmes sans tout reconstruire ? Quelles sont les bonnes pratiques à adopter pour garantir une accessibilité durable ? Ce guide vous aide à y voir clair, en abordant de manière concrète les enjeux, les signaux d’alerte et les leviers d’action pour passer à l’action efficacement.

 

[Petit rappel] Enjeux de l'accessibilité d’un site web

L’accessibilité web est une notion souvent évoquée, parfois mal comprise, et encore trop rarement anticipée. Pour bien saisir son importance, il est utile de revenir brièvement sur ce qu’elle recouvre, sur les publics concernés, et sur les bénéfices concrets qu’elle apporte — pour les utilisateurs bien sûr, mais aussi pour les organisations. Cette première section vous propose un rapide tour d’horizon pour poser les bases d’une démarche éclairée.

Définition de l’accessibilité web

Communément, la notion d’accessibilité web désigne tout ce qui permet à un utilisateur en situation de handicap (sensoriel, moteur, cognitif ou psychologique) de naviguer sur un site web. Plus largement, on peut considérer qu’un site est accessible si toute personne peut naviguer dessus, indépendamment de son âge par exemple (problématiques de cécité), mais aussi de sa connexion internet. Sur ce second point, la notion d’accessibilité web rejoint celle d’écoconception.

Handicaps pris en compte dans l’accessibilité web

Encore une fois, l’accessibilité ne doit pas être considérée comme un enjeu uniquement pour les personnes en situation de handicap. Mais les principales normes d’accessibilité web visent à prendre en compte plus spécifiquement ce public malgré tout. 

On compte schématiquement 3 familles de handicaps : 

  • Les handicaps moteurs (déficiences motrices),
  • Les handicaps sensoriels (déficiences auditives et visuelles),
  • Les handicaps cognitifs et psychologiques.

Handicaps moteurs 

Cela concerne aussi bien les personnes porteuses d’un handicap moteur important et permanent (trouble de la dextérité, paralysie, etc.), que celles souffrant d'une incapacité ponctuelle (fractures diverses).

Ces personnes ont besoin de sites web sur lesquels ils peuvent naviguer sans utiliser une souris (au clavier typiquement) ou qui n’obligent pas à des gestes complexes (comme le glisser-déposer par exemple).

Handicaps sensoriels

Il s’agit de l’ensemble des déficiences visuelles et auditives. Les experts séparent parfois les troubles visuels (cécité, malvoyance, daltonisme, cataracte…) et auditifs (surdité, déficience auditive) afin de marquer le fait qu’ils doivent être traités de manière distincte.

Rendre un site web accessible pour ces personnes passe pour les premiers, selon le niveau de cécité, par des adaptations graphiques (accentuation des contrastes par exemple) ou par une compatibilité avec les lecteurs d’écran. Pour les seconds, un site web sera considéré comme accessible lorsque toutes les informations sonores trouvent une traduction visuelle. C’est la mise en place de sous-titres dans les vidéos par exemple.

Handicaps cognitifs et psychologiques

Les troubles cognitifs (TDAH, dyslexie, autisme…) et psychologiques (dépression, anxiété, TSPT…) limitent la concentration, la patience et/ou la compréhension des contenus. Pour rendre une interface web accessible à ces personnes, il est essentiel de concevoir des interfaces claires, prévisibles et simplifiées.

Ici l’accessibilité web passe par exemple par une structure de site web claire et un vocabulaire simple.

Arguments en faveur de l’accessibilité web

Même si les bénéfices de l’accessibilité devraient aller de soi, voici quelques arguments à rappeler en interne pour convaincre les personnes décisionnaires au sein de votre entreprise que l’accessibilité web est aujourd’hui un indispensable : 

  • 1 personne sur 4 en Europe souffre de troubles qui nécessitent d’utiliser des sites web accessibles, c’est donc tout un marché auquel vous pouvez vous ouvrir ou vous fermer;
  • Ce qui améliore l’expérience de navigation pour les personnes porteuses de handicaps contribue souvent aussi à l’expérience utilisateur de l’ensemble des visiteurs;
  • Un site web accessible est aligné avec les meilleurs standards SEO, et améliorera donc le référencement web de votre site internet;
  • Disposer d’un site web accessible renforce votre positionnement RSE et attire des clients sensibles à l'inclusion;
  • Les contraintes d'accessibilité favorisent la créativité technique et fonctionnelle, et permettent parfois d’identifier de meilleures méthodes de conception de site web.

Faut-il reprendre entièrement la conception de mon site web pour le rendre accessible ?

Beaucoup d’équipes se posent la même question au moment d’initier une démarche de mise en conformité : peut-on corriger l’existant, ou faut-il tout repenser ? La réponse dépend du niveau de dette technique et des problèmes rencontrés. Certaines erreurs peuvent être corrigées localement, mais d’autres nécessitent une refonte plus globale. Dans cette section, nous vous aidons à distinguer les cas où une reprise partielle suffit de ceux où une refonte est préférable, voire indispensable.

Audit d’accessibilité automatisé : quelles conclusions en tirer ?

Certains outils facilitent le travail d’identification des erreurs d’accessibilité. On peut citer PageSpeed / Google Lighthouse, WAVE ou encore AChecker, mais il en existe bien d’autres. Ces solutions sont parfois qualifiées à tort d’outils d’audit automatisé, cependant leur rôle se borne à détecter certains défauts d’accessibilité. Pas tous. 

Réaliser un test d’accessibilité de votre site web avec ces outils reste malgré tout une bonne étape afin de vous rendre compte du travail que va représenter une mise en conformité avec les standards d’accessibilité web. 

Parmi les informations fournies par ces outils, vous trouverez : 

  • Les défauts de contraste,
  • Les erreurs de balisage de formulaires,
  • Les erreurs de balisage ARIA,
  • Les défauts de texte alternatif pour les images,
  • Les erreurs de structure de titres.

Le résultat de ces analyses vous donnera une bonne indication sur la nécessité d’une refonte pour mettre en conformité votre site web avec les règles d’accessibilité. Mais ce n’est pas le seul élément à prendre en compte. Encore une fois, avoir un site web accessible, ce n’est pas cocher toutes les cases sur un outil, c’est permettre à tous et toutes de naviguer sur un site web. Les outils de test de l'accessibilité web peuvent donner des indications, mais ne permettent pas de certifier de l’accessibilité d’un site web.

3 erreurs d’accessibilité que vous pouvez corriger facilement

Ces erreurs sont fréquentes, mais simples à corriger – en particulier sur les sites web de taille modeste (site vitrine, blog, portail web simple…). En vous attaquant à ces points dès maintenant, vous améliorez considérablement l’expérience de navigation de vos utilisateurs… tout en posant les bases de votre conformité.

  1. Corriger les éléments graphiques et éditoriaux de base
    Veillez à respecter les contrastes de couleurs, utilisez une taille de police lisible, et simplifiez vos textes. Éviter le jargon et privilégier des phrases courtes améliore l’accessibilité pour les personnes ayant des troubles cognitifs, mais aussi pour l’ensemble de vos visiteurs.
     
  2. Ajouter des alternatives textuelles aux images et vidéos
    Chaque image porteuse de sens doit être accompagnée d’un texte alternatif (balise alt), et vos vidéos doivent au minimum proposer des sous-titres. C’est essentiel pour les personnes aveugles, malvoyantes ou sourdes.
     
  3. Publier une déclaration d’accessibilité
    Même si votre site n’est pas encore parfaitement conforme, publier une déclaration d’accessibilité montre votre engagement. En France, cette déclaration constitue même pour l'instant la principale obligation à laquelle sont soumis les secteurs réglementés. Elle informe les utilisateurs sur l’état de votre site, les éventuelles limitations, et les moyens de vous signaler un problème.

3 signes que l’accessibilité de votre site web passe par une refonte

Si les différents tests d’accessibilité web font remonter de nombreuses erreurs, on peut raisonnablement penser que le bilan d’un véritable audit d’accessibilité sera plus lourd encore. Dans ce cas, une refonte complète est plus conseillée qu’un chantier de mise en conformité. D’autant plus si la conception du site web date de plus de 5 ans.

Indépendamment du volume d’erreurs, certains défauts d’accessibilité web doivent également vous amener à considérer une refonte de votre site web plutôt qu’une mise en conformité.

Navigation au clavier impossible

L’impossibilité de naviguer sur votre site au clavier est l’un des signaux les plus clairs que l’accessibilité n’a pas été intégrée dès sa conception.

Il ne s’agit pas simplement d’ajouter un style CSS ou une balise manquante : dans la plupart des cas, l’ordre des éléments, la structure HTML et l’interactivité du site entier doivent être repensés. C’est particulièrement vrai pour les composants dynamiques (menus déroulants, carrousels, modales…), qui sont souvent conçus pour la souris, mais non testés pour le clavier ou les technologies d’assistance.

Une refonte est alors l’occasion de :

  • d’adopter une approche « accessibility by design », dès les maquettes.
  • de choisir un framework front-end ou des composants déjà accessibles.
  • de prévoir des tests de navigation au clavier à chaque étape de validation.

Intégrer l’accessibilité dès le départ coûte in fine beaucoup moins cher que des corrections tardives et partielles.

La plupart du temps, revenir sur un graphisme et des CSS, qui en plus ont parfois évolué pendant des années, pour essayer de rendre ça accessible, c'est quasiment infaisable. Ça revient moins cher, finalement, de reprendre à zéro et de repenser une navigation et des structures de pages beaucoup plus propres et beaucoup plus simples. Alors, sur l'instant, c'est un investissement, c'est sûr. Mais je pense qu'à terme, on est gagnant.

Clément EGGER, Senior Product Manager CMS & DAM chez Jahia

Formulaires non balisés

Les formulaires sont souvent des points critiques d’un site web — inscriptions, prises de contact, candidatures, demandes d’informations. Pourtant, ils sont aussi parmi les éléments les plus fréquemment inaccessibles.
Un formulaire non balisé signifie, par exemple, que les champs ne sont pas correctement associés à leurs libellés (<label>), que les messages d’erreur ne sont pas lisibles par un lecteur d’écran, ou que la navigation au clavier est incohérente.

Pour un utilisateur aveugle ou malvoyant utilisant un lecteur d’écran, un champ de saisie sans balise explicite devient incompréhensible : il entend simplement « champ de texte » sans savoir à quoi il correspond. Même chose pour les utilisateurs ayant des troubles cognitifs, qui peuvent se perdre face à des indications manquantes ou mal placées.

Volume important de fichiers PDF

Certains problèmes identifiés dans les audits — comme des images sans texte alternatif, des contrastes faibles ou des balises manquantes — peuvent souvent être corrigés individuellement. Mais d’autres, comme une médiathèque remplie de PDF illisibles, sont beaucoup plus complexes.

Sur le site de l'UCANSS, il y a pas mal de fichiers PDF qui ne sont pas lisibles, qui sont même pour certains encore des images. Il n'y a pas de retranscription. On a un travail là-dessus, mais qui est compliqué. Alors que sur Lasecurecrute.fr on est reparti un peu d’une feuille blanche.

Julie BARATCHART, Architecte logiciel ‑ Référente accessibilité numérique à l’UCANSS

Dans le cadre d’une refonte, on peut repenser complètement la manière dont les contenus sont produits, organisés et présentés :

  • Mettre en place un moteur de recherche filtrant les fichiers accessibles.
  • Prévoir un circuit de validation pour les nouveaux documents.
  • Intégrer la production de PDF balisés dans les processus métiers.

Règles de conception d’un site web accessible

Une fois la décision de rendre votre site accessible prise, encore faut-il savoir comment s’y prendre. L’accessibilité ne repose pas sur des actions isolées, mais sur une cohérence d’ensemble qui implique les rédacteurs, les designers, les développeurs et les chefs de projet. Cette dernière partie vous propose des bonnes pratiques concrètes à adopter à chaque étape de la conception, pour ancrer l’accessibilité dans la durée et construire des interfaces réellement inclusives.

Normes d’accessibilité des sites web : ce que dit le W3C 

Le W3C (World Wide Web Consortium) est l’organisation internationale à l’origine des standards du Web, comme les WCAG (Web Content Accessibility Guidelines), ARIA et d'autres normes garantissant l’accessibilité et l’interopérabilité des technologies web.

Les WCAG sont des recommandations internationales qui définissent les bonnes pratiques pour rendre les sites web accessibles aux personnes en situation de handicap. Selon cette norme, un site web est accessible s’il est :

  1. Perceptible : L’information doit être perçue via tous les sens possibles (ex. textes alternatifs pour images).
  2. Utilisable : Les composants doivent être accessibles, même au clavier seul.
  3. Compréhensible : Les interfaces doivent être faciles à comprendre et utiliser.
  4. Robuste : Les contenus doivent fonctionner avec les technologies d’assistance

Quels aspects de la conception de site web sont concernés par les enjeux d’accessibilité ?

Quand on cherche à concevoir un site web accessible, il est nécessaire de sensibiliser et de mobiliser l’ensemble des parties prenantes d’un projet web. En effet, l’accessibilité web s’appuie sur 3 piliers (que nous détaillerons juste après) : 

  • Éditorial - Accessibilité du contenu web;
  • Graphique - Application des normes d’accessibilité au web design;
  • Technique - Conception de sites web accessibles (bonnes pratiques de développement web).

Il s’agit d’une précision importante, car les enjeux d’accessibilité web sont souvent plutôt portés par des équipes communication, et donc prennent plus facilement en compte les enjeux visuels (contrastes, police de caractères, textes alternatifs sur les images). Cependant un aspect aussi indispensable que la capacité à naviguer correctement au clavier, par exemple, est un sujet technique, il est donc important d’embarquer également des développeurs lorsqu’on souhaite faire de l’accessibilité d’un site web un enjeu prioritaire. D’ailleurs, avoir à la fois un référent en accessibilité web côté communication, et un référent accessibilité web plus technique est une des bonnes pratiques de l’accessibilité web que vous pouvez garder à l’esprit.

Un dernier aspect de la conception de site web concerné par les enjeux d’accessibilité est souvent oublié : le CMS. Théoriquement, tous vos outils (et donc votre CMS aussi) doivent être rendus accessibles afin de ne pas créer de barrière à l’entrée pour le recrutement de personnes en situation de handicap. Il n’existe pas de CMS accessible à 100% à ce jour, cependant certains CMS sont plus accessibles que d’autres. Jahia fait partie des solutions CMS qui travaillent sur la question.

Bonnes pratiques de l’accessibilité web 

Si vous décidez de mettre en place une démarche d’accessibilité web pour votre site web, voici quelques bonnes pratiques à respecter. Elles vous permettront non seulement de passer avec succès votre audit d’accessibilité web, mais également de rester accessible. 

Accessibilité du contenu web

Du côté éditorial, la première règle est la clarté. Utiliser un langage simple et direct, structurer les contenus avec des titres hiérarchisés, ne pas multiplier les acronymes ou les formulations complexes. Il est aussi essentiel d’écrire des textes alternatifs pour chaque image porteuse d'information, et de veiller à ce que les liens soient explicites : un lien intitulé « cliquez ici » ne dit rien à un utilisateur qui navigue à la synthèse vocale. 

Enfin, chaque document téléchargeable doit faire l’objet d’une vérification : un PDF doit être lisible, balisé, et contenir un texte réel — et non une image scannée.

Accessibilité et web design 

Côté design, la cohérence visuelle est une alliée de l’accessibilité. Utiliser des contrastes suffisants entre texte et arrière-plan, éviter les textes superposés à des images ou à des couleurs trop claires, et définir une police de caractère lisible et suffisamment grande sont autant de gestes simples qui facilitent la lecture. 

Autre point : un bon design accessible ne repose pas sur la couleur seule pour transmettre une information, mais y ajoute des symboles, du texte ou des icônes.

Conception web accessible (aspects techniques)

Sur le plan technique, une structure HTML propre et sémantique est essentielle. Chaque élément doit avoir un rôle clair, les titres doivent respecter une hiérarchie logique, et les zones interactives être accessibles via le clavier. 

Et encore une fois, les formulaires doivent être balisés correctement, avec des labels reliés aux champs, des indications claires sur les champs obligatoires et des messages d’erreur compréhensibles par tous.

Retour