Notícias

  • O impacto das cores em um site e a importância de contar com uma ferramenta de acessibilidade automatizada

    Crédito da imagem: Reprodução/site Coletivo UX

    Antes de começar a ler este artigo, vamos fazer um teste: você enxerga algum número na imagem acima? Não? Deixa eu te falar uma coisa. Se você não vê o número 74, provavelmente você possui algum tipo de daltonismo. Mas como assim algum tipo? O daltonismo não é uma coisa só?

    Vamos te explicar. O daltonismo é uma deficiência que afeta a percepção e a distinção das cores através da luz. Em alguns casos, dependendo do grau de daltonismo, o usuário não consegue enxergar as cores verde, vermelho e azul. Em outros casos mais raros, nenhuma cor é captada pelo olho humano. Mas vamos detalhar cada um desses tipos para exemplificar melhor:

    • Protanopia: o usuário tem dificuldade de perceber a cor vermelha. O daltônico pode passar a enxergar no lugar do vermelho tons de marrom, verde ou cinza.
    • Deuteranopia: dificuldade para perceber qualquer luz verde;
    • Tritanopia: interfere na visão das cores azul e amarelo. Não se perde a visão total do azul, mas as tonalidades enxergadas são diferentes;
    • Monocromia: ausência da capacidade de diferenciar as cores, resultando na visão em escala de cinza;

    No Brasil, segundo dados da OMS, já são mais de 8 milhões de daltônicos. Sendo assim, os sites precisam ser acessíveis, para que essas pessoas tenham total autonomia para navegar na web e consumir conteúdo online. Já sabemos, então, que utilizar algumas sobreposições de cores podem confundir os usuários daltônicos. Mas será que é só nisso que as empresas precisam estar atentas? Para responder a essa pergunta, separamos, abaixo, algumas boas práticas para implementar no seu website para melhorar a visibilidade de pessoas com daltonismo:

    Não use cores para sinalizar informações importantes

    Há inúmeras formas de destacar conteúdos importantes. Você pode utilizar ícones, texto e até mesmo texturas. Trabalhar apenas com cores pode confundir os daltônicos no momento que eles forem consumir alguma informação.

    Links devem ter cara de links. Mas o que isso significa?

    Utilizar um texto sublinhado e em negrito é a melhor forma de representar um link. Não os diferencie por cores. O mesmo funciona também para formulários. A validação dos campos de formulários geralmente segue o modelo de verde para sucesso e vermelho para erro. Isso, para os daltônicos, é um elemento visual que prejudica o entendimento, já que são cores que eles não diferenciam.

    Utilize o contraste na medida certa e mais saturação

    Garanta um bom contraste entre cores e elementos, proporcionando uma boa leitura aos usuários. Mas como? Deixe as cores escuras mais escuras e as claras mais claras. Mas cuidado para não usar também o máximo de contraste possível, pois usá-lo pode atrapalhar o entendimento da informação de pessoas disléxicas. Vamos garantir a acessibilidade para todos! O ideal, portanto, é trabalhar com um contraste mínimo de 1:4.5 (ou 1:3 para textos maiores), segundo informações do W3C.

    Se for possível, aumente também a saturação, o brilho e a matiz das cores, para torná-las facilmente identificáveis com as cores ao redor.

    Faça uso da descrição em imagens e gráficos

    Muitas vezes, a imagem é a mensagem principal a ser transmitida e precisa ser completamente compreendida. Por isso, quando for postar fotos, descreva as cores que aparecem, para que fique fácil de fazer a distinção. Isso é muito útil para pessoas que vendem produtos na internet. Mas também é importante fazer essa distinção das cores em gráficos. Sendo assim, é recomendado que cada segmento do gráfico conte com uma descrição.

    Atenção na hora de escrever conteúdos em texto

    Quando pensamos nos usuários daltônicos, logo vem à nossa cabeça as cores. Mas há outras barreiras que podem fazer com que esses usuários não consigam acessar facilmente as informações. Uma delas está relacionada à formatação dos textos.

    Em muitos casos, a fonte escolhida ou a maneira de destacar uma informação podem tornar o conteúdo confuso. Sendo assim, leve em consideração o tamanho dos elementos e a fonte. E como falamos anteriormente, quando for destacar uma informação, não faça isso apenas por meio da mudança de cor. Sublinhe a frase ou mude a textura.

    Contrate a ferramenta EqualWeb

    Com tantas alterações a serem feitas, muitas empresas ainda encontram dificuldades na hora de desenvolver um site aplicando essas boas práticas sem que o layout fique feio ou sem se distanciar muito da estética e dos valores da marca.

    Além do layout, as marcas ficam imaginando também todo o trabalho e tempo necessário para poder contratar um profissional especializado para modificar o website. Ou, no caso de não haver um profissional, fazer uma pesquisa das ferramentas e plugins que fazem essas alterações.

    Mas não se preocupe. Nós temos a solução para isso. Porque não contar com uma ferramenta digital que modifica essas questões automaticamente? Pois é. A EqualWeb faz isso pelo seu site. Basta que o usuário clique na opção que deseja e o recurso será ativado. Com os recursos ativados, o seu site estará adaptado para o usuário. Contar com uma ferramenta automática como a EqualWeb pode ser o meio mais fácil e rápido de conseguir tornar o seu site acessível não só para pessoas daltônicas, mas pessoas com qualquer tipo de deficiência. Fale com nossos profissionais!

     

    Referências:

    https://brasil.uxdesign.cc/melhorando-a-experi%C3%AAncia-do-usu%C3%A1rio-dalt%C3%B4nico-3097291d0492

    https://blog.adobe.com/en/publish/2020/09/16/color-choices-that-are-accessible.html#gs.m98hxr

    http://www.acessibilidadelegal.com/13-daltonismo.php

    https://coletivoux.com/dalt%C3%B4nicos-tamb%C3%A9m-s%C3%A3o-usu%C3%A1rios-4f03ca40c30d

    https://brasil.uxdesign.cc/acessibilidade-o-impacto-das-cores-bfc0d60420db

    http://blog.handtalk.me/acessibilidade-daltonicos/


A EqualWeb é uma das soluções líderes globais em acessibilidade digital. Há 8 anos, vem tornando sites e conteúdos digitais acessíveis para pessoas que possuem alguma necessidade ou dificuldade específica para navegar na web.

Selo de Empresa Promotora de Impacto e Amiga da Inclusão DigitalSelo do Certificado de Acessibilidade Digital: LBI CompliantCertificado da ABNT: WCAG 2.1 AA Compliance

São Paulo

Av. Marcos Penteado de Ulhôa Rodrigues 939, 8º andar - Torre I
Ed. Jacarandá
Tamboré, Barueri/SP

E-mail: [email protected]

Rio de Janeiro

Rua Visconde de Pirajá 351, Andar P
Ipanema, Rio de Janeiro/RJ

Telefone: +55 21 99216-5814