Contraste

O Significado

O dicionário define contraste como grau marcante de diferença ou oposição entre coisas da mesma natureza, suscetíveis de comparação. Ou seja, o contraste nada mais é que a diferença entre duas coisas de mesma origem.

Tomando essa definição como base, o contraste aplicado a web é a diferença entre a cor de fundo e a cor da fonte utilizada em determinado elemento.

O problema

Muitas pessoas com algum problema de visão apresentam baixa percepção ao contraste, ou seja, não conseguem, diferenciar a cor de fundo da cor da letra, por exemplo. Apenas para efeito de curiosidade, 1 em cada 12 pessoas não consegue ver a média do espectro completo de cores (aproximadamente 10% dos homens e 0,5% das mulheres).

Tudo tende a parecer com o mesmo brilho, o que torna difícil distinguir contornos, bordas, arestas e detalhes. Uma pessoa com baixa visão ou daltonismo não consegue distinguir texto contra um fundo sem contraste suficiente.

Logo, possuir uma boa taxa de contraste é extremamente importante para o sucesso do seu site.

Recomendações

Use ferramentas para verificar a taxa de contraste de acordo com o que foi definido pela W3C nas Diretrizes de acessibilidade.

Os navegadores mais modernos já possuem uma ferramenta que ajudam analisar a taxa de contraste aplicada a um elemento. Veja abaixo como é exibido no Google Chrome.

A esquerda cor do texto em um fundo claro #f5f7f9 A direita cor do texto em um fundo escuro #333d55

Assim como definido nas Diretrizes de acessibilidade da W3C, o contraste mínimo para textos normais ser de pelo meno 4.5:1, enquanto para texto grandes uma taxa mínima de 3:1.

Reparem que as ferramentas podem indicar uma nota acompanhada de duas ou três letras A. Isso especifica o nível dos requerimentos que a taxa é válida. Uma nota pode ser válida para o nível AA, mas não para o nível AAA.

Você pode saber mais sobre os valores para cada nível clicando aqui e aqui.