UX et Web Design

Previous Next
Design

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é.

 

Frederique Bleu Ebene

Frédérique Montrésor
Fondatrice et UX Designer
Bleu Ebène

 

 

 

Découvrez les secrets du digital !


Toutes les 3 semaines, vous recevez un nouvel e-mail avec les secrets de nos experts : Web, SEO, SEA, Stratégie, Ventes, Image de marque, Technique, Rédaction, Réseaux sociaux, Vidéo, Marketing, E-commerce, et bien d'autres encore.
Etes-vous prêt à recevoir les secrets du digital ?

bleu ebene blanc

Collectif d'indépendants dédié à la communication d'entreprise

WEB | GRAPHIC | PRINT

 

Suivez-nous

Inscrivez-vous à notre newsletter

Copyright © 2019 Bleu Ebène.

Rechercher

+33 6 79 28 15 51 1 allée Joseph Lalande 94000 Créteil
Le site Bleu Ebène utilise des cookies pour vous assurer la meilleure expérience utilisateur pour son fonctionnement, merci d'autoriser les cookies.
Politique de confidentialité J'autorise les cookies Je décline