L'accessibilité des sites Internet

Sélection de liens concernant l'accessibilité

Directives pour l'accessibilité aux contenus Web (Lagrange)
Ce document assez ancien propose une liste intéressante de recommandations. Nous regrettons toutefois la vision étriquée de l'accessibilité qui figure dans leurs définitions : "Accessible : Le contenu est dit accessible quand il peut être utilisé par une personne ayant un handicap".
On peut avoir un équipement un peu particulier (un système Unix, par exemple) sans être pour autant handicapé.
Doit-on pour autant être exclu du Web ?

Sur le même site : Astuces pour l'accessibilité

Qu'est-ce que l'accessibilité Web?
" L'accessibilité du Web intéresse aussi bien les personnes handicapées (...) que tout individu devant faire face à des difficultés liées à des aspects intrinsèques (.) ou à leur environnement (matériel et logiciel désuets, infrastructure réseau obsolète, droits réseaux limités, connexion à faible débit, contexte de navigation)."
Voilà qui nous convient mieux ! Nous vous recommandons particulièrement cet excellent article.

L'utilisateur moyen n'existe pas
"Nous sommes tous des utilisateurs du Web. Nous avons donc naturellement tendance à penser que tous les utilisateurs nous ressemblent et qu'ils apprécient le web de la même façon que nous." Voilà un article qui dénonce avec beaucoup de lucidité l'erreur la plus classique du Web Design.

Accessibilité du Web par Alsacréations

Opquast : les bonnes pratiques
Entre autres ressources consacrées à la qualité des sites Web, ce site propose une liste de "bonnes pratiques" à adopter pour améliorer l'ergonomie et l'accessibilité.

Outils

Opcast
Acces-pour-tous
Hera
Ces outils examinent le code de vos pages et signalent les risques potentiels de manque d'accessibilité.

Web Developer
pour FireFox
Cette extension propose de nombreux petits outils très utiles aux développeurs Web, ainsi que de nombreuses petites fonctions qui faciliteront la vie des internautes handicapés.

Forums

Webmaster-Hub
Alsacréations

Nous avons tous des handicaps

En intitulant l'un de ses articles "oublions les handicapés", Eric Daspet s'offre un titre provocateur. Son objectif est pourtant le plus honnête du monde : rappeler que l'accessibilité doit cibler large, que personne ne mérite d'être exclus du Web.

Limiter l'accessibilité à la seule compatibilité avec les lecteurs texte (pour malvoyants) est une erreur trop courante et trop réductrice :

• les problèmes de vision ne sont pas les seuls handicaps compliquant la navigation. 
• les internautes non-handicapés doivent, eux aussi, avoir droit au respect de leurs particularités, quelles qu'elles soient.

Visez l'accessibilité, c'est d'abord viser le plus grand nombre. C'est éviter l'erreur de conception qui vous fera perdre - et qui pénalisera - 10, 20 voire 60% de vos visiteurs potentiels à cause d'un problème d'incompatibilité de navigateur.

Visez l'accessibilité, c'est viser la meilleure compatibilité possible avec tous les systèmes de navigation existants et futurs. Le terme de "système" est à prendre au sens large et comprend :

Le "hard" : type de souris, type d'écran, de clavier, de stylet ou de tout autre accessoire de commande (y compris, en effet, les commandes vocales pour handicapés moteurs), type de connexion (tout le monde n'a pas le haut ou le très haut débit).

Le "soft" : systèmes d'exploitation et navigateurs, sans oublier Unix et le monde Apple. Il vous faudra également prendre en compte l'existence des lecteurs textes et les nouveaux systèmes mobiles de type PDA.

Les habitudes des internautes : certains préfèrent désactiver le javascript, d'autres interdisent le chargement des images, augmentent la taille des caractères pour compenser leurs difficultés visuelles, jonglent avec les tailles des fenêtres, préfèrent naviguer à l'aide du clavier plutôt que par la souris, utilisent ou n'utilisent pas les raccourcis claviers.

Les règles principales

L'accessibilité est un thème vaste qui mérite un long développement. Les sites proposés dans notre encadrés de droite sauront, mieux que nous, répondre aux questions les plus subtiles sur ce thème.

Nous nous contenterons donc d'énoncer les règles les plus évidentes à respecter dans ce domaine :

Utiliser un langage clair

C'est la première et la plus importante des règles d'accessibilité. Le jargon technique, les phrases "savantes", complexes ou interminables, rendront votre contenu inaccessible à de nombreux visiteurs. Sans vouloir viser la perfection absolue, ayez toujours cette préoccupation à l'esprit : tout le monde n'a pas un doctorat de français en poche.

Le respect de l'orthographe et de la grammaire est également important pour faciliter la compréhension de vos textes.

Penser à la diversité des écrans

En 2007, entre 5% et 10% des internautes sont encore équipés d'écran 800 x 600 pixels. Mais ce pourcentage peut fortement varier en fonction du thème de votre site et donc du type de visiteur que vous pouvez attirer. L'habitude consiste donc à créer des designs respectant cette résolution minimum, même si ce point devient de moins en moins important.

Parallèlement, les écrans "wide" (plus de 1600 pixels de large) se répandent de plus en plus, ce qui peut poser un problème important pour les designs "fluides" (voir notre article consacré à la mise en page)

Mais la résolution n'est pas le seul point à prendre en compte : les écrans LCD antérieurs à 2004 - et certains écrans d'entrée de gamme encore vendus aujourd'hui - sont incapables de restituer les couleurs très pâles. Les teintes trop sombres peuvent également poser problème sur les écrans à tube. Vos design doivent par conséquent être basés sur des contrastes relativement marqués pour être compréhensibles par tous.

Tester le design sur les principaux navigateurs

Ne considérez jamais votre design comme abouti tant que vous ne l'avez pas testé sur Internet Explorer 6, Internet Explorer 7, FireFox et Opera.

A chaque modification importante, refaite un test sur ces différents navigateurs.

Il est tout à fait possible d'installer plusieurs versions d'Internet Explorer ou de FireFox sur une seule machine afin de pouvoir faire des tests. Pour y parvenir, vous devrez vous procurer des versions "standalone" de ces navigateurs. Wikistuce propose dans ce but une archive incluant IE 5.5, IE 6 SP2, IE 7, Firefox 1.5.0.7, Firefox 2.0, Opera 8.5, Opera 9 et Netscape 7.

Les sites BrowserCam et Browsershots vous donneront des captures d'écran de vos pages vues à travers les différents navigateurs du marché. Vous pouvez également utiliser DejaVu pour tester votre site avec les navigateurs des années 90 ou danvine pour tester votre site avec Safari Macintosh ou Internet Explorer 7.0 ainsi que Scapture pour les navigateurs du monde Linux.

Concevoir des pages légères

Une page de 100k mettra plus de 20 secondes à se charger pour un internaute disposant d'une connexion ADSL d'entrée de gamme. Autant dire qu'elle sera inaccessible ou quasi-inaccessible pour plus de la moitié de la planète (du moins en 2007, à l'heure où nous écrivons ces lignes).

Les pays sous-développés ne sont pas les seuls à souffrir de connections à bas débit. C'est aussi le cas de nombreuses régions françaises pour peu qu'elles soient éloignées des grandes villes.

La difficulté d'accès liée au bas débit est tout simplement inconcevable pour un internaute parisien. (Paris a l'un des réseaux les plus performants au monde). Elle n'en existe pas moins. Tenez-en compte !

Si votre design ne peut se passer d'images volumineuses, arrangez-vous pour que le texte principal de votre page se charge en premier. Cette mesure permettra aux visiteurs de patienter plus facilement.

Lire les réflexions de Vincent Bénard sur ce sujet.

Respecter la sémantique

N'utilisez pas les balises <p>, <br>, <h1>, <h2>,... à tort et à travers. La bonne utilisation de ces balises est un pas de géant vers l'accessibilité. Cette pratique vous aidera également à structurer vos contenus de façon plus rationnelle.

OpenWeb propose un article clair et détaillé sur les avantages d'une sémantique bien appliquée.

Prévoir des alternatives aux images

Une erreur classique consiste à afficher un texte blanc sur une image sombre. Si l'internaute désactive l'affichage des images, ce texte blanc se retrouve sur un fond blanc et devient donc invisible. En ayant conscience de ce risque, vous prendrez la précaution d'attribuer une couleur de fond à votre bloc texte ou à votre page. Si l'image est chargée, cette couleur ne sera pas visible pas le visiteur, mais si l'image ne se charge pas, le texte reste lisible.

Vous devrez également renseigner la balise "Alt" de toutes les images utiles à la compréhension de votre texte ou à la navigation. Un menu graphique sans balises "Alt" est totalement inutilisable pour les visiteurs utilisant des navigateurs en mode texte.

Prévoir des alternatives au javascript et au Flash

Les internautes ayant désactivé - volontairement ou non - l'exécution des scripts en Flash ou en Javascript sont loin d'être exceptionnels (5 à 10% selon les rares sources disponibles sur ce sujet). Certains navigateurs en mode texte ne supportent tout simplement pas ces langages.

Votre site doit rester parfaitement navigable dans ces conditions. SI vous ne savez pas comment procéder pour obtenir ce résultat, mieux vaut vous abstenir d'utiliser ces langages.

Se renseigner sur les différentes façons de naviguer

La plupart des navigateurs supportent en standard la navigation à l'aide des touches du clavier. Ces raccourcis sont d'autant plus importants qu'ils sont utilisés par certains systèmes de navigation par commande vocale. Encore faut-il que votre design ne compromette pas leur fonctionnement.

Pour pouvoir tester ces fonctions sur vos designs, vous devrez d'abord les connaître ! Consultez la liste des raccourcis proposée par Alsacréations.

Ne pas se reposer entièrement sur les CSS

Il y a trop souvent confusion entre accessibilité et CSS. Respecter strictement les standards du W3C et pratiquer la mise en page en "full CSS" ne garanti en aucune façon l'accessibilité d'un design. C'est même souvent le contraire qui se produit !

Malgré les prétentions de ceux qui en font la promotion, les CSS ne sont rien d'autre qu'une technique de design. Utiliser cette technique sans comprendre les bases de l'accessibilité conduit généralement à la catastrophe.

Le site RankSpirit met en garde contre les "fausses promesses" des CSS

Ce site vous a plu ? Visitez aussi :  et 

-