Accessible colors: como ele pode te ajudar em testes de contraste

hd wallpaper, colorful, painting-2468874.jpg

O teste de contraste, talvez seja, um dos mais complexos e problemáticos para realizarmos.

Na WCAG 2.1 no nível AA, temos os critérios 1.4.3 e 1.4.11, que tratam sobre o contraste.

Esses critérios de sucesso norteiam como validar contraste nas aplicações.

Nesse artigo, irei mostrar as vantagens e como usar o Accessible Colors, vamos lá?

conhecendo o accessible colors

Tela do Accessible Colors exibindo o resultado da validação de contraste

O Accessible Colors, assim como, qualquer outra ferramenta que valida contraste necessita de duas cores: do background e foreground.

qual sua vantagem?

  • insira a cor usada no texto, seu tamanho e peso da fonte;
  • insira a cor de fundo;
  • selecione o nível de conformidade, recomendo manter o AA.

Resultados

A ferramenta valida o contraste de acordo com a recomendação da WCAG, caso não esteja em conformidade, exibe duas opções para correção:

  • corrigir a cor do texto;
  • corrigir a de fundo.
Avatar de Bruno Pulis

Junte-se à nossa comunidade de acessibilidade​

Receba dicas, atualizações e recursos sobre acessibilidade diretamente na sua caixa de entrada. Inscreva-se na nossa newsletter agora mesmo e faça a diferença para um mundo mais inclusivo!

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.