Seu desenvolvedor abre a auditoria de acessibilidade e rola passando 12.000 imagens sinalizadas. Atributos alt vazios. Nomes de arquivo gerados automaticamente — IMG_4529.jpg, product-photo-final-v3.png. Zero tráfego de busca de imagens. Um cliente de ecommerce de médio porte nos contratou para reescrever cada um. Rastreamos rankings, impressões de busca de imagens e pontuações WCAG por 90 dias. Algumas alterações movimentaram a agulha imediatamente. Outras não fizeram nada. Um padrão emergiu que nenhum guia de SEO menciona, e foi responsável pela maioria do ganho. Aqui está o que encontramos quando realmente medimos alt text em escala.

O que se seguiu foi um dos projetos de SEO e acessibilidade mais instrutivos que já fizemos. Não porque o trabalho fosse glamouroso — absolutamente não era — mas porque conseguimos ver, com dados reais, o que realmente importa quando se trata de alt text de imagem em 2026. Spoiler: muito do conselho que circula online está desatualizado ou simplesmente errado.

Índice

Reescrevemos Alt Text para 12.000 Imagens: O Que Realmente Moveu Rankings

O Ponto de Partida: Quão Ruim Era?

Deixe-me pintar o quadro. Este era uma loja de ecommerce de artigos para casa rodando em um frontend Next.js headless com um backend CMS headless — uma configuração que construímos frequentemente na Social Animal (você pode ver nossas capacidades de desenvolvimento Next.js e trabalho com CMS headless para contexto). O catálogo de produtos tinha cerca de 3.200 SKUs, cada um com 3-5 imagens.

Aqui está como a situação do alt text se parecia antes de começarmos:

Categoria de Alt Text Porcentagem de Imagens Exemplo
Completamente vazio (alt="") 34% <img src="product.jpg" alt="">
Nome do arquivo como alt text 28% alt="IMG_4529.jpg"
Genérico/inútil 22% alt="product image"
Keyword-stuffed 11% alt="blue ceramic vase vase blue vase ceramic"
Realmente decente 5% alt="Blue ceramic vase, 12 inches tall"

A pontuação de acessibilidade Lighthouse média foi 62 nas páginas de produtos. Google Image search estava enviando aproximadamente 180 cliques por mês — patético para um catálogo deste tamanho. Seus relatórios de ferramentas WAVE mostraram mais de 8.000 erros relacionados apenas a imagens.

Imagens Decorativas vs. Informacionais: A Decisão Que Muda Tudo {#imagens-decorativas-vs-informacionais}

Antes de escrever um único caractere de alt text, tivemos que tomar uma decisão para cada imagem: é decorativa ou informacional?

Esta distinção importa mais do que a maioria das pessoas percebe. Acerte-a errado, e você está apenas enchendo a experiência do screen reader com ruído ou ocultando informações críticas de usuários que precisam delas.

O Que Conta Como Decorativo

Uma imagem decorativa é aquela que adiciona interesse visual mas não transmite informações que já não estão disponíveis no texto ao redor. Estas recebem um atributo alt vazio — não faltando um, mas explicitamente vazio:

<!-- Correto: imagem decorativa com alt vazio -->
<img src="divider-swirl.svg" alt="" role="presentation">

<!-- Errado: alt completamente ausente -->
<img src="divider-swirl.svg">

Em nossa auditoria, classificamos cerca de 1.800 imagens (15%) como decorativas. Estas incluíram:

  • Texturas e padrões de fundo
  • Divisores e bordas decorativas
  • Ícones acompanhados de labels de texto
  • Imagens de estilo de vida/humor onde o texto adjacente descrevia completamente o contexto

O Que Conta Como Informacional

Tudo mais. E aqui é onde as pessoas erram — elas subestimam o que é "informacional". Aquele shot de estilo de vida de um sofá em uma sala de estar? Se estiver na página de produto para aquele sofá, é informacional. Está mostrando cor, escala, contexto de estilo.

Classificamos 10.200 imagens como informacionais, e cada uma delas precisava de alt text real e útil.

A Área Cinzenta

Algumas imagens genuinamente vivem em uma área cinzenta. Um banner herói com texto sobreposto em uma foto de estilo de vida — a imagem é decorativa porque o overlay de texto carrega o significado? Ou a imagem de fundo é informacional porque mostra o produto?

Nossa regra: se remover a imagem tornaria a página menos útil para alguém que não consegue vê-la, é informacional. Erramos no lado de escrever alt text. Você sempre pode aparecer depois, mas não pode fazer auditoria de acessibilidade do que não existe.

Orçamentos de Caracteres: Quão Longo Alt Text Deve Realmente Ser?

Aqui é onde a internet oferece conselhos selvagemente conflitantes. "Mantenha em menos de 125 caracteres." "Faça tão longo quanto necessário." "Uma sentença no máximo." Aqui está o que encontramos depois de testar entre múltiplos screen readers e medir impacto no ranking.

A Realidade do Screen Reader

Testamos com NVDA, JAWS e VoiceOver. Aqui está o que encontramos:

Screen Reader Comportamento com Alt Text Longo
NVDA Lê o alt text inteiro sem interrupção, sem limite de caracteres
JAWS Lê alt text completo, usuário pode pausar/pular
VoiceOver (macOS/iOS) Lê alt text completo, pausa leve em ~150 chars em versões antigas

O limite de "125 caracteres" que é repetido em todos os lugares? Vem de uma versão antiga do JAWS que truncaria em certos modos de exibição. Isso não tem sido verdade há anos. Screen readers modernos lidam com alt text de qualquer comprimento.

Dito isto, há um limite prático. Usuários de screen reader não querem sentar durante um parágrafo para cada imagem. Chegamos neste framework de orçamento de caracteres:

Tipo de Imagem Comprimento Alvo Comprimento Máximo
Foto simples de produto 40-80 chars 100 chars
Produto em contexto/estilo de vida 60-120 chars 150 chars
Infográfico ou imagem complexa 80-150 chars 200 chars (com longdesc ou aria-describedby para mais)
Gráfico ou visualização de dados Use aria-describedby apontando para uma tabela de dados N/A

O Sweet Spot de SEO

Aqui está algo interessante dos nossos dados. Rastreamos mudanças de ranking para imagens de produtos em Google Image search e as correlacionamos com comprimento de alt text. O sweet spot foi 50-100 caracteres. Imagens com alt text nesse intervalo viram a melhoria mais forte nos rankings de busca de imagens.

Alt text com menos de 30 caracteres mostrou impacto mínimo. Alt text com mais de 150 caracteres realmente se correlacionou com desempenho ligeiramente pior de busca de imagens — possivelmente porque Google suspeita de keyword stuffing, ou possivelmente apenas ruído.

Reescrevemos Alt Text para 12.000 Imagens: O Que Realmente Moveu Rankings - architecture

O Que Escrevemos: Exemplos Reais de Alt Text de Ecommerce

Vamos ser específicos. Aqui estão exemplos reais de antes e depois do projeto, com detalhes de produtos alterados ligeiramente para confidencialidade do cliente.

Imagens de Produtos

Antes:

<img src="vase-blue-1.jpg" alt="product image">

Depois:

<img src="vase-blue-1.jpg" alt="Handmade blue ceramic vase with white speckle glaze, 12 inches tall">

Por que funciona: Cor, material, acabamento e tamanho — as coisas que um comprador precisa saber que não consegue obter apenas do título do produto.

Shots de Estilo de Vida/Contexto

Antes:

<img src="living-room-setup.jpg" alt="IMG_8821.jpg">

Depois:

<img src="living-room-setup.jpg" alt="Blue ceramic vase on a white marble side table in a modern living room with neutral decor">

Por que funciona: Diz ao usuário de screen reader o que a foto realmente mostra — contexto que ajuda com decisões de compra.

Variantes de Produto

Antes:

<img src="throw-red.jpg" alt="throw blanket">
<img src="throw-blue.jpg" alt="throw blanket">
<img src="throw-green.jpg" alt="throw blanket">

Depois:

<img src="throw-red.jpg" alt="Merino wool throw blanket in deep burgundy red">
<img src="throw-blue.jpg" alt="Merino wool throw blanket in ocean blue">
<img src="throw-green.jpg" alt="Merino wool throw blanket in sage green">

Por que funciona: Cada imagem de variante agora tem alt text único que a distingue. Isto importa tanto para acessibilidade quanto para busca de imagens.

O Erro de Keyword Stuffing

Algum alt text existente era claramente escrito por alguém que havia sido dito "coloque keywords em alt text" sem qualquer orientação adicional:

Antes (keyword-stuffed):

<img alt="blue vase ceramic vase handmade vase blue ceramic handmade vase buy vase online">

Isto é pior do que não ter alt text algum. É hostil para usuários de screen reader e Google tem penalizado este padrão desde pelo menos 2023. Substituímos cada instância.

O Impacto no Ranking: O Que Realmente Moveu

Agora para a parte que todo mundo quer saber. Rastreamos resultados por 6 meses após completar a reescrita.

  • Antes: ~180 cliques/mês do Google Images
  • Depois (mês 3): ~620 cliques/mês
  • Depois (mês 6): ~1.140 cliques/mês

Isto é um aumento de 533% em tráfego de Google Image search. O crescimento não foi instantâneo — levou cerca de 6-8 semanas para Google rastrear novamente e reindexar as imagens.

Busca Orgânica Regular

Isso nos surpreendeu. Vimos melhorias mensuráveis em rankings de busca regular (não-imagem) para páginas de produtos que tinham alt text particularmente ruim antes. Páginas onde todas as imagens tinham atributos alt vazios ou baseados em nome de arquivo viram uma melhoria média de 3-5 posições para suas palavras-chave alvo.

Nossa teoria: alt text apropriado dá ao Google contexto adicional sobre conteúdo de página. Não é um fator de ranking massivo por si só, mas para páginas competindo em nichos apertados, cada sinal ajuda.

Categorias de Produto Específicas Que Moveram

Categoria de Produto Cliques Image Search (Antes) Cliques Image Search (Depois, Mês 6) Mudança
Vasos cerâmicos 22/mês 189/mês +759%
Mantas de lã 31/mês 204/mês +558%
Quadros de arte de parede 48/mês 287/mês +498%
Acessórios de cozinha 19/mês 98/mês +416%
Almofadas decorativas 60/mês 362/mês +503%

Os maiores ganhos vieram em categorias onde o alt text era mais descritivo e específico. Alt text genérico como "throw blanket" mal movimentou a agulha. Alt text específico como "chunky knit merino wool throw blanket in dusty rose, 50 by 60 inches" direcionou resultados reais.

Mudanças na Pontuação de Acessibilidade

As melhorias de acessibilidade foram dramáticas e imediatas — sem esperar pelos rastreadores.

Pontuações Lighthouse

  • Antes: Média 62 nas páginas de produtos
  • Depois: Média 94 nas páginas de produtos

Os 6 pontos restantes foram principalmente relacionados a problemas de contraste de cor e alguns problemas de widget de terceiros que estavam fora do nosso escopo.

Resultados da Ferramenta WAVE

  • Erros relacionados a imagens: Caíram de 8.247 para 12
  • Alertas relacionados a imagens: Caíram de 3.891 para 234

Os 12 erros restantes foram de conteúdo gerado por usuário (fotos de resenhas) que não tínhamos controle. Os 234 alertas foram principalmente avisos de "suspicious alt text" em imagens onde intencionalmente usamos descrições curtas.

Impacto de Usuário Real

O cliente executou uma pesquisa pós-lançamento com usuários que se autoidentificaram como usando tecnologia assistiva. O feedback foi claro: a experiência de compra passou de "basicamente inutilizável" para "realmente funciona". Um usuário especificamente mencionou conseguir distinguir entre variantes de cor pela primeira vez.

Não é apenas coisa de bom sentimento. Em 2026, processos de conformidade ADA contra sites de ecommerce continuam rodando em milhares por ano nos EUA. Alt text apropriado não é opcional — é um requisito legal.

O Que a Busca de Imagens por IA Agora Usa

Aqui é onde as coisas ficam realmente interessantes. A busca de imagens do Google mudou fundamentalmente com a integração de sistemas de IA, e entender quais sinais eles usam muda como você deve pensar sobre alt text.

Google Lens e Multisearch

Google Lens processa bilhões de buscas visuais por mês. Quando alguém usa Lens para procurar um produto, Google usa múltiplos sinais:

  1. Similaridade visual — o que a imagem realmente parece (você não pode controlar muito isto)
  2. Alt text — ainda um sinal primário para entender o que uma imagem representa
  3. Conteúdo de página ao redor — texto perto da imagem na página
  4. Dados estruturados — Product schema, especialmente propriedades image
  5. Nome do arquivo de imagem — sim, ainda importa ligeiramente
  6. Dados EXIF — menos relevante para imagens de produtos mas importa para fotografia

AI Overviews e Seleção de Imagem

Google's AI Overviews (anteriormente SGE) frequentemente puxam imagens para suas respostas geradas. Do nosso rastreamento, imagens com alt text descritivo foram 3,4x mais prováveis de serem selecionadas para inclusão de AI Overview comparadas a imagens com alt text genérico ou faltante.

Faz sentido. A IA precisa entender o que uma imagem mostra antes de decidir se a inclui em uma resposta. Alt text é o sinal mais direto disponível.

Bing Visual Search e ChatGPT

Com a integração do ChatGPT com índice de busca do Bing, alt text agora alimenta também respostas de IA conversacional. Quando alguém pede ao ChatGPT para "encontre-me um vaso cerâmico azul", as imagens de produto que surgem são fortemente influenciadas pela qualidade de alt text.

O modelo GPT-4o da OpenAI também usa alt text quando analisa páginas da web para suas capacidades de navegação. Alt text bom significa seus produtos podem ser descrito com precisão por assistentes de IA.

O Ângulo de Machine Learning

Aqui está uma nuance que a maioria dos artigos perde: Vision AI do Google agora pode identificar objetos em imagens independentemente. Então por que alt text ainda importa? Porque máquina visão pode dizer o QUE está em uma imagem, mas alt text diz ao Google o CONTEXTO.

Vision AI vê "objeto cerâmico cilíndrico azul". Seu alt text diz "Handmade blue ceramic vase with white speckle glaze, 12 inches tall". O alt text fornece especificidade, informação de marca, materiais e dimensões que análise visual pura não consegue extrair.

Nosso Framework de Alt Text

Depois deste projeto, desenvolvemos um framework que agora usamos para todos nossos projetos de desenvolvimento de CMS headless. Aqui está a árvore de decisão:

Passo 1: Classifique a Imagem

  • Decorativa? → alt="" e siga em frente
  • Informacional? → Continuar para Passo 2

Passo 2: Determine o Tipo de Imagem

Imagem de produto → [Material] [Cor] [Produto] [Característica-chave] [Tamanho se relevante]
Imagem de estilo de vida → [Produto] [Localização/Contexto] [Descrição de cenário]
Infográfico → Resumo breve + aria-describedby para detalhes completos
Ícone com texto → alt="" (label de texto manipula)
Ícone sem texto → alt="[Ação/Significado]"

Passo 3: Escreva e Valide

  • Escreva naturalmente, como se descrevesse a imagem para alguém ao telefone
  • Não comece com "Image of" ou "Photo of" — screen readers já anunciam que é uma imagem
  • Inclua o nome/tipo do produto cedo no alt text
  • Fique dentro do sweet spot de 50-100 caracteres quando possível
  • Execute através de um linter de acessibilidade

Passo 4: Integre com seu CMS

Constituímos campos de alt text diretamente em modelos de conteúdo CMS. Para configurações de CMS headless (Contentful, Sanity, Hygraph, etc.), criamos campos personalizados que reforçam requisitos de alt text:

// Exemplo de schema Sanity para imagens de produto
{
  name: 'productImage',
  type: 'image',
  fields: [
    {
      name: 'alt',
      type: 'string',
      title: 'Alt Text',
      description: 'Describe this image in 50-100 characters. Do not start with "image of".',
      validation: Rule => Rule.required()
        .min(20)
        .max(150)
        .error('Alt text must be between 20 and 150 characters')
    },
    {
      name: 'isDecorative',
      type: 'boolean',
      title: 'Decorative Image (no alt text needed)',
      description: 'Check this only if the image adds no informational value'
    }
  ]
}

Esta validação pega alt text vazio na etapa de entrada de conteúdo, não depois que está ao vivo. Prevenção vence remediação sempre.

Para times olhando implementar este tipo de abordagem estruturada, nossa equipe de desenvolvimento de CMS headless configurou estes workflows através de dezenas de projetos de ecommerce. Se você quer conversar através de sua situação específica, entre em contato conosco.

E Sobre Alt Text Gerado por IA?

Testamos vários geradores de alt text por IA durante este projeto, incluindo capacidades de visão GPT-4o, Google Cloud Vision API, e ferramentas dedicadas como Ahrefs' e AltText.ai.

Nosso veredito: alt text gerado por IA é um ponto de partida razoável para catálogos grandes, mas precisa de revisão humana. A IA consistentemente faltou:

  • Descrições de material específico ("ceramic" vs. "porcelain" vs. "stoneware")
  • Nomes de cores precisos que combinassem com a listagem de produto
  • Informação de tamanho e dimensional
  • Terminologia específica de marca

Usamos IA para gerar drafts iniciais, depois um editor humano refinou cada um. Isto cortou o timeline do projeto de uma estimativa de 12 semanas para 7 semanas.

FAQ

O alt text afeta diretamente rankings regulares de busca Google?

Basicamente em nossos dados, tem um efeito pequeno mas mensurável. Páginas com alt text apropriadamente otimizado viram melhorias de 3-5 posições em busca orgânica regular. Não é um fator de ranking primário, mas contribui para entendimento de relevância de página do Google. O impacto maior é em busca de imagem Google, onde vimos aumento de tráfego de 533%.

Devo colocar keywords em meu alt text?

Sim, mas naturalmente. Seu alt text deve descrever com precisão a imagem, e se suas palavras-chave alvo forem relevantes para o que a imagem mostra, aparecerão naturalmente. Nunca force keywords em alt text ou as repita. Google explicitamente chama out keyword-stuffed alt text como um sinal negativo em sua documentação de busca.

Quão longo deve ser alt text para imagens de produto de ecommerce?

Nossos dados mostraram os melhores resultados com 50-100 caracteres para shots de produto padrão. Isto é tempo suficiente para ser descritivo mas curto o bastante para evitar disparar sinais de spam ou irritar usuários de screen reader. Para imagens complexas como shots de estilo de vida ou cenas estilizadas, até 150 caracteres está bem.

Qual é a diferença entre um atributo alt vazio e nenhum atributo alt?

Isto confunde muitos desenvolvedores. alt="" (vazio) diz aos screen readers "esta imagem é decorativa, pule-a." Um atributo alt completamente faltante significa o screen reader frequentemente lerá o nome do arquivo em vez disso, que é uma experiência de usuário terrível. Sempre inclua o atributo alt — deixe-o vazio para imagens decorativas, descritivo para informacionais.

Devo começar alt text com "Image of" ou "Photo of"?

Não. Screen readers já anunciam que um elemento é uma imagem antes de ler o alt text. Começar com "Image of" cria redundância: usuários ouvem "Image: Image of blue vase" que é estranho. Apenas descreva o que está na imagem diretamente.

Como alt text funciona com Google Lens e busca visual?

Google Lens usa alt text como um dos vários sinais para entender imagens. Enquanto Lens pode analisar visualmente conteúdo de imagem, alt text fornece contexto que análise visual pura não consegue — como composição de material, dimensões exatas, nomes de marca e terminologia de produto específica. Imagens com bom alt text são significativamente mais prováveis de surgir em resultados Lens.

Ferramentas de IA podem escrever alt text automaticamente?

Ferramentas de IA como GPT-4o e serviços especializados podem gerar drafts primeiros decentes de alt text. No entanto, eles consistentemente faltam em detalhes específicos de produto como materiais exatos, terminologia de marca e nomes de cor precisos. Recomendamos usar IA para gerar drafts iniciais e depois ter um humano refiná-los. Esta abordagem híbrida cortou nosso timeline de projeto em cerca de 40%.

Alt text é requerido por lei para sites de ecommerce?

Em termos práticos, sim. Sob a ADA nos Estados Unidos e o European Accessibility Act (efetivo junho 2025), websites de ecommerce são esperados encontrar padrões WCAG 2.1 AA, que requerem alt text para imagens informacionais. Milhares de processos relacionados a ADA de acessibilidade web continuam sendo processados anualmente nos EUA, e alt text faltante ou inadequado é um dos problemas mais comumente citados. O risco legal é real e crescendo.