Accessibilité et site internet (1ère partie : couleurs et typographie)

“L’accessibilité consiste à mettre le contenu et les pages web à la disposition du plus grand nombre de personnes possible, quels que soient leurs antécédents ou leurs capacités.”

WebAIM – organisation à but non lucratif basée aux États-Unis fournissant des solutions en matière d’accessibilité web.

Que vous développiez un site Web pour votre entreprise, un blog ou un tout autre projet web, l’accessibilité est essentielle. L’accessibilité du Web consiste à rendre les sites Web universellement utilisables par tous, quelles que soient les capacités ou les handicaps. Ce premier article abordera deux aspects importants de l’accessibilité : les couleurs et la typographie.

Quel est l’impact des couleurs sur l’accessibilité d’un site web ?

Tout le monde ne distingue pas les couleurs de la même manière. Certains utilisateurs peuvent être daltoniens, en situation de déficience visuelle ou peuvent simplement vouloir accéder à votre contenu sur leur téléphone en plein soleil. Voilà pourquoi le choix des couleurs est primordial dans la conception de sites Web, de produits ou d’applications numériques.

Pour faciliter l’accès aux informations pour l’ensemble des utilisateurs et utilisatrices, il existe un ensemble de règles standardisées pour l’accessibilité dictées par le W3C (World Wide Web Consortium) au niveau international : les WCAG (Web Content Accessibility Guidelines).

En France, ces normes sont réunies dans le RGAA (Référentiel Général d’Accessibilité pour les Administrations). Basé sur les WCAG, ce référentiel regroupe trois niveaux d’accessibilité (A, AA et AAA). Pour la partie qui nous intéresse ici, les niveaux AA (double A) et AAA (triple A) imposent des rapports minimaux de contrastes entre la couleur du texte et celle du fond, afin d’améliorer la lisibilité des contenus.

Des recommandations concernant l’accessibilité et les couleurs il faut donc retenir deux points importants :

  1. La couleur ne doit pas être utilisée comme seul moyen visuel de véhiculer une information, une action, etc.
  2. Le rapport de contraste entre les éléments au premier plan et l’arrière-plan doit être suffisant. On parle ici de la couleur du texte, des icônes, mais aussi des bordures et autres éléments de formulaire par rapport à la couleur du fond de leur conteneur.

« La puissance d’Internet réside dans son universalité. Accessible à tous, indépendamment de tout handicap. L’accessibilité est donc son aspect essentiel. »

Tim Berners-Lee, créateur du World Wide Web.

Typographie : améliorer la lisibilité de votre interface.

La typographie est un art et une compétence qui va au-delà du choix de la police parfaite pour votre projet : elle permet d’améliorer la lisibilité, l’accessibilité, la convivialité et la hiérarchie de votre conception d’interface. La typographie peut être fragile dans certaines situations, avec le bon contraste et la bonne taille, les personnes rencontrant des difficultés à voir ou à entendre n’auront aucun problème à accéder à votre interface utilisateur.

La typographie doit être lisible et accessible à tous, quel que soit le handicap (daltonisme, déficience visuelle ou auditive, etc.) auquel votre utilisateur est confronté.

5 principes typographiques pour une conception optimale de l’interface utilisateur :

1. Utilisez des polices sans empattement lorsqu’il y a plus d’une phrase sur une ligne
2. Les titres qui attirent l’attention doivent toujours utiliser des polices à empattement
3. Différenciez les différents types de contenu par la taille et le poids
4. Faites bon usage de l’espace blanc pour que les lecteurs puissent trouver rapidement ce qu’ils cherchent
5. Utilisez les majuscules avec parcimonie car elles augmentent la lisibilité

La déficience visuelle est un handicap qui touche plus de 1,7 million de personnes en France et près de 253 millions dans le monde. Selon la Fédération des aveugles de France, seulement 10% des sites internet sont accessibles aux personnes aveugles et malvoyantes. Il est donc primordial de s’assurer que votre site est compatible avec les lecteurs d’écran et autres technologies d’assistance.

Vous pourriez aussi aimer ...