Alt text: definição, impacto e checklist técnico

O que é alt text?

Alt text, ou texto alternativo, é o conteúdo do atributo HTML alt numa tag de imagem, por exemplo: <img src="produto.jpg" alt="camisola azul de lã, vista frontal">. Serve para descrever a imagem quando o utilizador não a vê — seja por deficiência visual, por bloqueio de imagens no navegador ou por problemas de carregamento — e para fornecer contexto a agentes automatizados como rastreadores e leitores de ecrã.

Por que o alt text importa para SEO

Alt text tem duas funções relevantes para SEO: acessibilidade e contexto de conteúdo. Motores de busca usam o texto disponível (incluindo alt) para compreender o assunto de uma página quando a imagem é uma fonte de informação. Note que isso está ligado a indexação (o que o motor armazena sobre a página) e a sinais visuais, mas não é um determinante isolado da posição no ranking — o ranking resulta de muitos sinais combinados.

Como o alt text funciona

Quando um navegador ou leitor de ecrã encontra uma imagem, procura o atributo alt para fornecer uma descrição. Motores de busca analisam o HTML (crawl), retêm informação relevante na indexação e usam descrições textuais como parte do contexto do documento. Desde julho de 2024, o Google usa o Googlebot Smartphone por defeito ao rastrear sites, por isso a versão móvel — e o alt text nela presente — é a base primária para crawling e indexação.

Tipos de alt text

Existem padrões práticos para diferentes funções de imagem. Use a forma que melhor comunica a utilidade da imagem.

- Imagens informativas — descrevem conteúdos relevantes: alt="mapa do percurso da corrida de 10 km".

- Imagens funcionais (links ou botões) — descrevem a ação: alt="ir para página de checkout".

- Imagens decorativas — devem usar alt vazio para sinalizar que podem ser ignoradas por leitores de ecrã: alt="".

Como começar a escrever alt text

Siga regras práticas: seja conciso, descritivo e focado na função da imagem. Para imagens informativas, descreva o que é essencial para compreender a página. Para imagens funcionais, descreva a ação. Para decorativas, use alt vazio. Evite repetir texto que já aparece perto da imagem (como legendas) e não faça keyword stuffing.

Exemplos rápidos: <img src="capa-livro.jpg" alt="capa do livro ‘Prática de UX’ com ilustração de bússola">; logo decorativo: <img src="logo.png" alt="">.

Erros comuns com alt text

Os deslizes frequentes incluem: usar alt repetitivo ou demasiado genérico ("imagem1"), inserir listas de palavras-chave, deixar alt ausente em imagens funcionais, ou usar alt vazio em imagens que transmitem informação importante. Outro erro é confiar apenas em OCR ou nomes de ficheiros — eles raramente substituem uma descrição humana clara.

Verificação e resolução de problemas: checklist técnico

Use esta checklist prática para confirmar que o alt text está presente e adequado. Formato: **{Check name}** — onde verificar — passa quando {condição}.

- **Atributo alt presente** — verifique no código-fonte ou no painel Elements do Chrome DevTools — passa quando cada imagem informativa/funcional tem um atributo alt não vazio; imagens puramente decorativas usam alt="".

- **Alt corresponde à função** — testar com leitores de ecrã (ex.: NVDA, VoiceOver) ou Chrome DevTools > Accessibility — passa quando a leitura transmite a mesma utilidade que a imagem no contexto.

- **Não há keyword stuffing** — inspeção manual do alt e comparação com texto circundante — passa quando a descrição é natural e não repete palavras-chave sem sentido.

- **Imagens em links têm alt funcional** — ver no HTML e testar navegação por teclado — passa quando o alt descreve para onde/qual ação o clique vai levar.

- **Atualização na versão móvel** — verificar a versão móvel com Google Search Console URL Inspection (para páginas que você possui) e com o painel de dispositivos em DevTools — passa quando a versão móvel contém os mesmos alts relevantes.

Ferramentas e comandos úteis

Inspeção manual: abra o código-fonte (Ctrl+U) ou use Chrome DevTools > Elements para ver <img> e o atributo alt. Para ver o que um agente vê, use um leitor de ecrã (NVDA/VoiceOver) e o painel Accessibility do Chrome DevTools. Para testes automatizados, rode Lighthouse no Chrome DevTools ou a extensão axe para identificar problemas de alt e contraste.

Comandos curl úteis (inspecionar HTML servido a um user-agent): use curl -A "Mozilla/5.0 (Windows NT)" https://exemplo.com/pagina > pagina.html para guardar o HTML completo; use curl -I para ver cabeçalhos HTTP quando investigar problemas de cache ou status.

Se a página for sua, utilize o Google Search Console URL Inspection para ver o snapshot de como o Googlebot Smartphone vê a página e para depurar problemas de indexação relacionados com imagens. Use o Rich Results Test para validar imagens ligadas a dados estruturados (por exemplo, product/recipe).

Como automatizar cobertura de alt text

Para sites com muitas imagens, acompanhe alterações com auditorias periódicas (Lighthouse/axe) e crie regras no CMS que obriguem preenchimento do campo alt durante upload. Integre checagens no processo de revisão editorial e use workflows que bloqueiem publicação quando imagens informativas estiverem sem descrição.

Perguntas frequentes

Leia o Technical SEO Guide

SEO técnico é uma parte do crescimento orgânico. Construir autoridade tópica também depende de backlinks de qualidade; se procura uma solução para gerir aquisições de links, avalie opções de mercado que facilitem contacto com editores e verificação de indexabilidade. Construa autoridade com backlinks qualitativos