Qu'est-ce que le ratio WCAG? Pourquoi devriez-vous l'implémenter dans vos conceptions

Les Web Content Accessibility Guidelines (WCAG) sont des directives d'accessibilité pour la conception numérique et Web. Le respect de ces directives garantit que les couleurs sont suffisamment contrastées pour aider les personnes malvoyantes à voir et à lire correctement vos créations. Cela va également de pair avec la taille typographique, pour assurer sa lisibilité avec les couleurs.

Dans un monde qui devrait être plus inclusif, l'ajout d'éléments accessibles à vos conceptions ne fera qu'élever votre travail et vous permettra de le partager avec plus de personnes.

Qu'est-ce que le ratio WCAG?

WCAG signifie Directives pour l'accessibilité du contenu Web. Le WCAG aide toute personne concevant ou créant pour le Web ou Internet à s'assurer que ses conceptions atteignent les objectifs d'accessibilité. Cela signifie que vos conceptions peuvent être appréciées et utilisées par n'importe qui, sans exclure les personnes ayant une déficience visuelle ou d'autres handicaps lorsque cela est possible.

Le ratio WCAG définit les ratios minimaux pour atteindre l'accessibilité cible. Cela inclut le contraste des couleurs et la taille du texte, qui garantissent tous deux aux personnes malvoyantes une meilleure chance de voir, d'interagir avec et d'utiliser vos conceptions. Non seulement atteindre le ratio WCAG aide les personnes ayant une déficience visuelle, mais il améliore également l'expérience utilisateur pour tous les internautes.

Le Le World Wide Web Consortium élabore des normes pour le développement Web. Bien qu'il n'y ait pas de règles définies pour l'accessibilité du Web, les WCAG définissent une norme à suivre que tout concepteur de sites Web doit respecter.

Lors du test des rapports de contraste, le WCAG suggère une note de A à AAA. Une note A indique les niveaux de contraste les plus bas. AA sont des niveaux de contraste moyens avec un rapport de 4,5:1, considéré comme le rapport minimum. Enfin, AAA est le niveau de contraste le plus élevé. Si vous concevez pour tout le monde, vos niveaux de contraste sont meilleurs lorsqu'ils se situent entre une plage AA et AAA.

Pourquoi le ratio WCAG est-il important dans la conception graphique et Web?

La conception graphique et la conception Web ne doivent pas seulement rendre les informations jolies. La conception de l'information informe les masses, ce qui signifie rendre vos informations accessibles à tous. La mise en œuvre des WCAG garantit des conceptions accessibles aux personnes souffrant de déficience visuelle, de dyslexie, de neurodivergence ou de tout ce qui affecte la vue ou la capacité de lecture de quelqu'un.

La conception Web et numérique, ainsi que la programmation, ont déjà mis en place des fonctionnalités d'accessibilité. Par exemple, Windows fournit des outils d'accessibilité utiles pour les utilisateurs, et il est déjà courant pour la plupart des vidéos YouTube d'offrir sous-titres ou légendes. Mais nous pouvons toujours améliorer l'accessibilité.

La conception globale crée une meilleure conception. Plus il y a de personnes qui peuvent s'engager avec votre conception, plus elle est réussie et plus elle a de portée. Non seulement c'est bon pour vous en tant que designer d'atteindre plus de personnes, mais c'est mieux pour le monde que moins de personnes soient exclues.

Concevoir avec le ratio WCAG et les fonctionnalités d'accessibilité dans vos conceptions aura des effets positifs sur les palettes de couleurs, les choix de typographie et les tailles de texte. Vous ne concevriez pas délibérément quelque chose de difficile à lire, alors pourquoi ne pas inclure plus de façons de créer des conceptions avec une meilleure lisibilité pour tous ?

Implémentation du ratio WCAG dans vos conceptions

Il existe des endroits où vous pouvez vérifier le ratio WCAG dans vos conceptions, comme celui-ci vérificateur de contraste site Internet. Mais vous devriez de toute façon vous mettre en pratique pour implémenter des fonctionnalités de conception accessibles dans votre travail sans vous fier au strict minimum.

Il convient de noter que les directives de contraste ne s'appliquent pas à la conception de logo. Cela est dû au fait que les logos sont présentés à des tailles différentes et souvent sur des arrière-plans différents. Cependant, cela ne vous fait pas de mal de tenir compte du ratio WCAG lors de la conception de logos.

Couleurs à contraste élevé

L'utilisation de couleurs à contraste élevé est un moyen simple d'ajouter de l'inclusivité à vos conceptions. Les couleurs qui contrastent les unes avec les autres aideront les personnes malvoyantes et daltoniennes à mieux voir vos créations. Non seulement cela, mais même les personnes sans déficience visuelle verront mieux vos créations et s'y engageront.

Avez-vous déjà essayé de lire un texte rose clair sur un fond vert clair? C'est presque impossible. Mais un texte bleu foncé sur fond jaune clair est beaucoup plus facile à voir et à lire.

Les couleurs à contraste élevé fonctionnent mieux lorsque vous placez du texte sur un fond de couleur ou si vous utilisez de petits chemins dans vos illustrations. Khroma est un générateur de palette de couleurs AI qui est livré avec un vérificateur de contraste intégré, l'un des nombreux grands Des outils d'intelligence artificielle pour vous aider dans votre flux de travail de conception graphique.

Un excellent moyen de vérifier le contraste consiste à transformer votre conception en niveaux de gris. Si vous pouvez séparer les couleurs et comprendre le design en noir et gris, cela devrait également bien se traduire dans les couleurs que vous avez choisies.

Taille du texte

En plus des couleurs de texte suffisamment contrastées par rapport aux couleurs d'arrière-plan, votre texte lui-même doit être suffisamment grand pour être lu facilement. Le ratio WCAG pour une grande taille de texte est de 3:1.

La taille du texte n'est pas la même dans toutes les typographies. Ne vous fiez donc pas à une taille de 12 points, qui est généralement considérée comme la taille minimale pour une lisibilité standard, pour toutes les polices. Testez-les vous-même ou avec des testeurs utilisateurs en affichant ou en imprimant des designs en taille réelle. Si vos couleurs ne sont pas très contrastées, un texte plus gros facilitera la lisibilité, comme solution de contournement.

Lisibilité des polices

Cela va sans dire, mais les polices que vous choisissez dans vos conceptions doivent être facilement lisibles. Les polices décoratives, les polices cursives ou les polices dessinées à la main présentent souvent des problèmes de lisibilité. Les groupes de heavy metal sont réputés pour utiliser des polices de caractères intrinsèquement difficiles à lire pour leurs logos de groupe, par exemple.

Vous devriez également envisager le crénage et le suivi lorsque vous utilisez votre texte pour de petits dessins. L'espacement des lettres peut également affecter la lisibilité prévue des mots.

Facteurs d'accessibilité inclusive

Bien que seuls le contraste des couleurs, la taille de la police et la lisibilité du texte dans la conception Web soient pris en compte dans les ratios WCAG, vous devez créer toutes vos conceptions Web et graphiques en gardant à l'esprit l'inclusivité.

Si vous êtes un concepteur Web travaillant avec un programmeur ou un codeur, assurez-vous que vous êtes en utilisant des techniques HTML qui facilitent l'accessibilité du Web. Il y a aussi fonctionnalités d'accessibilité dans Canva pour étendre la portée de vos créations auprès de votre public.

Vous ne devez pas vous arrêter aux exigences minimales pour les ratios WCAG; si vous avez le contrôle sur l'ajout de texte alternatif aux images, de légendes aux fichiers audio ou vidéo, ou même formulation utile du texte pour les hyperliens, qui sont lus à haute voix par les lecteurs d'écran, vous devez aller au-dessus et au-delà. L'inclusion de fonctionnalités d'accessibilité n'exclut aucun public, elle invite simplement plus de personnes.

Concevoir avec le ratio WCAG améliore les conceptions pour tous

Les normes de conception Web proviennent du World Wide Web Consortium, une communauté qui aide aux meilleures pratiques sur le Web. Le consortium a développé les directives d'accessibilité du contenu Web, que les concepteurs de sites Web doivent suivre. Cela fournit une norme de ratio pour les contrôles de visibilité lors de la conception pour le Web.

Le respect de ces directives et normes de ratio signifie que vos conceptions Web peuvent être consultées par plus de personnes.