Conheça as barreiras de acessibilidade que pessoas daltônicas enfrentam na web e saiba como evitá-las


Arte com foto em tons de preto, branco e cinza de uma plantação de tulipas. No centro da imagem há um grande par de óculos com armação preta e nas lentes é possível ver a imagem das mesmas tulipas só que coloridas em tons de roxo, vermelho, amarelo, laranja e verde.
As diretrizes de acessibilidade digital também ajudam a evitar barreiras para pessoas daltônicas na web. Foto: iStock

Segundo a Organização Mundial da Saúde, há no mundo cerca de 350 milhões de pessoas que não conseguem perceber ou diferenciar algumas cores devido a um distúrbio na visão. Estima-se que haja 8 milhões de brasileiros e brasileiras com essa disfunção.

Estamos falando de daltonismo, também chamado de cegueira cromática. Essa deficiência é muito mais comum entre homens do que em mulheres. Há três tipos de daltonismo: 

  • ACROMÁTICO: é o tipo mais raro e se dá quando a pessoa enxerga tudo em branco, preto e em escalas de cinza.
  • DICROMÁTICO: quando a pessoa não possui um receptor de cor e isso a impede de identificar as cores vermelha, verde ou azul.
  • TRICOMÁTICO: é o tipo mais comum e se dá quando a pessoa tem todos os receptores de cores, mas eles não as identificam bem. As cores mais afetadas, neste caso, são vermelho, verde e azul, incluindo suas diferentes tonalidades.

Pessoas com daltonismo enfrentam barreiras de acessibilidade que vão desde questões do cotidiano, como na escolha de roupas, até em situações mais complexas e tensas, como na triagem no atendimento em pronto socorros feita por cores. Essas barreiras existem em situações nas quais apenas cores são utilizadas para transmitir uma mensagem ou quando o contraste entre elas não é bom o suficiente, fazendo com que alguns elementos simplesmente não sejam percebidos por quem tem esse tipo de deficiência. 

Exemplos de barreiras comuns no ambiente digital e como evitá-las

Cor utilizada como único recurso para enfatizar uma informação.

Quem nunca se deparou com uma orientação assim: “veja em vermelho no mapa os Estados onde há menor número de leitos de UTI disponíveis”? É muito comum encontrarmos no ambiente digital conteúdo baseado apenas em cores para enfatizar alguma informação, seja em texto, gráficos ou mapas.

Portanto, a premissa básica é que haja sempre pelo menos mais uma forma de transmitir a informação que está representada graficamente ou por meio de cores. Num gráfico ou mapa, por exemplo, você deve incluir legenda direta na ilustração, variar os tipos de traços e linhas, incluir texturas, entre outras ações. Você pode conferir neste link outras dicas para tornar seus gráficos, mapas e tabelas mais acessíveis.

Você pode também verificar o resultado aos olhos de quem tem daltonismo inserindo sua ilustração em simuladores gratuitos como o Coblis – Color Blindness Simulator.

Contraste inadequado entre cores de fonte e fundo.

Como percebemos, algumas combinações, como fundo preto e texto em vermelho ou fundo verde e texto azul, podem ser invisíveis para quem não enxerga uma dessas cores. O tamanho da fonte também influencia na percepção da informação e precisa garantir bom contraste com o plano de fundo. Textos pequenos em cinza em fundo branco, por exemplo, podem ser bem difíceis de ler tanto para pessoas daltônicas, como para quem tem baixa visão ou alguma outra disfunção na visão.

Para eliminar esse tipo de barreira, considere fazer testes relacionados à cor do texto versus cor de fundo da página no momento em que você estiver definindo a paleta de cores da sua página ou aplicação. Para isso, você pode utilizar ferramentas que medem esse contraste, como o Accessible Colors, Color Contrast Checker, Colour Contrast Analyser ou Color Accessibility.

Validação de formulários por cores.

Essa é outra barreira encontrada com bastante facilidade no ambiente digital. Há muitos formulários que marcam apenas em vermelho, por exemplo, o campo que ainda precisa ser preenchido. E isso pode ser um transtorno para pessoas que não enxergam essa cor, especialmente se o formulário for bem extenso e com vários campos.

A forma mais simples de resolver isso é usar recursos extras, como informação textual ou realçar a caixa do campo a ser preenchido com linhas mais espessas. Há formulários acessíveis que também incluem ilustrações ao lado do campo vazio, como setas.

Outras alternativas

Existe também um alfabeto de cores chamado ColorAdd, desenvolvido pelo designer português Miguel Neiva para representá-las por meio de símbolos gráficos para permitir que pessoas daltônicas consigam identificá-las. Esse alfabeto tem sido implementado em diversos países e vários segmentos como têxtil, transporte, saúde, materiais de construção, entre outras. No Brasil, por exemplo, o Supremo Tribunal Federal passou a utilizá-lo desde 2018. 

Nas redes sociais, a prática de descrever imagens também na legenda do post é benéfica não só a pessoas que têm baixa visão e algumas deficiências cognitivas, mas também para quem tem daltonismo. Essa é uma prática muito útil especialmente para lojas virtuais, pois essas pessoas conseguirão ter mais autonomia para adquirirem roupas e maquiagens, por exemplo, tendo mais clareza sobre as tonalidades dos produtos.

A conclusão que sempre chegamos é que o fundamental é ter sempre em mente o conceito do desenho universal em qualquer projeto que será desenvolvido. Se for digital, basta seguir as recomendações descritas no documento WCAG – Web Content Accessibility Guidelines (ou em português Diretrizes de Acessibilidade para Conteúdo na Web). Esse guia foi desenvolvido para orientar a construção de sites e aplicações acessíveis pelo W3C, principal organização de padronização da web no mundo. Assim, produtos ou serviços serão acessíveis para todas as pessoas.


Leia também:

Outras novidades