O que é o Atributo Alt?
Atributo alt, também chamado de alt text ou texto alternativo, é a descrição em texto que acompanha uma imagem no código HTML. O navegador exibe esse texto quando a imagem falha ao carregar, leitores de tela o leem em voz alta para pessoas com deficiência visual e os buscadores o usam para entender o que a imagem mostra.
O alt text nasceu como recurso de acessibilidade e segue sendo isso em primeiro lugar. No Brasil, a acessibilidade digital é tratada em normas como a Lei Brasileira de Inclusão, e descrever imagens é um dos requisitos mais básicos para um site inclusivo.
Para o SEO on-page, o atributo cumpre um papel direto: o Google enxerga imagens de forma limitada, então o alt text vira a principal pista textual sobre o conteúdo visual. Imagens bem descritas podem ranquear no Google Imagens e trazer tráfego orgânico adicional, principalmente em nichos visuais como moda, decoração, receitas e turismo.
Como funciona na prática?
O atributo é declarado dentro da tag de imagem:
<img src="tenis-corrida-azul.jpg" alt="Tênis de corrida azul com solado branco visto de lado">Para escrever um bom alt text, siga estas orientações:
- Descreva o que a imagem mostra. Imagine explicar a foto por telefone para alguém. Seja específico e objetivo, em geral em uma frase.
- Inclua a palavra-chave quando fizer sentido. Se a imagem realmente mostra o assunto da palavra-chave, inclua o termo de forma natural. Forçar termos que a imagem deixa de mostrar configura excesso de otimização.
- Deixe vazio quando a imagem é decorativa. Ícones e enfeites visuais recebem alt="" para que leitores de tela os ignorem, sem poluir a navegação.
- Evite redundância. Começar com “imagem de” ou “foto de” desperdiça espaço, porque o leitor de tela já anuncia que o elemento é uma imagem.
Alt text vs legenda: qual a diferença?
| Aspecto | Alt text | Legenda |
|---|---|---|
| Visibilidade | Fica no código, invisível na página | Aparece abaixo da imagem para todos |
| Função | Substituir a imagem quando ela não pode ser vista | Complementar ou contextualizar a imagem |
| Público principal | Leitores de tela e buscadores | Todos os leitores da página |
| Obrigatoriedade | Recomendado em toda imagem informativa | Opcional |
Veredito: o alt text descreve a imagem para quem não pode vê-la, enquanto a legenda adiciona contexto visível para todos os leitores.
Exemplos de uso
- Uma loja de móveis descreve cada foto de produto, como “Sofá retrátil de 3 lugares em veludo verde”. As imagens passam a aparecer no Google Imagens para buscas como “sofá veludo verde” e geram visitas à página do produto.
- Um blog de receitas usa alt text descritivo, como “Bolo de cenoura com cobertura de chocolate fatiado em prato branco”. Além de acessível, o conteúdo concorre nas buscas visuais por receitas, onde a SERP exibe blocos de imagens.
Erros comuns
- Deixar o alt gerado automaticamente pelo CMS, como o nome do arquivo “IMG_20260716.jpg”.
- Encher o atributo de palavras-chave repetidas, prática lida como spam.
- Descrever imagens decorativas em vez de usar alt vazio, poluindo a leitura por voz.
- Escrever descrições genéricas como “produto” ou “banner” em imagens informativas.
- Colocar textos importantes só dentro da imagem, sem alternativa em texto real na página.
Perguntas frequentes sobre Alt Text
Alt text ajuda no SEO?
Sim. O alt text é o principal sinal textual que o Google usa para entender uma imagem, junto com o nome do arquivo e o contexto ao redor. Imagens bem descritas podem ranquear no Google Imagens e reforçam a relevância da página para o tema.
Toda imagem precisa de alt text?
Toda imagem informativa precisa. Imagens puramente decorativas, como divisores e enfeites, recebem o atributo vazio, alt="", para que leitores de tela as ignorem. O erro é omitir o atributo por completo, situação em que o leitor de tela pode anunciar o nome do arquivo.
Qual o tamanho ideal de um alt text?
Uma frase objetiva costuma bastar, em geral até cerca de 125 caracteres, limite prático de muitos leitores de tela por bloco de leitura. Se a imagem exige explicação longa, como um gráfico complexo, descreva o essencial no alt e detalhe o restante no texto da página.