NOIISE Ressources SEO Comprendre et agir en faveur de l’accessibilité de votre site web (et son SEO)

Comprendre et agir en faveur de l’accessibilité de votre site web (et son SEO)

2 décembre 2022 – Roland Debrabant

La mise en conformité d’un site pour le rendre accessible a des avantages multiples. Non seulement vous pouvez toucher un public plus large mais vous potentialisez également votre visibilité sur Google. Dans cet article, nous vous proposons de comprendre ce qu’est l’accessibilité web, les bonnes pratiques à mettre en œuvre, comment vérifier l’accessibilité de son site et découvrir les avantages SEO qui découlent de sa mise en place.

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

Le principe de l’accessibilité web implique que les outils et les technologies soient développés de façon à ce que les personnes handicapées puissent les utiliser.

Définition de l’accessibilité web

Un site web accessible est un site dont le contenu est accessible à tous: valides, seniors et personnes en situation de handicap. Déficience auditive, visuelle, troubles cognitifs ou mobilité, autant de handicaps qui touchent aujourd’hui près de 18% de la population qui, sans prise en compte spécifique se voient privés d’un accès optimal au web. Un site accessible se devra donc d’être :

  • perceptible : accentuer une différentiation des éléments entre eux (textes/images/boutons) et fournir une alternative textuelle aux images ;
  • utilisable : le contenu doit être accessible tant grâce à une souris ou assimilé (trackpad par exemple) mais également grâce au clavier via une navigation par tabulation ;
  • compréhensible : les textes doivent être lisibles en permanence ;
  • robuste : le contenu doit être accessible quel que soit le support sur lequel il est consulté.

Qui sont les personnes ciblées par l’accessibilité numérique ?

Il faut garder à l’esprit que l’accessibilité n’est pas uniquement une histoire de handicap : l’accessibilité concerne toutes les déficiences qu’elles soient temporaires ou non, concerne également les handicaps cognitifs et neurologiques, mais également les valides dans certains usages (mobile, ordinateur portable sans souris, visibilité réduite etc…)

Les normes internationales pour l’accessibilité web

Le W3C a mis en place un groupe de réflexion (la Web Accessibility Initiative ou WAI) qui a posé les bases de l’accessibilité web et les premières recommandations:

WCAG: Web Content Accessibility Guidelines (https://www.w3.org/Translations/WCAG20-fr/Les directives d’accessibilité du contenu Web (WCAG) sont élaborées par le biais W3C en coopération avec des personnes et des organisations du monde entier. Le but est de fournir une norme unique et partagée pour l’accessibilité du contenu Web qui réponde aux besoins des personnes, des organisations et des gouvernements, ce au niveau international.

Les documents WCAG expliquent comment rendre le contenu Web plus accessible aux personnes handicapées. Le “contenu” du Web désigne généralement les informations d’une page ou une application Web, notamment les informations naturelles telles que le texte, les images et les sons mais également le code ou le balisage qui définit la structure, la présentation, etc.

WAI ARIA : Accessible Rich Internet Applications (https://www.w3.org/TR/wai-aria/). WAI-ARIA est une spécification technique qui fournit un cadre pour améliorer l’accessibilité et l’interopérabilité du contenu et des applications Web. Ce document s’adresse principalement aux développeurs qui créent des widgets personnalisés et d’autres composants d’applications Web.

Les objectifs de cette spécification sont les suivants :

  • Elargir les informations relatives à l’accessibilité qui peuvent être fournies par l’auteur ;
  • Exiger une prise en charge complète du clavier qui peut être mise en œuvre de manière indépendante du dispositif, par exemple, par des téléphones, des dispositifs portables, des lecteurs de livres électroniques et des téléviseurs ;
  • Améliorer l’accessibilité du contenu dynamique généré par des scripts ; et assurer l’interopérabilité avec les technologies d’assistance.

Pourquoi rendre son site accessible ?

“Rendre le web accessible est un avantage pour les internautes, les entreprises et la société. Les standards du web internationaux définissent ce qui est nécessaire pour l’accessibilité.”

Permettre un web inclusif

En travaillant le sujet, on améliore l’accessibilité de plusieurs handicaps simultanément. Par exemple, permettre une navigation au clavier aide les non-voyants, les personnes avec un handicap moteur empêchant ou limitant l’utilisation d’une souris… Mais cela permet également de faciliter la navigation des utilisateurs d’ordinateurs portables. Le but est d’améliorer globalement l’expérience utilisateur (“Hello Core Web vitals”) : par exemple, le PDF semble être un format pratique, mais qui reste inaccessible aux softwares de synthèse vocale. Intégrer le contenu d’un PDF en html (tout en le conservant accessible en téléchargement) permet finalement de le rendre accessible à tous et sur tous les supports.

Les bonnes pratiques pour un site plus accessibles

  • Fournir un texte alternatif pour tous les éléments visuels (images, vidéos etc…) et tous les contenus audio
  • Renseigner la balise alt sur toutes les balises img
  • Permettre une navigation au clavier
  • Utiliser une police sans serif, plus faciles à lire pour les dyslexiques par exemple
  • Permettre l’augmentation de la taille du texte
  • Utiliser un contraste fort avec le texte et privilégier texte sombre sur fond clair
  • Ne pas utiliser de texte justifié qui augmente les espaces et diminue la lisibilité
  • Paradoxalement, la mise en gras limite l’accessibilité en rapprochant les lettres entre elles
  • S’assurer que le rendu est optimal sur toutes les plateformes (mobile, pc, lecteur etc…)
  • Proposer un libellé sur les champs des formulaires
  • Respecter le balisage Hn
  • Respecter le balisage de structure HTML5 (header, footer, nav, article etc…)
  • Utiliser les balises pour ce qu’elles sont: le HTML sert pour la structure et le CSS pour la forme (et non l’inverse comme on voit très souvent

Vous souhaitez évaluer la pertinence du SEO dans votre stratégie ?

Profitez de 30 minutes de consulting stratégique avec un consultant expert de l'agence SEO NOIISE !

Clotilde Bernet, Manager SEO

Comment évaluer l’accessibilité de son site ?

POUR UNE VISION D’ENSEMBLE

https://ace.accessibe.com/

Hyper rapide pour vous donner un aperçu de votre site et de son niveau de conformité

VÉRIFIER LA LISIBILITÉ EN COMPARANT LES COULEURS D’ARRIÈRE ET PREMIER PLAN

https://snook.ca/technical/colour_contrast/colour.html

https://contrastchecker.com/

VÉRIFIER LA CONFORMITÉ AUX RÉGLEMENTATIONS WCAG

https://squizlabs.github.io/HTML_CodeSniffer/ 

UN WEBDEVELOPPER TOOLS PERMETTANT DE SIMULER DES HANDICAPS VISUELS

UNE EXTENSION WORDPRESS QUI VOUS PERMET VOUS MÊME DE CONTRÔLER LES ÉLÉMENTS D’ACCESSIBILITÉ

https://fr.wordpress.org/plugins/quality-checklist-opquast/

Accessibilité et SEO

A priori perçue comme incompatible voire même un frein au SEO, il s’avère que mettre en place des actions visant l’accessibilité d’un site permettent de bonifier votre SEO.

Les différences entre accessibilité et SEO

Le SEO ne se résume pas à une optimisation technique et c’est sur la partie sémantique qu’accessibilité et SEO vont légèrement diverger.

 

LES TITRES HN

En visant une accessibilité forte, un rédacteur aura tendance par exemple à aller à l’essentiel dans ses titres Hn puisque le thème de la page est implicite. On retrouvera donc des titres sur ce modèle:

<h1>Imprimante jet d’encre

<h2>Quel intérêt ?

<h2>Différences avec l’imprimante laser

 

A l’inverse, un rédacteur privilégiant le SEO fournira plus probablement ce genre de titre:

<h1>Imprimante jet d’encre

<h2>Imprimante jet d’encre : Quel intérêt ?

<h2>Différences entre Imprimante jet d’encre et l’imprimante laser

 

LES IMAGES ET LES BALISES ALT

Dans une optique d’accessibilité et de simplicité, une succession d’images similaires (paysages, photos de produit prisent sous des angles différents etc…) n’auront qu’une seule balise alt renseignée pour la première image.

Pour le SEO une balise alt pourrait ressembler à “Imprimante jet d’encre ou laser [Marque]”

A l’inverse, un SEO aura tendance à voir chaque image comme une opportunité supplémentaire de placer des mots clefs et remplira chaque balise alt avec des micro variations.

alors que pour l’accessibilité web, une balise alt ressemblerait à “image comparative d’imprimante laser et à jet d’encre”.

Les avantages pour votre SEO

Fournir un code HTML propre, respecter la structure Hn, renseigner ses balises alt…. Est-on en pleine recommandation SEO ou en brief pour rendre son site accessible ? Les 2 mon capitaine ! Les 2 approches se recoupent étroitement…

Un lecteur d’écran pour mal voyant déroule le code HTML et l’interprète; au même titre qu’un robot d’indexation. Google est de plus en plus performant dans son interprétation des contenus mais malgré tout, il reste :

  • en partie aveugle
  • sourd (sauf sur sa plateforme vidéo)
  • ne perçoit pas les couleurs
  • a besoin d’aide pour comprendre les images
  • et galère avec le CSS et le JS

En bref, il cumule les handicaps qui justifient de lui faciliter la tâche. Rendre son site accessible revient finalement à optimiser son SEO ! Mais est-ce vraiment toujours le cas ?

Conclusion

“Des passerelles mais pas d’amalgame”

Une page “accessible” doit logiquement être bien indexée et bénéficier d’indicateurs positifs aux yeux de Google; cependant elle n’aura certainement pas exactement le niveau d’optimisation d’un point de vue SEO pour bien se positionner.

A l’inverse, une page optimisée pour le SEO risque d’être un peu trop longue, avec un caractère redondant dans l’utilisation de mots clefs, être moins “droit au but” pour un utilisateur.

L’objectif n’est bien entendu pas de choisir entre l’un ou l’autre puisque les deux sont complémentaires: le 1er facilite l’indexation d’une page et brosse les robots dans le sens du poil (c’est d’autant plus vrai avec la prise en compte des core web vitals), quand l’autre favorise sa position dans les résultats de recherche.

Vous souhaitez en savoir plus les services de
NOIISE en référencement naturel ?

Découvrez notre agence SEO !

Roland Debrabant CCO Noiise
Roland Debrabant
Directeur Associé

Directeur des opérations (COO) en charge de l’équipe des managers, trafic SEO et CSM au sein de NOIISE (7 agences).  Passionné de Web, il est également Co-fondateur du groupe NOIISE et Co-fondateur du collectif d’agence E-marketing international Ranking Road.