SEO de Imagens: 12 Dicas Práticas para Mais Tráfego Orgânico

Muita gente acha que SEO de imagens é só colocar uma palavra-chave no atributo alt. Na prática, existem pelo menos doze fatores que influenciam como o Google encontra, entende e ranqueia as imagens do seu site. Ignorar esses fatores significa perder tráfego que poderia ser facilmente conquistado — inclusive pelo Google Imagens, que responde por uma parcela significativa das buscas globais.

O próprio Google avança com o reconhecimento de imagens por aprendizado de máquina. Mas isso não torna o SEO de imagens obsoleto — ao contrário, o Google continua usando todos os sinais disponíveis (nome do arquivo, alt text, contexto da página, velocidade de carregamento) para interpretar e ranquear imagens com precisão.

1. Nomeie os arquivos de forma descritiva

O nome do arquivo é um dos primeiros sinais que o Google usa para entender o assunto de uma imagem. Câmeras e celulares geram nomes genéricos como IMG_0023.JPG ou DSC_4817.jpg — que não comunicam absolutamente nada ao buscador.

O próprio Google declara em suas diretrizes oficiais que o nome do arquivo é uma pista sobre o conteúdo da imagem. A recomendação é simples: use palavras-chave descritivas, separadas por hífens, sem exagerar:

• Bom: bolo-de-chocolate.jpg
• Ruim: IMG_2947.jpg
• Também ruim: bolo-chocolate-receita-sobremesa-doce.jpg (keyword stuffing)

Renomear imagens antes do upload é um hábito simples que faz diferença — especialmente para e-commerces, blogs de culinária, portfólios e qualquer site que dependa de tráfego via busca de imagens.

2. Escreva textos alternativos (alt text) úteis

O atributo alt descreve uma imagem para o navegador. Ele é exibido quando a imagem não carrega, lido por leitores de tela para pessoas com deficiência visual e usado pelo Google para compreender o conteúdo visual da página.

A sintaxe é simples:

<img src="cachorro-dalmata.jpg" alt="Filhote de dálmata brincando no parque">

O Google usa o alt text junto com algoritmos de visão computacional e o contexto da página para compreender o assunto da imagem. A orientação é criar descrições úteis e ricas em informação, usando palavras-chave de forma contextual — nunca acumulando palavras sem sentido (keyword stuffing).

Um atalho que funciona bem: complete a frase "Esta é uma foto de ___". O resultado da lacuna, ligeiramente ajustado, costuma ser um bom alt text. Exemplos:

• "Esta é uma foto de um cheesecake de chocolate com calda de morango." → alt="Cheesecake de chocolate com calda de morango"
• "Esta é uma foto de um notebook com tela quebrada sobre uma mesa." → alt="Notebook com tela quebrada sobre mesa de escritório"

Para imagens de produto, incluir o número do modelo ou código SKU no alt text pode ajudar a aparecer para buscas técnicas específicas. Não se esqueça também das legendas — o Google extrai informações sobre o assunto da imagem a partir do texto ao redor dela, incluindo legendas visíveis na página.

3. Escolha o formato de arquivo correto

A escolha do formato impacta diretamente o tamanho do arquivo — e, consequentemente, a velocidade de carregamento da página. Os três formatos mais comuns na web são JPG, PNG e WebP, cada um com características distintas:

A regra geral: use JPG para fotografias, PNG para imagens que precisam de fundo transparente e texto nítido, e WebP sempre que possível para a web — o formato oferece compressão superior com qualidade equivalente. Use o Conversor de Imagem do ImageTools para converter entre formatos antes de fazer o upload.

4. Redimensione as imagens para as dimensões reais de exibição

Enviar uma foto de 4000px de largura para um site que exibe imagens em 800px é um desperdício de banda. O navegador baixa a imagem completa e depois descarta os pixels excedentes — o usuário espera mais, sem nenhum ganho visual.

Identifique a largura máxima de exibição das imagens no seu layout (geralmente entre 800px e 1440px, dependendo do tipo de imagem e do site) e redimensione antes de fazer o upload. Para cobrir telas Retina (HiDPI), use o dobro da largura de exibição. Use o Redimensionador de Imagem do ImageTools para ajustar as dimensões com precisão.

5. Comprima as imagens sem perder qualidade visível

Compressão é o processo de reduzir o tamanho do arquivo sem alterar as dimensões da imagem. Para fotos JPG, reduzir a qualidade de 100% para 80% pode diminuir o arquivo em 5 a 10 vezes com diferença imperceptível na tela.

Velocidade de carregamento é um fator de ranqueamento confirmado pelo Google — tanto em desktop quanto em mobile. Imagens são frequentemente o maior componente do peso de uma página web. Comprimir todas as imagens antes do upload é a otimização de SEO técnico com maior retorno por esforço.

Metas práticas de peso por tipo de imagem:

• Banner / hero full-width: abaixo de 200 KB
• Foto de produto ou imagem de blog: 60–150 KB
• Thumbnail ou miniatura: 15–40 KB
• Logo em PNG/WebP: abaixo de 30 KB

Use o Compressor de Imagem do ImageTools para reduzir JPG, PNG e WebP diretamente no navegador — sem enviar para servidores externos.

6. Crie um sitemap de imagens

O sitemap de imagens informa ao Google a existência de imagens que ele pode não descobrir por conta própria — especialmente imagens carregadas via JavaScript ou incorporadas em galerias complexas. Diferente do sitemap comum, o sitemap de imagens pode incluir URLs de outros domínios (como CDNs).

Se o seu site usa WordPress com o plugin Yoast SEO, as imagens já são adicionadas automaticamente ao sitemap. Para sites customizados, o sitemap de imagens pode ser adicionado manualmente seguindo a documentação oficial do Google. As principais tags disponíveis são image:loc (URL da imagem), image:title e image:caption.

7. Use dados estruturados para imagens de produtos

O Google suporta dados estruturados (Schema.org) para imagens em vários contextos — receitas, produtos, artigos, eventos. Quando implementados corretamente, esses dados permitem que as imagens apareçam em resultados enriquecidos (rich results) no Google, com destaque visual adicional que aumenta a taxa de cliques.

Para e-commerces, o markup de produto com imagem é especialmente valioso: produtos com imagem marcada corretamente podem aparecer no Google Shopping e nas fichas de produto no painel de conhecimento do Google.

8. Implemente lazy loading

Lazy loading é a técnica de carregar imagens somente quando elas estão prestes a entrar na área visível da tela, em vez de baixar todas de uma vez no carregamento inicial. Em páginas com muitas imagens (blogs longos, listagens de produtos), o lazy loading pode reduzir o peso inicial da página em 60–80%.

A implementação mais simples é nativa no HTML:

<img src="produto.webp" alt="Tênis azul" loading="lazy">

Importante: nunca aplique loading="lazy" à imagem principal acima do fold (a primeira imagem visível sem rolar a página). Isso atrasa o LCP — Largest Contentful Paint, uma das métricas Core Web Vitals — e prejudica diretamente o ranqueamento.

9. Defina width e height em todas as tags de imagem

Quando o navegador não sabe o tamanho de uma imagem antes de carregá-la, ele não reserva o espaço correto no layout — e quando a imagem carrega, o conteúdo da página "pula". Esse fenômeno é o que o Google mede como CLS (Cumulative Layout Shift), outro Core Web Vital.

A solução é sempre declarar width e height nas tags de imagem:

<img src="produto.webp" alt="Tênis azul" width="800" height="800" loading="lazy">

Os valores não precisam corresponder ao tamanho visual exibido — eles apenas definem a proporção para que o navegador reserve o espaço correto antes de carregar a imagem.

10. Use imagens responsivas com srcset

O atributo srcset permite fornecer versões diferentes de uma mesma imagem para diferentes tamanhos de tela. O navegador escolhe automaticamente a versão mais adequada — servindo uma imagem menor para celulares e maior para desktops. Em sites com muito tráfego mobile, isso pode reduzir o volume de dados transferidos em 40–60%.

<img
  src="produto-800.webp"
  srcset="produto-400.webp 400w,
          produto-800.webp 800w,
          produto-1200.webp 1200w"
  sizes="(max-width: 600px) 400px, 800px"
  alt="Tênis azul"
  width="800" height="800"
  loading="lazy"
>

11. Otimize a imagem de destaque para Open Graph e redes sociais

Quando alguém compartilha uma URL no WhatsApp, Instagram, LinkedIn ou qualquer outra plataforma, a imagem exibida no preview vem das meta tags Open Graph. Se essas tags não estiverem configuradas, a plataforma escolhe qualquer imagem da página — frequentemente com resultado ruim.

Configure sempre a tag og:image com uma imagem de 1200×630px em cada página importante do seu site:

<meta property="og:image" content="https://seusite.com.br/imagens/artigo-preview.jpg">
<meta property="og:image:width" content="1200">
<meta property="og:image:height" content="630">

Uma imagem de preview bem construída — com título legível, identidade visual da marca e imagem relevante — aumenta significativamente a taxa de cliques nos compartilhamentos.

12. Considere o contexto da página inteira

O Google não avalia imagens isoladamente. Ele analisa o conjunto: o texto ao redor da imagem, o título da página, o contexto semântico, os outros elementos visuais, a legenda abaixo da imagem e até mesmo o texto dos links que apontam para a página. Uma imagem de um sapato vermelho numa página sobre moda feminina tem contexto completamente diferente da mesma imagem numa página de culinária.

Boas práticas de contexto:

• Coloque imagens próximas ao texto que as descreve ou ao qual elas se referem
• Use legendas visíveis abaixo das imagens sempre que possível
• Certifique-se de que o assunto da imagem seja relevante para o tema da página
• Use títulos de página e headings que reforcem o assunto das imagens principais

Checklist de SEO de imagens

• ☑ Nome de arquivo descritivo com palavras-chave (hifenizado, sem keyword stuffing)
• ☑ Atributo alt descritivo e contextual em todas as imagens
• ☑ Formato correto para cada tipo: WebP ou JPG para fotos, PNG/SVG para logos e ícones
• ☑ Dimensões ajustadas para o tamanho real de exibição (máx. 2× para Retina)
• ☑ Compressão aplicada — peso abaixo das metas por tipo
• ☑ width e height declarados em todas as tags <img>
• ☑ loading="lazy" em imagens abaixo do fold
• ☑ Imagem LCP sem lazy loading, com fetchpriority="high" se possível
• ☑ Sitemap de imagens configurado (ou verificado se o plugin já faz isso)
• ☑ Meta tag og:image configurada em todas as páginas principais
• ☑ Dados estruturados para imagens de produto onde aplicável
• ☑ Imagens contextualizadas com texto, legendas e headings relevantes

Perguntas frequentes