Por que a gente mede o contraste em vez de confiar no olho
Texto sobre imagem parece legível na tela do designer e some na tela do cliente. A diferença entre "achamos que dá" e "sabemos que dá" é uma conta que leva dois minutos.
Tem uma frase que aparece em toda reunião de aprovação de layout: “acho que dá para ler.”
É uma frase honesta e é uma frase inútil. Quem a diz está olhando para uma tela boa, num escritório com luz controlada, sabendo de antemão o que está escrito ali. Nenhuma dessas três coisas vale para quem vai visitar o site.
O problema de olhar
Legibilidade não é opinião. É uma razão entre a luminosidade do texto e a luminosidade do fundo, e existe um número para ela.
A conta é a mesma que a W3C usa nas diretrizes de acessibilidade: você calcula a luminância relativa das duas cores e divide uma pela outra. O resultado sai como uma proporção — 4,5:1, 7:1, 2,1:1. Quanto maior, mais o texto se descola do fundo.
A referência prática:
- 4,5:1 é o mínimo para texto corrido
- 3:1 é o mínimo para texto grande, de título
- 7:1 é o nível confortável, o que a gente busca
Um texto a 2:1 não é “um pouco difícil”. Ele é ilegível para uma parcela grande de gente — quem tem baixa visão, quem está no sol, quem tem o brilho da tela no mínimo para economizar bateria, quem já passou dos cinquenta. Não é um público de nicho. É a maior parte de quem compra.
Onde isso quebra de verdade
Fundo sólido é fácil: você mede uma vez e acabou.
O problema aparece quando o texto está sobre uma imagem — e é justamente o que todo site bonito faz. Aí o fundo muda a cada centímetro. A mesma frase branca que se destaca sobre a parte escura da foto desaparece quando passa por cima do céu.
Pior: se for vídeo, o fundo muda a cada quadro. O texto que estava perfeito no segundo 3 pode sumir no segundo 8, quando a névoa clareia a cena inteira.
Foi exatamente isso que aconteceu com a gente. Num projeto com texto sobre vídeo, tudo parecia certo enquanto testávamos com um vídeo de rascunho, escuro do começo ao fim. Quando entrou a filmagem real, uma das linhas caiu para 1,9:1 — praticamente invisível — num trecho em que a névoa atravessava o quadro. Ninguém tinha visto. Todo mundo tinha olhado.
O que a gente faz em vez de olhar
Trocamos a pergunta. Em vez de “dá para ler?”, perguntamos “qual é o pior quadro?”.
O processo é simples e é automatizável:
- Extrair os quadros do vídeo, ou os pontos da imagem, onde cada bloco de texto aparece
- Para cada quadro, calcular a cor média da área que fica atrás do texto — não da imagem inteira
- Calcular a razão de contraste entre essa cor e a cor do texto
- Guardar o pior resultado de todos
O pior quadro é o que importa. De nada adianta a média ser 6:1 se existe um segundo e meio em que a frase some — é nesse segundo e meio que alguém vai estar olhando.
Se o pior quadro reprova, a correção não é aumentar a fonte. Costuma ser uma destas:
- Escurecer o fundo atrás do texto com um véu — um gradiente escuro por cima da imagem, só na região do texto
- Clarear o texto, mas isso tem limite: branco puro sobre foto cansa a vista
- Mover o texto para a região que já é escura por natureza
- Trocar o trecho do vídeo, quando nada disso resolve
Por que isso é assunto de cliente, e não só de designer
Porque cada uma dessas decisões custa dinheiro se for descoberta tarde.
Descobrir na medição, antes de aprovar, custa vinte minutos de ajuste. Descobrir depois de o site estar no ar custa uma rodada nova de aprovação, um refazer de arte e, no meio disso, um período em que gente de verdade visitou a página e não conseguiu ler a sua proposta.
E há o custo que ninguém contabiliza: a pessoa que não conseguiu ler não reclama. Ela sai. Você não recebe um e-mail avisando que o seu contraste está em 1,9:1. Você recebe um número de visitas que parece bom e um número de contatos que parece ruim, e passa três meses culpando o tráfego.
O princípio, para além do contraste
Contraste é só o exemplo mais fácil de explicar. O princípio serve para o resto:
Quando existe um número, use o número. Velocidade de carregamento tem número. Tamanho de arquivo tem número. Área de toque de um botão tem número — 44 pixels, e abaixo disso o dedo erra. Taxa de saída tem número.
Opinião é para as coisas que não têm número: se o tom da marca combina, se a foto passa a sensação certa, se o texto soa arrogante. Essas são discussões legítimas e a gente as tem.
O que não faz sentido é discutir por opinião algo que uma conta de dois minutos resolve. Isso não é rigor por rigor — é economia de reunião.