Avançar para o conteúdo
SilktideAjuda

Texto alternativo duplicado

O Silktide encontra imagens vinculadas cujo texto alternativo repete o texto logo ao lado delas. Quando uma imagem e o texto vizinho dizem a mesma coisa, as pessoas que usam um leitor de tela ouvem as mesmas palavras duas vezes.

<!-- Problema: anunciado como "Apple Apple" -->
<a href="/apple">
    <img src="apple.png" alt="Apple">
    Apple
</a>

<!-- Corrigido: alt vazio; apenas o texto nomeia o link -->
<a href="/apple">
    <img src="apple.png" alt="">
    Apple
</a>

Por que isso é importante

O existe para substituir uma imagem para as pessoas que não podem vê-la. Quando as mesmas palavras já aparecem ao lado da imagem, o texto alternativo não acrescenta nada — um anuncia "Apple Apple", o que soa errado e torna a audição mais lenta sem nenhum benefício. Em uma página com vários cards de produtos ou chamadas de notícias, a repetição se torna realmente cansativa.

Uma imagem cujo significado é totalmente transmitido pelo texto adjacente é, na prática, e deve ser marcada como tal.

Como corrigir

  1. Dê à imagem um alt="" vazio para que a a ignore e leia apenas o texto adjacente, como no exemplo acima.
  2. Como alternativa, oculte a imagem com aria-hidden="true" — útil quando o seu insiste em preencher o atributo alt.
  3. Se a imagem e o texto forem dois links separados para o mesmo destino, combine-os primeiro em um único link — consulte Links adjacentes.

Como o Silktide faz a verificação

  1. Encontra todas as imagens que estão dentro de um link.
  2. Lê o texto da imagem para tecnologias assistivas: seu atributo alt ou um aria-label.
  3. Compara-o com o texto visível dos elementos imediatamente anteriores e posteriores à imagem.
  4. Relata a imagem quando os dois textos correspondem exatamente, ignorando maiúsculas e minúsculas.

Solução de problemas

A comparação considera os vizinhos imediatos da imagem, que podem incluir texto localizado logo fora do link. A duplicação ainda é real para uma pessoa que usa um leitor de tela e percorre a página, portanto as mesmas correções se aplicam.

Os textos diferem ligeiramente

Apenas correspondências exatas, ignorando maiúsculas e minúsculas, são relatadas. Quase duplicatas, como "Apple" ao lado de alt="Apple logo", passam nesta verificação, mas considere se o texto alternativo ainda acrescenta algo para quem ouve o conteúdo.

Saiba mais

Última atualização

Esta página foi útil?