Neste artigo
Para conferir o contraste do texto sobre imagens geradas por IA, avalie o fundo que fica diretamente sob as letras em cada layout. Comece pelo recorte mais estreito, onde o título pode quebrar em mais linhas ou cair sobre um ponto claro. Mantenha o texto editável. Mude sua posição, escureça apenas a região necessária ou adicione um fundo sólido. Confira de novo com as palavras e a fonte finais.
Defina uma meta de contraste
Para conteúdo web, a explicação do W3C sobre o nível AA da WCAG 2.2 indica pelo menos 4,5:1 para texto comum e 3:1 para texto que se enquadra como grande. O estilo de título por si só não define isso. Confira o tamanho e o peso exibidos. Um rótulo pequeno abaixo ainda pode exigir 4,5:1. Use o limite como ponto de partida. Uma margem maior pode facilitar a leitura rápida.
Meça o fundo logo atrás das letras
Imagine um banner para uma oficina de cerâmica com um vaso claro à direita e uma parede azul-escura à esquerda. Na tela grande, o título branco fica todo sobre o azul. Em um recorte mais baixo no celular, a imagem muda de posição e a última linha passa sobre uma mancha bege iluminada. A média da imagem não mostraria esse ponto. Em uma prévia no tamanho final, oculte o texto sem tirar a imagem ou a camada de escurecimento. Colha amostras sob as palavras, em especial nos pontos mais claros por trás de letras brancas. No cálculo, use a cor definida para o texto, sem colher pixels suavizados da borda da letra.
Compare o ponto forte e o ponto fraco
Com cores de exemplo, branco sobre azul-escuro #253343 dá cerca de 12,86:1, e branco sobre bege #B9A78E dá 2,34:1. Esses valores ilustrativos não foram retirados da capa. O azul supera o mínimo para texto comum. O bege fica abaixo dos dois limites. Leia a linha toda em seu tamanho final e procure a menor relação onde houver letras. Se o fundo tiver textura ou bordas marcadas, meça vários pontos.
Escolha um ajuste que funcione em vários recortes
Primeiro tente mover o título para uma área estável e deixar espaço para uma tradução mais longa. Se a imagem precisar ocupar todo o layout, um degradê localizado pode escurecer o fundo das palavras sem apagar o vaso. Meça de novo o ponto mais fraco. Se o texto se mover entre cortes ou a imagem trocar com frequência, use um painel sólido ou coloque o texto fora da imagem. Branco sobre #222222 sólido dá cerca de 15,91:1. Como o painel cobre parte da foto, reserve espaço na composição.
Confira o layout de entrega
Veja os layouts mais largo e mais estreito, uma tradução maior e os textos auxiliares que quebram linha abaixo do título. Mantenha o título editável e salve o recorte e o escurecimento com a versão aprovada. Consulte e para o método, para planejar recortes e para outros fluxos de imagem.