L’accessibilité web : une évidence ?

J’ai présenté jeudi dernier mon approche de l’accessibilité chez PWN (Poitiers Web Nerds). L’idée était de partager des bonnes pratiques pour mieux l’intégrer quand on est un faiseur du web.

En fin de conférence, nous avons analysé deux exemples de sites : l’un public et l’autre dans le domaine privé. Comme nous avons pu le constater, le moindre grain de sable peut fermer la porte à tout un nombre d’utilisateurs. La navicon mal codée en est l’exemple le plus flagrant.

A l’heure où tous les nouveaux sites sont réalisés en responsive web design, on constate que le zoom texte n’est pas beaucoup mieux supporté que dans les années 2000. Les blocs de textes avec des propriétés CSS comme l’overflow hidden, les floats et les tailles fixes souvent mal combinés, ont généré une dette technique qui impacte encore des sites à grande audience.

Profitons-en pour nous mettre à jour avec Flexbox qui sera expliqué par Enguerran Weiss le 9 mars chez PWN. Ce sera l’occasion également de tester la robustesse de ces nouvelles techniques en pensant accessibilité, évolutivité et flexibilité.

On a vu également comment paramétrer votre page HTML : la langue, le viewport qui ne doit pas entraver le pinch en tactile et la hiérarchie des titres qui doit être cohérente et simple.

Pratiquer l’accessibilité web

Gardons en tête les 4 grands principes qui ont inspiré la Web Accessibility Initiative :

  1. Perceptible
  2. Utilisable
  3. Compréhensible
  4. Robuste

Apprendre par l’erreur

Pour une première passe de tests, j’ai choisi ces 7 contrôles :

  1. Accéder au contenu directement (un menu d’évitement)
  2. Naviguer au clavier (attention à l’outline et au choix des balises)
  3. Alternatives à toute l’info non textuelle (les images, les vidéos, les podcasts et les infographies…)
  4. Vérifier si les liens et boutons ne sont pas vides (les liens icônes)
  5. Pertinence des alternatives et labels (des alternatives compréhensibles et uniquement quand elles portent des informations)
  6. Boutons pour arrêter les animations (les vidéos en fond de page et les carrousels doivent être contrôlables d’une façon accessible)
  7. Support du zoom texte (construction extensible, unités relatives des fonts et de certaines largeurs de blocs…)

En corrigeant puis en validant ces 7 contrôles, nous n’avons sans doute pas terminé notre mise en accessibilité simple A ou double A mais c’est déjà une étape essentielle pour réaliser un web plus perceptible à tous.
Pour conclure, bien tester dans des conditions réelles avec tous les navigateurs, devices et lecteurs d’écrans du marché et aidez vous du référentiel RGAA3.

Vos retours d’expérience sont bienvenus !

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *