{"id":7328,"date":"2021-11-15T08:36:16","date_gmt":"2021-11-15T07:36:16","guid":{"rendered":"https:\/\/stephaniewalter.design\/fr\/?p=7328"},"modified":"2023-11-14T09:46:28","modified_gmt":"2023-11-14T08:46:28","slug":"accessibilite-et-couleurs-outils-et-ressources-pour-concevoir-des-produits-accessible","status":"publish","type":"post","link":"https:\/\/stephaniewalter.design\/fr\/blog\/accessibilite-et-couleurs-outils-et-ressources-pour-concevoir-des-produits-accessible\/","title":{"rendered":"Accessibilit\u00e9 et couleurs : outils et ressources pour concevoir des produits accessibles"},"content":{"rendered":"

J’avais discut\u00e9 sur Twitter il y quelque temps des lacunes dans l’enseignement des \u00e9tudiantes et \u00e9tudiants en design et notamment du manque de bases de l’accessibilit\u00e9 et des couleurs. Cette discussion a donn\u00e9 lieu \u00e0 pas mal de r\u00e9ponses int\u00e9ressantes sur les outils pour mesurer l’accessibilit\u00e9 des couleurs, le design inclusif et quelques discussions sur les \u00e9mojis.<\/p>\n

Plusieurs personnes sont venues me demander depuis des conseils et des outils pour les aider. Plut\u00f4t qu’un long tweet, j’ai d\u00e9cid\u00e9 de r\u00e9diger un article \u00ab\u00a0aide m\u00e9moire\u00a0\u00bb pour partager toutes les ressources, conseils et outils que j’utilise r\u00e9guli\u00e8rement pour construire et v\u00e9rifier l’accessibilit\u00e9 des couleurs des produits et services que je design. Je continue \u00e0 mettre \u00e0 jour r\u00e9guli\u00e8rement cet article avec de nouveaux outils.<\/p>\n

Derni\u00e8re mise \u00e0 jour : f\u00e9vrier 2023
\n<\/em><\/p>\n

** This article also exists in English<\/a> **<\/em><\/p>\n

Contraste et accessibilit\u00e9 : quelques notions de base sur la couleur<\/h2>\n

Dans le design de sites, produits ou applications, le choix des couleurs est important. La couleur peut v\u00e9hiculer l’identit\u00e9 de votre marque, aider les utilisatrices \u00e0 comprendre l’information, etc. Malheureusement, tout le monde ne distingue pas les couleurs de la m\u00eame fa\u00e7on<\/strong>. Certains utilisateurs peuvent \u00eatre daltoniens<\/strong>, d’autres utilisatrices peuvent \u00eatre malvoyantes<\/strong>. D’autres encore peuvent se trouver dans diff\u00e9rents environnements ou situations qui rendent la perception des couleurs et des contrastes complexes<\/strong>. C’est pourquoi faire attention \u00e0 l’accessibilit\u00e9 de vos produits, sites et services est primordial.<\/p>\n

Je n’entrerai pas tous les d\u00e9tails sur l’accessibilit\u00e9 en g\u00e9n\u00e9ral car cet article porte sp\u00e9cifiquement sur les couleurs. Ce que vous devez retenir c’est qu’il y a une liste de crit\u00e8res que vous pouvez trouver dans les directives WCAG 2.1 (en anglais)<\/a> pour vous aider. Pour le moment le 2.1 n’est pas encore traduit en fran\u00e7ais mais il existe une traduction pour WCAG 2.0<\/a>. Si vous \u00eates en France, le r\u00e9f\u00e9rentiel \u00e0 suivre est le RGAA<\/a>, pensez \u00e0 v\u00e9rifier lequel est applicable dans votre pays.<\/p>\n

Dans cette grande liste, la section 1.4<\/a> est d\u00e9di\u00e9e \u00e0 \u00ab\u00a0faciliter la perception visuelle et auditive du contenu par l’utilisateur, notamment en s\u00e9parant le premier plan de l’arri\u00e8re-plan\u00a0\u00bb. Pour cette petite introduction, je m’en tiendrai aux crit\u00e8res AA qui est le niveau qu’il est bon de viser le plus souvent, puisqu’il permet de couvrir la majorit\u00e9 des besoins en accessibilit\u00e9.<\/p>\n

Concernant l’accessibilit\u00e9 et les couleurs, il y a 2 grandes choses dont vous devez vous souvenir :<\/p>\n