10 régles RGAA que favorisent Google
En France, plus de 5 millions de personnes sont malentendantes, plus de 1,7 million sont malvoyantes et environ 60 000 aveugles. Depuis que les sites Internet existent, designers et intégrateurs web cherchent à rendre leurs sites lisibles par tous et que l'information soit accessible universellement. Nos conseils.
En France, la loi du 11 février 2005, « Pour l’égalité des droits et des chances, la participation et la citoyenneté des personnes handicapées » impose, dans son article 47, « l’accessibilité des services de communication publique en ligne pour les services de l’État, des collectivités territoriales et des établissements publics qui en dépendent ». Elle oblige les administrations à suivre des règles très précises reprises dans un référentiel national, le RGAA pour Référentiel Général d’Accessibilité pour les Administrations.
Alors, pourquoi ne pas suivre ce référentiel pour avoir un site "friendly", d’autant que les nouvelles consignes gouvernementales tendent à le rendre obligatoire sur tous les sites d'ici peu ?
Vous mettre en conformité RGAA
Nous avons retenu 10 critères sur les 187 du référentiel pour vous aider à valider votre site selon le référentiel RGAA.
1. Le titre et les sous-titres des pages
Les pages de votre site comportent des titres, mis en valeur et reconnaissables grâce à une mise en forme spécifique : en gras, dans une taille de police plus grande, etc. Les personnes malvoyantes ne distinguant pas cette mise en forme, il est important que la structure de vos pages soit restituée autrement (vocalement ou en braille). Ce sont les balises HTML "h" qui permettent d'indiquer s'il s'agit d'un titre 1, d’un sous-titre h2 ou d’un titre h3... Le RGAA demande également une hiérarchie sans interruption dans les titres, autrement dit pas de h3 sans h2 avant. Et n’oubliez pas que ces balises sont indispensables au bon référencement de votre site dans Google !
2. Les couleurs et les contrastes
Pour améliorer et optimiser la lecture, il est conseillé d’optimiser des contrastes entre les textes et l’arrière-plan (texte foncé sur fond clair ou texte clair sur fond foncé). Il existe des sites permettant de tester si le ratio entre les deux couleurs répond au critère d’accessibilité tel que Colour Contrast Analyser, disponible sous Windows et Mac en téléchargement libre. Le rapport de contraste dépend, entre autres, de la taille et de la graisse des textes. Si le ratio est trop faible, utilisez Tanaguru Contrast-Finder, un outil en ligne qui vous proposera des combinaisons de couleurs proches des vôtres, tout en respectant le ratio.
3. Les images et l'attribut « ALT»
La norme demande que la totalité des images de votre site comporte des balises « ALT », descriptives de l'image. Les infographies contenant de l’information non présentes dans le contenu éditorial doivent notamment avoir une alternative textuelle à l’aide de ces balises. En revanche les images décoratives n'en ont pas besoin, car elles n'apportent aucune information à faire transcrire par un appareil pour malvoyants.
4. L'agrandissement de la taille du texte
Dans un souci d'accessibilité, vous devez permettre à vos visiteurs d'agrandir la taille des caractères sans perte de lisibilité et d'information. Si votre site reste lisible avec une taille du texte augmentée à 200 %, il est conforme au référentiel d'accessibilité. Cet élément doit être intégré dès la conception de votre site, sans limites de zoom, mais avec un minimum à garantir de 150 % qui correspond à "très grand".
5. Le plan du site
Vous pensez que le sitemap (ou plan de site) fait partie d'un autre temps, détrompez-vous. La norme RGAA le recommande pour que l'ensemble de la navigation de votre site puisse être accessible, c'est d'ailleurs un point commun avec Google !.
6. Comprendre une vidéo ou un média audio sans le son
Afin d’être traduisible par des personnes sourdes et malentendantes, tout média audio de votre site doit avoir une version texte et toute vidéo doit être sous-titrée. Ces sous-titres doivent pouvoir être activés et désactivés depuis le lecteur vidéo. Aujourd'hui, la plupart des lecteurs proposent cette fonctionnalité, sinon vous devrez proposer deux vidéos : l’une avec les sous-titres et l’autre sans.
7. Accéder aux éléments cliquables à l'aide du clavier
Dans le cas d’un handicap moteur ou visuel, l’internaute ne peut pas utiliser la souris. Il est fondamental que tous les éléments cliquables à la souris (menus, liens, images-liens, bulles d’aide, etc.) soient également activables au clavier. Pour faire le test, placez-vous avec la souris sur la barre d’adresse, puis utilisez les flèches de votre clavier.
8. Les liens de téléchargement
Il existe deux types de liens : ceux qui mènent vers une page web et ceux qui produisent une action, comme le téléchargement d’un document. Il est recommandé d'indiquer le format et le poids du document dans le lien en question. Le lien s’intitulera par exemple : « Nom du document (PDF, 135ko) ».
9. Être conforme W3C
On demande souvent dans les cahiers des charges d'être conforme aux règles du W3C et du RGAA. En fait pour être à la norme RGAA il faut que le référentiel W3C soit appliqué. On ne peut obtenir l'un sans l'autre. Il serait donc plus judicieux de mentionner uniquement le RGAA.
10. Dernier point et non pas des moindres Google est un robot malvoyant
Google favorise les sites qui respectent les 10 règles RGAA ci-dessus, car il est aveugle ! C'est pourquoi il fait la promotion des sites qui donnent des contenus accessibles aux utilisateurs handicapés. Respecter le RGAA ce n'est pas seulement être altruiste, c'est aussi bon pour votre business. Usez de ces règles de conformité pour vos sites et vous gagnerez en visibilité.
Frédérique Montrésor
Fondatrice et UX Designer
Bleu Ebène