SEO de imagens é o conjunto de otimizações que faz as imagens das suas páginas serem bem compreendidas pelos mecanismos de busca e carregarem rapidamente. Do nome do arquivo ao texto alternativo, passando por formatos modernos como WebP e AVIF e pelo carregamento preguiçoso (lazy loading), cada detalhe influencia o tráfego vindo do Google Imagens e a velocidade geral da página. Neste guia, explicamos o SEO de imagens etapa por etapa, com exemplos em cada uma.
Por que o SEO de imagens é importante?
As imagens têm dois efeitos distintos. O primeiro é a visibilidade: o Google Imagens e as caixas de imagem nas buscas comuns são um canal separado que pode trazer visitantes; especialmente em temas como produtos, receitas, espaços e decoração, o usuário olha primeiro para a imagem. O segundo é a velocidade: na maioria das páginas, as imagens representam a maior parte do peso total, e o maior elemento da página costuma ser uma imagem. Ou seja, uma única imagem de destaque não otimizada pode piorar o LCP e reduzir o desempenho da página inteira.
Um terceiro efeito é a acessibilidade: o texto alternativo descreve a imagem para usuários que usam leitores de tela. Um bom texto alternativo atende tanto ao usuário quanto ao mecanismo de busca.
Nome do arquivo
O Google também usa o nome do arquivo para entender do que trata a imagem. Nomes como IMG_20260412_0043.jpg, gerados pela câmera, não
transmitem nenhuma informação. As regras são simples:
- Use palavras curtas e significativas que descrevam a imagem:
deri-kanepe-gri-uc-kisilik.webp. - Separe as palavras com hífen (-); o sublinhado (_) pode fazer o Google entender as palavras como uma só.
- Prefira letras minúsculas e caracteres ASCII; evite acentos e espaços.
- Não encha o nome de palavras-chave:
kanepe-kanepe-ucuz-kanepe.webpnão ajuda.
| Ruim | Bom |
|---|---|
IMG_0043.jpg | gri-deri-kanepe.webp |
Yeni Resim (2).png | istanbul-kadikoy-ofis-girisi.webp |
kanepe_ucuz_kanepe_satilik.jpg | kose-koltuk-takimi.webp |
Como escrever o texto alternativo?
O texto alternativo (atributo alt) descreve o conteúdo da imagem com palavras. Ele aparece no lugar da imagem caso ela não carregue, é lido
por leitores de tela e é usado pelo Google para entender o contexto da imagem.
- Descreva a imagem como ela é. "Barista preparando café na bancada da cozinha" é um bom texto alternativo; não é preciso começar com palavras como "imagem" ou "foto".
- Seja breve. Em geral, menos de 125 caracteres são suficientes.
- Inclua a palavra-chave de forma natural. Se a imagem realmente trata do assunto, a palavra aparece por conta própria; listas forçadas podem ser consideradas spam.
- Em imagens decorativas, deixe o alt vazio (
alt=""), para que leitores de tela não leiam sem necessidade. Não remova o atributo alt por completo. - Transcreva imagens com texto. Se a imagem contém um slogan ou um preço, escreva essa informação no texto alternativo ou no texto da página.
Exemplo: em vez de escrever alt="sofa sofa sofa de canto barato" em uma página de produto, escreva
alt="Sofá de três lugares em tecido cinza, com pés de madeira". A segunda versão ajuda o usuário e também dá ao mecanismo de busca uma informação mais precisa.
Além do texto alternativo, o texto ao redor da imagem, o título e a legenda (caption) também ajudam o Google a entender o contexto. Colocar a imagem ao lado do parágrafo que ela ilustra é muito melhor do que deixá-la em um ponto aleatório no fim da página.
Escolha do formato: JPEG, PNG, WebP, AVIF
| Formato | Ponto forte | Quando usar? |
|---|---|---|
| JPEG | Comum, boa compressão em fotos | Alternativa para sistemas antigos |
| PNG | Sem perda, transparência | Logotipo, captura de tela, gráfico simples |
| WebP | Arquivo bem menor que JPEG/PNG, suporte à transparência | Padrão seguro para a maioria das imagens |
| AVIF | Geralmente arquivo ainda menor que o WebP | Páginas com muitas fotos; o suporte dos navegadores é amplo, mas inclua um formato de reserva |
| SVG | Vetorial, escalável, muito leve | Logotipo, ícone, desenho simples |
Para oferecer vários formatos, use o elemento <picture>: o navegador escolhe o primeiro formato que suporta; se nenhum for suportado,
usa o <img> interno. Assim, quem suporta AVIF recebe AVIF, e quem não suporta recebe WebP ou JPEG.
Tamanho e compressão
O erro mais comum é exibir uma foto de 4000 pixels de largura em uma caixa de 400 pixels. O navegador ainda assim baixa o arquivo inteiro. Aplique estas práticas:
- Redimensione de acordo com o tamanho real de exibição. Para conteúdo de blog, geralmente 800–1200 pixels de largura são suficientes; para telas de alta densidade, disponibilize o dobro do tamanho via
srcset. - Comprima. Em fotos, uma qualidade entre 75 e 85 costuma reduzir bastante o tamanho do arquivo sem perda visível.
- Remova os metadados. Os dados EXIF (localização, dispositivo) são peso extra e um risco à privacidade.
- Defina uma meta. Como regra geral, tente manter as imagens de conteúdo abaixo de algumas centenas de KB; coloque também um limite para as imagens de destaque grandes.
Informe sempre os valores de width e height no HTML. O navegador sabe quanto espaço reservar antes de a imagem carregar, e o conteúdo não desce enquanto a página carrega.
Imagens responsivas: srcset e sizes
Enviar a mesma imagem para um celular de 360 pixels de largura e para um monitor de 1920 pixels é desperdício. Com srcset, você define várias versões em
larguras diferentes; com sizes, informa que parte da tela a imagem ocupa; o navegador escolhe o arquivo mais adequado. Por exemplo, gerar três versões de
480, 800 e 1200 pixels de largura basta para a maioria dos blogs e páginas de produto. No celular, a economia de dados é notável, e isso se reflete diretamente no tempo do LCP.
Onde a imagem deve ficar?
O Google também tira o assunto da imagem do texto ao redor. Por isso, coloque a imagem ao lado do parágrafo que trata do tema dela e adicione uma legenda curta que resuma o assunto. O título da seção onde a imagem está reforça sobre o que ela trata. Em vez de usar imagens de banco de imagens com direitos autorais, prefira fotos originais que você mesmo tirou: uma imagem original transmite confiança ao usuário e o diferencia de sites que repetem as mesmas imagens genéricas.
Carregamento preguiçoso (lazy loading) e CLS
O lazy loading consiste em só carregar as imagens que ficam abaixo da tela quando o usuário se aproxima delas. Nos navegadores modernos, basta um atributo:
<img src="kanepe.webp" alt="Sofá de três lugares em tecido cinza" width="800" height="600" loading="lazy">
- Não aplique lazy loading à imagem que está na primeira tela (acima da dobra). Se a maior imagem da página carregar tarde, o LCP piora. Para essa imagem, você pode usar
fetchpriority="high". - Galerias, listas de produtos e imagens no fim de textos longos são ideais para lazy loading.
- Use sempre junto de
width/height; caso contrário, a imagem carregada desloca o layout. - Use uma tag
<img src>real para que o Google consiga encontrar a imagem; imagens que existem apenas como plano de fundo em CSS podem não ser indexadas na busca de imagens.
Para mais informações sobre métricas de velocidade, veja nosso guia de Core Web Vitals.
Sitemap de imagens e dados estruturados
O Google encontra a maioria das imagens durante o rastreamento normal. Ainda assim, para galerias carregadas por JavaScript ou estruturas complexas, incluir as imagens
no sitemap pode ajudar. No sitemap padrão, cada <url> usa os elementos <image:image> e <image:loc>:
- Adicione o namespace de imagens no início do sitemap.
- Para cada página, liste os endereços das imagens que aparecem nela.
- Envie o sitemap pelo Search Console e verifique se há erros.
- Confirme que o robots.txt não bloqueia as imagens.
Em conteúdos como produtos, receitas ou artigos, incluir o endereço da imagem nos dados estruturados (schema) facilita que o Google use a imagem em resultados enriquecidos. Para aprender a usar o Search Console, veja nosso guia de introdução.
Erros comuns com imagens
- Colocar texto dentro da imagem: escrever informações importantes (preço, endereço, promoção) apenas dentro da imagem impede que o mecanismo de busca e o leitor de tela as vejam.
- Copiar o mesmo texto alternativo em todos os lugares: em uma galeria de produto com cinco imagens, descreva cada uma (frente, lateral, detalhe) separadamente, em vez de repetir o mesmo texto.
- Imagens de destaque muito grandes: um slide de tela cheia às vezes pesa vários MB em vez de algumas centenas de KB; reduza o tamanho antes de tudo e depois reavalie o design.
- Bloquear imagens no robots.txt: uma regra que bloqueia a pasta de imagens faz com que suas imagens nunca apareçam no Google Imagens.
- Links de imagens quebrados: imagens movidas ou excluídas retornam 404; corrija-as com uma verificação regular.
Checklist e medição
- O nome do arquivo é significativo, em ASCII e separado por hífens?
- O texto alternativo descreve a imagem de forma breve e natural?
- As imagens estão em WebP/AVIF ou em formato adequado?
- Nenhum arquivo maior que o tamanho de exibição está sendo carregado?
- As imagens abaixo da primeira tela têm
loading="lazy"? widtheheightestão definidos?- O sitemap de imagens e o robots.txt estão corretos?
Para medir, o PageSpeed Insights mostra diretamente as recomendações "Codificar imagens com eficiência" e "Dimensionar imagens corretamente". No relatório de desempenho do Search Console, selecione o tipo de pesquisa "Imagens" para acompanhar separadamente as impressões e os cliques vindos da busca de imagens. Otimizar imagens também ajuda a reduzir a taxa de rejeição, porque a página carrega mais rápido.
Conclusão
O SEO de imagens não é uma ação isolada, e sim um hábito repetido em cada imagem: um nome de arquivo com sentido, um texto alternativo honesto, o formato e o tamanho corretos, lazy loading para o que fica abaixo da tela e, quando necessário, um sitemap de imagens. Os maiores ganhos normalmente vêm das maiores imagens; comece identificando, no PageSpeed Insights, as imagens mais pesadas e trabalhe nelas primeiro. O resultado será mais tráfego vindo do Google Imagens e um site mais rápido. O posicionamento continua sendo definido pelos algoritmos do Google; o seu trabalho é tornar as imagens compreensíveis e leves.