Miniaturas e daltonismo

Cerca de um homem em cada doze não separa os vermelhos dos verdes, e uma miniatura não lhe dá uma segunda oportunidade: sem texto alternativo, sem hover, sem versão maior. O que a simulação retira é o tom e não o brilho, o que transforma toda a questão num número mensurável.

De quem se fala, e porque a miniatura é o caso difícil

O daltonismo vermelho-verde é o comum: costuma ser indicado em cerca de 8% dos homens e 0,5% das mulheres de origem norte-europeia, em duas formas — deuteranopia, a do verde, e protanopia, a do vermelho. São as duas que simulei. Todo o resto é raro o suficiente para ser uma nota, e tem uma, no fim.

Uma miniatura é o caso difícil porque não há mais nada em que apoiar-se. Um gráfico com legenda de cores tem etiquetas; um site tem texto. Uma miniatura tem uma só imagem de 336 píxeis de largura, ao lado de um título que descreve o vídeo e não a imagem, e se duas das suas áreas deixam de ser distinguíveis o desenho perdeu simplesmente uma fronteira, sem nada que a substitua.

O que muda e o que não muda

É a parte que vale a pena medir primeiro, porque decide tudo o resto. Passei a simulação padrão para dicromatas nas 660 miniaturas dos pacotes desta ferramenta e comparei cada imagem consigo mesma.

O brilho global de uma imagem quase não se move: a variação mediana da luminância relativa média é de 0,59% com deuteranopia e 1,11% com protanopia. O que colapsa é a diferença entre tons. O vermelho puro, rgb(255,0,0), sai como rgb(147,147,0), um amarelo apagado. Um verde forte, rgb(0,200,0), sai como rgb(171,171,30). Esses dois são a mesma cor, e diferem apenas no brilho. O branco continua exactamente branco.

Portanto a forma útil de pensar nisto não é que as cores pioram. É que o eixo do tom é apagado e o eixo do brilho fica intacto. Qualquer separação construída com o tom desapareceu; qualquer separação construída com o brilho fica intocada.

As cores saturadas isoladas podem mover-se em brilho — esse mesmo vermelho puro sobe de 0,213 para 0,271 de luminância relativa com deuteranopia e desce para 0,104 com protanopia. É a imagem no seu conjunto que fica quieta, porque a maior parte de uma fotografia não está completamente saturada.

Como medi

A simulação é a aproximação linear de Viénot, Brettel e Mollon (1999): converter o sRGB para linear, depois para a resposta dos cones LMS, projectar o cone que falta no plano que o dicromata vê, e voltar. É o método padrão por trás da maioria dos simuladores de daltonismo, e a sua fraqueza conhecida é a tritanopia — e é por isso que este guia não afirma nada sobre ela.

Para cada miniatura tomei as duas famílias de tons dominantes — os dois sectores de 30° em doze com a maior fatia ponderada pela saturação, ambos acima de 10% — e medi duas coisas nesse par. A razão de contraste WCAG entre as suas cores médias, que é uma medida de puro brilho, e a distância entre essas duas cores em sRGB antes e depois da simulação.

586 das 660 miniaturas têm dois tons dominantes acima do limiar dos 10%. São essas que os números abaixo descrevem.

Quanto brilho separa duas cores numa miniatura real

A distribuição é o resultado. É a razão de contraste entre as duas cores dominantes da mesma miniatura, nas 586 que têm um par mensurável.

A mediana é 1,57:1. Como referência, as WCAG pedem 4,5:1 para texto de leitura e 3:1 para objectos gráficos — limiares escritos para interfaces e não para fotografias, portanto aqui são uma bitola e não uma regra. Só 2% destas miniaturas atingem o primeiro e 9% o segundo.

O que quer dizer que quatro em dez se apoiam só no tom

267 dos 586 pares — 46% deles, 40% de todas as miniaturas medidas — separam as suas duas cores principais com menos de 1,5:1 de contraste de brilho. O que mantém essas duas áreas separadas, na maior parte não é o brilho, portanto na maior parte é o tom, portanto é a parte que não chega a um dicromata vermelho-verde.

A simulação confirma-o directamente: em todos os pares a distância entre as duas cores cai uma mediana de 9%, e dentro desse grupo de baixo brilho cai 19%. Os pares que partiam com menos contraste de brilho são exactamente os que perdem mais do que tinham.

E é a mesma decisão de desenho que falha por outra razão no tamanho de entrega. Uma fronteira feita de tom e não de brilho é também a fronteira que se dissolve quando o ficheiro é recodificado para 336 píxeis de largura, como medido no guia sobre miniaturas desfocadas. Dois modos de falha, uma causa, uma solução.

O aviso do vermelho sobre verde aponta ao problema errado

O conselho padrão de acessibilidade para o daltonismo é não pôr vermelho ao lado de verde. Medida em miniaturas reais, essa combinação é rara: 13 em 660, 2%, têm uma família vermelha e uma verde como dois tons dominantes.

Quando acontece é grave — esses pares perdem uma mediana de 35% da distância entre si, a pior de todos os grupos aqui, e 10 dos 13 têm também menos de 2:1 de contraste de brilho. Portanto o conselho não está errado. É apenas estreito: descreve 2% das miniaturas, enquanto a versão geral do mesmo problema — dois tons quaisquer separados por quase nenhum brilho — descreve 40%.

E varia muito por nicho

Ordenados pela fatia de pares mensuráveis que se apoiam só no tom. O padrão segue o aspecto que os nichos já têm, medido no guia sobre destacar-se: as filas claras e saturadas têm mais separação só de tom, porque sobra menos intervalo de brilho com que separar algo.

Moda e Beleza e Política estão nos 65% e 62%; Finanças e Saúde e Fitness nos 25% e 30%. Se o seu nicho está na metade de cima desta tabela, é provável que a miniatura cujo aspecto está a ponto de copiar seja uma das que achatam.

A solução é uma para a qual já tem um número

Separe primeiro pelo brilho e trate o tom como um extra. É a mesma conclusão a que chega o guia sobre a cor pelo outro lado — a interface é branca ou quase negra — e é todo o remédio também aqui, porque o brilho é o eixo que a simulação deixa em paz.

O teste barato é a escala de cinzentos. Dessature completamente o seu desenho e veja se as partes ainda se lêem como partes separadas: sujeito contra fundo, texto contra o que está atrás, uma metade de um enquadramento dividido contra a outra. Se sobrevive a isso, sobrevive à dicromacia, porque a escala de cinzentos é o teste mais severo: retira toda a informação de tom, enquanto um dicromata conserva um eixo dela.

O que também significa que o contrário não é prova. Algo que falha em escala de cinzentos pode continuar parcialmente visível para um espectador real com deuteranopia. Passar o teste em cinzentos basta; não passar é um aviso, não um veredicto. O limiar não é nosso: é o rácio de contraste definido pelo critério de contraste mínimo das WCAG, a norma a que o resto da web é sujeito.

O texto é o caso com menos margem

Texto sobre fundo colorido é onde isto se decide mais depressa, porque o texto é fino: um título separado do fundo só pelo tom é ilegível para um dicromata e apenas difícil para todos os outros. Só 2% dos pares medidos atingem o 4,5:1 que se espera do texto de uma interface.

A resposta prática não é uma razão de contraste mas um traço: um contorno ou uma sombra dura numa cor cujo brilho está longe do texto e do fundo, que é o que o guia sobre o tamanho do texto mede para a redução. O mesmo contorno que mantém um título legível a 336 píxeis mantém-no legível sem o tom.

O que este guia não cobre

A tritanopia, a forma azul-amarelo, não é simulada aqui. A aproximação de Viénot é notoriamente pouco fiável para ela, e é rara o suficiente — bem abaixo de 0,1% — para que adivinhar não acrescentasse nada.

O daltonismo total, a monocromacia, é ainda mais raro, e o teste em escala de cinzentos acima é exactamente esse caso: se o seu desenho sobrevive à dessaturação sobrevive também à monocromacia.

E este guia todo fala de tom. A outra questão de acessibilidade de uma miniatura é o tamanho, que não é questão de deficiência nenhuma: todos recebem o seu desenho a 336 píxeis de largura, e os pisos para isso estão nos guias sobre o tamanho do texto e sobre os rostos.

A verificação, num minuto

Duas passagens sobre a mesma imagem. Dessature-a e veja se as partes ainda se separam. Depois volte a pôr a versão a cores num feed real, porque uma miniatura que se separa por dentro pode ainda perder a borda contra a interface, que é outra medição noutro guia.

Essa segunda passagem é para o que serve a ferramenta de pré-visualização: a sua miniatura entre concorrentes reais nos tamanhos realmente desenhados. A primeira é um cursor no programa onde a desenhou, e é a verificação de acessibilidade mais barata que existe neste ofício.

As perguntas que todos fazem

Como faço uma miniatura adequada a daltónicos?

Separe as partes pelo brilho em vez do tom. O daltonismo vermelho-verde retira a diferença de tom e deixa o brilho quase intacto: medido em 660 miniaturas, a variação mediana da luminância global foi de 0,59%.

É mau usar vermelho e verde numa miniatura?

É o pior caso e também um caso raro: 2% das miniaturas medidas têm vermelho e verde como dois tons dominantes, e essas perdem uma mediana de 35% da distância entre si. A versão difundida do problema é qualquer par de tons com quase nenhum contraste de brilho, e é 40%.

O que vê em vez disso um espectador daltónico?

Os dois tons tornam-se o mesmo, em brilhos diferentes. O vermelho puro simula-se em rgb(147,147,0) e um verde forte em rgb(171,171,30): um amarelo apagado nos dois casos, um pouco mais claro do que o outro.

Como posso testar a minha miniatura para o daltonismo?

Dessature-a completamente e verifique se as partes ainda se lêem separadas. A escala de cinzentos é mais severa do que a dicromacia, portanto passá-la basta; não a passar significa que se está a apoiar no tom em algum lugar.

A quantos espectadores isto afecta?

Os números habitualmente citados são cerca de 8% dos homens e 0,5% das mulheres para as formas vermelho-verde. Num canal de qualquer tamanho é um grupo maior do que toda a base de subscritores da maioria dos criadores.

Testar a minha miniatura na ferramenta de pré-visualização →