Alternativas textuais
Imagens precisam de texto alternativo
- Regra:
image-alt - Gravidade: Crítico
- Nível WCAG A
Por que isso importa
Sem o atributo alt, o leitor de tela recorre ao nome do arquivo: “hero-2024-final-v3.jpg”. O que a imagem comunicava se perde.
Como corrigir
- Descreva o que a imagem transmite naquele contexto, não o que ela mostra em geral.
- Dê alt="" às imagens decorativas para que sejam puladas em vez de anunciadas.
- Quando a imagem está dentro de um link, o texto alternativo precisa dizer para onde o link leva.
- Não comece com “Imagem de” — a função já é anunciada.
Na marcação
<img src="team.jpg"><img src="team.jpg" alt="The support team in the Berlin office">
<img src="divider.svg" alt="">O que a verificação não consegue julgar
A verificação vê se o alt existe, não se ele é útil. “imagem1”, “foto” e o nome do arquivo repetido passam na regra e falham com quem lê.
A exigência por trás disso
Esta regra é uma das formas de falhar nos seguintes critérios de sucesso das WCAG 2.2. O W3C, que publica a norma, explica cada um deles:
- 1.1.1 Conteúdo não textual (abre em nova aba) — Nível WCAG A
Para aprofundar
Deque University sobre image-alt (abre em nova aba)
A Deque mantém o axe-core, o motor de código aberto que o nosso scanner executa. A página deles documenta a regra como o motor a implementa.
Verificações automáticas encontram falhas que o navegador consegue comprovar. Elas não julgam se uma legenda está correta, se um texto alternativo é útil, nem se a página pode ser operada de ponta a ponta pelo teclado — isso exige uma pessoa.