C'est aussi faire un WebDesign accessible par les personnes déficientes visuelles.
Quelques chiffres tout simples pour commencer :
- 10% des hommes souffrent d'une forme de daltonisme.
- 60 000 personnes non voyantes, en France
- Entre 1,5 et 3 millions de personnes mal-voyantes en France
Daltonisme
Définition
Handicap dans la perception des couleurs.
Il en existe de nombreuses formes : La perception humaine des couleurs se fait par l'identification de trois couleurs (le rouge, le vert et le bleu).
- Si la personne perçoit globalement ces trois couleurs, mais avec une ou plusieurs déficiences, ça s'appelle le trichromatisme anormal. (anomalie dans les rouges : protanomalie ; dans les verts : deuteranomalie ; dans les bleus : tritanomalie)
- S'il manque la perception d'une de ces couleurs, ça s'appelle le dichromatisme. (Si c'est le Rouge qui fait défaut, c'est la protanopie ; si le Vert manque, on parle de deutéranopie ; si c'est le Bleu qui manque : tritanopie)
- S'il manque deux couleurs sur les trois, c'est le monochromatisme. La personne voit le monde en niveaux de gris, ou avec des couleurs très délavées.
Problèmes rencontrés
Les codes couleurs évidemment… Mais aussi les graphismes peu contrastés.
Solution ?
Ce site vischeck.com est vraiment très pratique pour ça.
Une URL, un choix de pathologie et hop, il vous donne une idée de comment une personne dans ce cas perçoit votre site.
Personnes mal-voyantes / personnes non-voyantes
Définition
- Être malvoyant
On est considéré comme malvoyant lorsque l'on a moins de 4/10 après correction
- Être non-voyant
On est considéré non-voyant lorsque :- on a moins de 1/20 après correction et/ou
- on a un champ visuel inférieur à 10°
Problèmes
La plupart des problèmes liés au handicap visuel sont dûs à l'utilisation de lecteurs d'écrans ou d'outils de restitution en Braille.
Une personne mal-voyante utilisera ces outils en appoint. Par exemple, conjointement aux outils de zoom.
Une personne non-voyante n'a que cette restitution.
Ces logiciels examinent la page web comme étant du texte séquentiel. Pour avoir une idée du rendu que ça peut avoir, le navigateur Lynx (ou un de ses équivalent) est très pratique.
Solutions
Toutes ces petites recommandations que vous avez pu lire de droite et de gauche prennent leur sens :
- frames : Y'a pas pire.
Voilà un exemple de page avec Frames vue par Lynx :
(le site de la mairie de Sucy-en-Brie, me demandez pas pourquoi, c'est l'premier que j'ai trouvé)
Derrière les liens FRAME: xxx.htm, il n'y a rien. Juste rien…
Et quand on se met dans la peau d'une personne mal ou non voyante, le message qui dit qu'on est un peu con d'pas avoir un bon navigateur, il y a de quoi mal le prendre…
Si vous y tenez, la balise <noframe> permet de proposer un contenu alternatif exploitable. Mais de manière générale, les frames, c'est le mal.
- les images doivent avoir un texte alternatif (la propriété "alt" du tag <img> ) lorsqu'elles sont significatives.
Par exemple, "photo d'un plat de choucroute", c'est pas mal pour une photo de plat de choucroute.
Et " - " c'est pas mal comme texte alternatif pour une image qui a un rôle de séparateur.
- l'usage des tableaux : à limiter autant que possible.
La lecture séquentielle de tableau, c'est pas top.
Pire encore, avec un lecteur d'écran : il risque de lire naïvement horizontalement dans prendre en compte la structure du tableau.
Toutefois, si on m'en a souvent parlé, je n'ai encore jamais rencontré de problèmes avec ça.
Bah, de toute façon, les div, c'est mieux.
- Javascript : Vous vous rappelez de ces 5% de gens qui désactivent javascript ?
J'avais d'abord pensé « Quels chieurs ! Tant pis pour eux ! C'est leur choix après tout… ». Sauf qu'après m'être essayé au "screen reader" et autres périphériques de restitution pour personnes handicapées visuelle, ben je l'ai désactivé moi même…
Cela concerne d'avantage les personnes non-voyantes que les personnes mal-voyantes, je pense.
Lorsqu'un javascript modifie le contenue de la page, mon lecteur d'écran ne s'en apercevait pas (alors que lors d'un changement de page, si). Du coup, certains liens ne semblaient avoir aucun effet, et même si je me doutais qu'il y avait une conséquence quelque part il me fallait chercher "à tâtons" pour trouver la zone effectivement modifiée ou alors réécouter toute la page.
<noscript> est assez pratique pour proposer une alternative.
Externaliser ses javascripts dans des fichiers .js, c'est bien, aussi…
- Bien préciser le langage de la page et s'y tenir
(de base, la lecture automatique, c'est pas top, mais quand en plus c'est interprété comme une autre langue… >__<)
- Pas de SMS, par pitié…
(Si jamais y'avait besoin d'une raison supplémentaire)
- L'ascii art, c'est assez intrigant…
Mon expérience de ce domaine étant encore assez réduite et n'étant pas moi même déficient visuel, il est probable que j'ai oublié des choses. Si vous voyez des trucs à rajouter, je vous en prie, je serai le premier intéressé !
Sans oublier qu'après avoir testé tout ça les yeux fermés, je les ait rouverts et j'ai rangé ces logiciels…
