Navigation

Contactez-nous

Kitpages
17 rue de la Frise
38000 Grenoble
tel : 04 58 00 33 81

Par Philippe Le Van (twitter accountplv) Dernière mise à jour : 16 April 2012

Principes et normes de l'accessibilité web

Définition

L'accessibilité web est un ensemble de technologies, d'outils et de pratiques permettant à des handicapés d'accéder à des sites internet au mieux (c'est loin d'être définition officielle, je sacrifie volontairement l'exactitude à la clarté).

Cette page s'adresse à des développeurs web. Elle vous permet juste de défricher le terrain. Des tutoriaux plus pratiques devraient arriver au fil du temps dans cette rubrique.

En gros quand on parle d'accessibilité web, on parle principalement d'aides pour palier le mieux possible les handicaps suivants :

  • handicaps visuels : mal voyants et non voyants
  • handicaps auditifs : sourds et mal entendants
  • handicaps cognitifs
  • certains handicaps moteurs (notamment quand ils empêchent d'utiliser un clavier, une souris,...)

note : L'accessibilité est souvent abrégé a11y.

Principes

Handicaps cognitifs

En gros, un seul mot d'ordre : faire simple et clair.

Handicaps moteurs

Là on parle principalement d'un problème matériel (claviers adaptés, commandes vocales,...). L'impact sur le site web est ensuite proche des contraintes pour les handicaps visuels.

Handicaps auditifs

Ca concerne principalement les vidéos. L'idée est d'avoir une retranscription textuelle (idéalement des sous-titres synchronisés) de la vidéo.

Handicaps visuels

Notons que les handicaps visuels ne se limitent pas aux non voyants. Il y a de nombreux handicaps visuels (perception des couleurs dégradée, perception des contrastes, vision floue,...).

On a donc plusieurs mots d'ordre ici :

  • Vérifier que les textes sont bien contrastés avec le fond
  • Les textes doivent être suffisament gros et les textes doivent pouvoir être agrandis.
  • L'ensemble de la page doit être compatible avec des lecteurs d'écran (soit vocaux soit en braille)

Normes et organismes

Les 3 "normes" importantes pour des sites français

La norme de référence est le WCAG 2.0 (Web Content Accessibility Guidelines).

WCAG (prononcer ouécague) est une norme très théorique et très générale ne s'adressant pas uniquement au web. En clair elle est illisible.

2 "normes françaises" donnent des règles pratiques à utiliser sur le web pour être compatibles WCAG 2.0 :

  • RGAA : en gros les sites publics (mairies, ministères,...) doivent appliquer les règles RGAA.
  • Référenciel Accessiweb : accessiweb est une association spécialisée dans l'accessibilité. Elle publie une liste de règles à suivre (le référenciel accessiweb) pour être compatible avec la norme WCAG 2.0

WCAG 2.0

Norme éditée par le W3C / WAI (Web Accessibility Initiative). C'est la "vraie norme" en cours sur l'accessibilité web.

C'est une norme très théorique, qui ne s'adresse pas qu'au web et qui est assez illisible. Norme WCAG 2.0

Elle dispose de 3 niveaux

  • A (ou bronze) : correctement accessible
  • B (ou argent) : niveau standard
  • C (ou or) : très bonne accessbilité

A noter : le niveau B est déjà difficile à atteindre strictement. Le niveau C n'est pas toujours possible à atteindre.

RGAA

Norme française qui met en application WCAG 2.0 est la norme RGAA 2.2.

Elle est :

  • pratique
  • bien documentée

La norme RGAA 2.2

Référentiel Accessiweb

Le référenciel accessiweb est un "concurrent" de RGAA. A priori il est plus complet que RGAA. Si vous êtes compatible accessiweb, vous êtes compatibles RGAA.

De la même façon que RGAA c'est une mise en application de WCAG 2.0.

Le référentiel accessiweb

Qui est impliqué dans la création d'un site accessible ?

Dans la création d'un site web, les contraintes liées à l'accessibilité ne concernent pas que les développeurs. Voyons qui doit intervenir là dedans :

  • Le graphiste doit veiller à la taille des caractères, les contrastes de couleurs, une ergonomie compatible
  • Le développeur doit suivre toutes les recommandations techniques des normes RGAA ou Accessiweb, avec notamment des recommandations fortes à suivre sur les liens, les formulaires ou les navigations.
  • Le rédacteur du site doit bien veiller à toujours mettre des contenus alternatifs à ses images (quand elles ont un sens autre que décoratif), faire des transcriptions textuelles de vidéo (ou mieux, des sous-titres)... Si vous êtes comme moi dans une agence web, il faut donc former votre client à l'accessibilité web.

 

En pratique, les premiers tests

En pratique, comment savoir si un site est au moins un minimum accessible :

  • Essayer de surfer au clavier : mettez votre curseur dans la barre d'adresse et essayer de surfer juste avec la touche "tab" et "return" pour cliquer.
    • Parfois le curseur se met à tourner en boucle entre 3 liens
    • Parfois tous les liens ne sont pas possible à atteindre juste avec la touche tab
    • Parfois il y a tellement de liens qu'avant d'arriver au contenu, c'est une galère sans nom
  • Regarder s'il y a des textes alternatifs sur les images, notamment s'il y a un lien sur l'image. Il faut que tous les liens aient un nom explicite (éviter les boutons "ok", les "cliquez ici").
  • Installer un lecteur d'écran (type NVDA) et réessayer de surfer avec en utilisant "tab"

Après il y a beaucoup d'autres critères, mais ces tests sont sans doute les premiers à faire.

Les outils de base

Quelques outils pour tester l'accessibilité (pour Firefox) :

  • la web developper toolbar (permet de surligner les images sans alt, virer les CSS, ...)
  • la Firefox Accessibility Extension : des outils pour checker automatiquement quelques règles
  • NVDA : un lecteur vocal opensource (avec une voix atroce) qui permet de réaliser à quoi ressemble le web vu par un lecteur vocal. (là on réalise que l'organisation de la page, c'est important)
  • Firebug : bon si vous êtes lecteur ici, vous devez connaitre...
  • Tanaguru : un outil en ligne de test automatique de niveau d'accessibilité
  • Color Contrast Analyser : analyse le contraste d'un texte par rapport au fond et indique si c'est suffisant ou non pour les normes.

Bon, il y a plein d'autres outils. Aucun n'est magique et ne couvre tous les besoins, notamment parce qu'une bonne partie des recommandations des normes concernent des points éminament humains (l'image a-t-elle un sens ou bien est-elle purement décorative ? des éléments rédactionnels,...).

Conclusion

Merci à Philippe Vayssière de Alsacreations pour sa formation sur l'accessibilité web.

Note : je sais que cette page n'est pas un modèle d'accessibilité... ça devrait progresser un jour...

Ce tutoriel a juste pour objectif de donner quelques bases qui vous permettront d'aller plus loin vous même. N'hesitez à ajouter des commentaires pour compléter ce tutoriel.

Commentaires

Ajouter un commentaire
Re: Pourquoi réduire l'accessibilité au handicap ?
Bonjour,

Effectivement votre définition est meilleure que la mienne, mais elle est trop théorique et complexe pour un article qui se veut un peu bourrin, écrit par un techos pour des techos...

Un des éléments qui m'a motivé pour écrire cette page est la difficulté de trouver des informations sur l'accessibilité dans un langage direct et pratique.

Je sacrifie ici l'exactitude à la clarté. Mais effectivement, je vais le mentionner ce fait, le parti pris étant sujet à controverse.

Merci pour votre remarque, Philippe
Pourquoi réduire l'accessibilité au handicap ?
Pourquoi réduire l'accessibilité au handicap ? Attention, l'accessibilité c'est « mettre le Web et ses services à la disposition de *tous les individus*, quels que soient leur matériel ou logiciel, leur infrastructure réseau, leur langue maternelle, leur culture, leur localisation géographique, ou leurs aptitudes physiques ou mentales. L'accès à l'information et à la communication est un droit universel. Le web est devenu un média majeur, et il se doit d'être accessible à tous sans discrimination. »
Voir cette définition de l'accessibilité chez Ocawa : http://www.ocawa.com/fr/Accessibilite/Definition.htm
Re: Atteindre oui
Corrigé, merci !
Atteindre oui
Le niveau C n'est pas toujours possible à attenidre
pas possible à attenidre, certainement, atteindre peut-être.