As imagens costumam ser as maiores vilãs da velocidade de um site e, ao mesmo tempo, uma das suas maiores oportunidades de tráfego. Uma foto pesada demais derruba o carregamento e espanta o visitante; uma imagem bem otimizada acelera a página, aparece no Google Imagens e ainda ajuda o seu conteúdo a subir posições.
A boa notícia é que a otimização de imagens para SEO não exige conhecimento avançado. Com um punhado de práticas certas, qualquer pessoa consegue transformar as imagens de vilãs em aliadas. Neste guia, você vai aprender do básico ao avançado: formatos, compressão, alt text, técnicas modernas de carregamento, o passo a passo em cada plataforma e até como lidar com imagens geradas por inteligência artificial.
O que é otimização de imagens para SEO?
Otimização de imagens para SEO é o conjunto de práticas que torna as imagens de um site mais leves, mais rápidas de carregar e mais fáceis de entender pelos buscadores. Ela envolve escolher o formato certo, reduzir o peso dos arquivos, descrever cada imagem corretamente e configurar a forma como elas carregam na página.
Na prática, esse trabalho atua em duas frentes ao mesmo tempo. A primeira é a velocidade: imagens leves fazem a página abrir mais rápido, o que melhora a experiência de quem visita. A segunda é a compreensão: como o Google não “enxerga” fotos como nós, ele depende de sinais como o nome do arquivo e o texto alternativo para entender o que cada imagem mostra e exibi-la nas buscas certas.
Por que otimizar imagens muda o seu ranqueamento?
Talvez você esteja se perguntando se vale mesmo a pena dedicar tempo a isso. Vale, e por três motivos que se somam.
Velocidade é fator de ranqueamento. O Google prioriza páginas rápidas, e as imagens costumam ser os arquivos mais pesados de um site. Otimizá-las é, quase sempre, o caminho mais curto para ganhar velocidade.
O Google Imagens é um canal de tráfego. Muita gente esquece que a busca por imagens traz visitantes reais, principalmente para e-commerces e conteúdos visuais. Para dar uma dimensão, um levantamento da Semrush apontou que mais da metade das páginas de resultados nos Estados Unidos exibia um bloco de imagens. Quem otimiza aparece nesse espaço; quem ignora fica de fora.
Acessibilidade conta. Descrever as imagens corretamente permite que pessoas com deficiência visual entendam o conteúdo por meio de leitores de tela, e o Google valoriza sites que atendem a todos os públicos.
Somando as três frentes, a otimização de imagens para SEO deixa de ser um detalhe estético e vira parte estratégica de qualquer trabalho de SEO.
Como as imagens afetam os Core Web Vitals (LCP e CLS)?
Aqui entra o ponto técnico mais importante do tema, e que quase ninguém explica direito. Os Core Web Vitals são as métricas que o Google usa para medir a experiência de carregamento de uma página, e as imagens impactam diretamente duas delas.
O LCP (Largest Contentful Paint) mede quanto tempo o maior elemento visível da página demora para aparecer. Na maioria dos sites, esse maior elemento é justamente uma imagem: o banner principal, a foto do produto, a capa do artigo. Se essa imagem é pesada, o LCP dispara e o Google entende que a página é lenta.
Já o CLS (Cumulative Layout Shift) mede o quanto a página “pula” durante o carregamento. Sabe quando você vai clicar em algo e o conteúdo desce de repente? Isso costuma acontecer quando as imagens não têm dimensões definidas no código: a página carrega o texto primeiro e, quando a imagem chega, empurra tudo para baixo.
A tradução prática: comprimir a imagem principal melhora o LCP, e definir a largura e a altura de cada imagem elimina os pulos do CLS. Só esses dois cuidados já colocam o seu site à frente da maioria.
Qual formato de imagem escolher: JPEG, PNG, WebP, SVG e AVIF
Cada formato tem uma vocação, e escolher o certo economiza peso sem sacrificar a aparência.
JPEG: o clássico para fotografias. Bom equilíbrio entre qualidade e peso, mas não suporta fundo transparente.
PNG: ideal quando você precisa de transparência, como logos sobre fundos coloridos. Em compensação, gera arquivos mais pesados que o JPEG.
SVG: perfeito para logotipos, ícones e ilustrações vetoriais. Escala para qualquer tamanho sem perder qualidade e costuma ser levíssimo.
WebP: o formato moderno recomendado para a maioria dos casos. Comprime muito mais que JPEG e PNG mantendo a qualidade, e todos os navegadores atuais o suportam.
AVIF: o mais novo da turma, e um diferencial que quase nenhum guia brasileiro menciona. Ele comprime ainda mais que o WebP, gerando arquivos menores com a mesma qualidade. O suporte dos navegadores já é amplo, o que faz do AVIF uma escolha inteligente para quem quer o máximo de velocidade em 2026.
Regra de bolso: WebP (ou AVIF) para quase tudo, SVG para logos e ícones, JPEG para fotos quando os modernos não forem opção, e PNG só quando a transparência for indispensável.
Como comprimir e redimensionar sem perder qualidade
Escolhido o formato, dois ajustes derrubam o peso dos arquivos sem que ninguém perceba diferença visual.
O primeiro é redimensionar antes de subir. Não faz sentido enviar uma foto de 4000 pixels de largura para um espaço que exibe 800. O navegador vai baixar o arquivo gigante e encolhê-lo, desperdiçando tempo de carregamento. Ajuste a imagem para o tamanho real de exibição antes do upload.
O segundo é a compressão de imagem. Ferramentas de compressão reduzem drasticamente o peso com perda de qualidade imperceptível. Como referência prática, busque manter as imagens comuns abaixo de 100 kb, usando um nível de qualidade entre 75 e 85 na compressão, faixa em que o olho humano quase não nota a diferença. Fotos de destaque podem passar um pouco disso, desde que com moderação.
Existem dois tipos de compressão: a com perdas (lossy), que reduz mais o peso descartando dados invisíveis, e a sem perdas (lossless), que preserva tudo mas economiza menos. Para a web, a compressão com perdas bem calibrada é quase sempre a melhor escolha.
Nome de arquivo descritivo: o detalhe que o Google lê
Antes mesmo de a imagem entrar na página, o Google já lê uma informação sobre ela: o nome do arquivo. E aqui mora um erro silencioso da maioria dos sites.
Um arquivo chamado IMG_20260709_1432.jpg não diz nada ao buscador. Já um chamado tenis-corrida-masculino-azul.jpg descreve exatamente o conteúdo e ainda carrega a palavra-chave. A regra é simples: nomeie cada imagem descrevendo o que ela mostra, com palavras separadas por hífens, sem acentos, sem espaços e sem códigos aleatórios.
Compare na prática: para a foto de uma pizza de calabresa num cardápio online, foto1.jpg é invisível para o Google, enquanto pizza-calabresa-borda-recheada.jpg posiciona a imagem para quem busca exatamente isso. É um ajuste de segundos que trabalha para sempre.
Alt text (texto alternativo) do jeito certo
O alt text é a descrição em texto de uma imagem, inserida no código para dois públicos: os leitores de tela, que o leem em voz alta para pessoas com deficiência visual, e o Google, que o usa para entender o conteúdo da imagem.
Escrever um bom alt text é mais simples do que parece. Descreva o que a imagem mostra, de forma natural e objetiva, como se explicasse a foto para alguém ao telefone. Se a palavra-chave couber naturalmente, inclua; se não couber, não force. Como referência de tamanho, procure ficar em até 125 caracteres, o limite confortável para os leitores de tela.
Um exemplo resolve: para a foto de um dentista atendendo uma criança, um alt text ruim seria “dentista dentista infantil odontopediatria clínica” (puro empilhamento de palavras-chave, que o Google trata como spam). Um bom alt text seria “dentista examina os dentes de uma menina sorridente no consultório”. Descritivo, natural e útil para todos.
Vale a regra geral: toda imagem de conteúdo merece alt text; apenas imagens puramente decorativas (como divisores visuais) podem ficar com o atributo vazio.
Imagens responsivas: srcset, sizes e o elemento picture
Uma mesma imagem não precisa ter o mesmo tamanho no celular e no computador. As imagens responsivas resolvem isso entregando a versão certa para cada tela, e o HTML oferece as ferramentas prontas.
O atributo srcset lista versões da mesma imagem em tamanhos diferentes, e o navegador escolhe a mais adequada:
<img src="produto-800.jpg"
srcset="produto-400.jpg 400w, produto-800.jpg 800w, produto-1200.jpg 1200w"
sizes="(max-width: 600px) 400px, 800px"
alt="tênis de corrida azul em fundo branco">Já o elemento <picture> vai além e permite servir formatos diferentes conforme o suporte do navegador, entregando AVIF ou WebP aos navegadores modernos e JPEG aos demais:
<picture>
<source srcset="produto.avif" type="image/avif">
<source srcset="produto.webp" type="image/webp">
<img src="produto.jpg" alt="tênis de corrida azul em fundo branco">
</picture>Se você usa WordPress ou plataformas semelhantes, respire aliviado: elas geram boa parte disso automaticamente. Ainda assim, entender o mecanismo ajuda a diagnosticar problemas e a cobrar a implementação correta.
Lazy loading e fetchpriority: velocidade sem sacrificar o LCP
Estas duas técnicas modernas formam uma dupla poderosa, e quase nenhum guia as junta.
O lazy loading (carregamento preguiçoso) faz as imagens carregarem apenas quando o visitante rola a página até elas. Assim, a página abre exibindo só o que está visível, muito mais rápido. A implementação é uma linha: loading="lazy" na tag da imagem.
Só que existe uma pegadinha importante: nunca aplique lazy loading nas imagens que aparecem no topo da página, antes de qualquer rolagem. Atrasar o carregamento da imagem principal piora justamente o LCP que você quer melhorar.
Para essa imagem principal, a técnica é a oposta, e aqui entra o diferencial que poucos conhecem: o atributo fetchpriority="high". Ele avisa ao navegador que aquela imagem é prioridade máxima e deve carregar antes de tudo. Na prática: loading="lazy" para as imagens abaixo da dobra, fetchpriority="high" para a imagem de destaque no topo. Essa combinação acelera a percepção de carregamento de ponta a ponta.
Técnicas avançadas: sitemap de imagens, dados estruturados e Open Graph
Para quem quer extrair tudo da otimização de imagens para SEO, três recursos completam o trabalho.
O sitemap de imagens é um arquivo que lista as imagens do site para o Google, ajudando o buscador a descobrir e indexar fotos que ele talvez não encontrasse sozinho, algo valioso para e-commerces com milhares de produtos.
Os dados estruturados (schema) permitem marcar as imagens no código com informações extras, como o tipo ImageObject, aumentando a chance de elas aparecerem em resultados enriquecidos do Google.
Já o Open Graph, através da tag og:image, define qual imagem aparece quando alguém compartilha a sua página no WhatsApp, no Instagram ou em outras redes. Não afeta o ranqueamento diretamente, mas controla a vitrine do seu link nas redes sociais, o que influencia cliques e tráfego.
Como otimizar imagens em cada plataforma (passo a passo)
A teoria é a mesma em todo lugar; muda só o caminho dos cliques. Veja como aplicar nas plataformas mais usadas.
WordPress. Ao enviar uma imagem pela biblioteca de mídia, preencha o campo “texto alternativo” no painel lateral. Plugins como Smush, Imagify ou ShortPixel comprimem e convertem para WebP automaticamente, e o WordPress já gera os tamanhos responsivos sozinho.
Shopify. Na edição de cada produto, clique na imagem e use a opção de editar o texto alternativo. Apps da loja Shopify automatizam a compressão em massa.
Wix. Ao selecionar uma imagem no editor, abra as configurações e preencha o campo de texto alternativo. O Wix converte e serve os formatos otimizados automaticamente.
Webflow. No painel de assets, cada imagem tem seu campo de alt text, e a plataforma oferece conversão para WebP nativa.
Um ponto importante: sites construídos sem cuidado com performance sofrem para corrigir tudo isso depois. Quando o projeto já nasce com a estrutura certa, com uma criação de sites otimizados para SEO, as imagens, os formatos e o carregamento saem ajustados de fábrica, sem retrabalho.
Imagens geradas por IA: como otimizar e evitar problemas
Com ferramentas como Midjourney e DALL·E no dia a dia, uma dúvida nova surgiu: imagens geradas por inteligência artificial precisam de otimização diferente? A resposta curta: as regras técnicas são as mesmas, com dois cuidados extras.
Primeiro, o peso. Geradores de IA costumam entregar arquivos grandes e em alta resolução. Antes de publicar, redimensione e comprima como faria com qualquer foto, convertendo para WebP ou AVIF.
Segundo, a originalidade e o contexto. O Google valoriza conteúdo que demonstra experiência real. Imagens de IA funcionam bem como ilustrações e apoios visuais, mas evite usá-las para simular fotos reais do seu negócio, da equipe ou dos produtos, porque autenticidade é parte da confiança que o buscador avalia. E lembre-se de nomear o arquivo e escrever o alt text descrevendo a imagem normalmente; o fato de ser gerada por IA não muda o que ela mostra.
As melhores ferramentas de otimização de imagens
Você não precisa de software caro para fazer tudo isso. Estas ferramentas resolvem o trabalho:
Comprimir: o TinyPNG é o mais popular, gratuito e comprime em lote; o Squoosh, do próprio Google, dá controle fino da qualidade e converte para WebP e AVIF; o iLoveIMG comprime, redimensiona e converte com interface em português; e o Compressor.io oferece compressão com e sem perdas.
Auditar: o PageSpeed Insights, gratuito e do Google, aponta exatamente quais imagens estão pesando na sua página e o quanto dá para economizar; o Screaming Frog varre o site inteiro e lista imagens sem alt text ou acima do peso ideal; e ferramentas como a Semrush incluem a checagem de imagens nas auditorias gerais do site.
Para o dia a dia de um site pequeno, TinyPNG ou Squoosh na compressão e PageSpeed Insights na conferência já cobrem o essencial.
Como medir se a otimização funcionou
Otimizar sem medir é trabalhar no escuro, e provar o ganho é mais fácil do que parece.
O caminho mais direto é o teste antes e depois no PageSpeed Insights. Rode a análise da página antes de otimizar e anote a nota de performance e o valor do LCP. Depois de comprimir as imagens e aplicar as técnicas deste guia, rode de novo e compare. A melhora costuma ser visível de imediato, tanto na nota quanto no tempo de carregamento.
Para uma visão mais detalhada, a aba Network (Rede) das ferramentas de desenvolvedor do navegador mostra o peso de cada arquivo carregado pela página. Ali você enxerga, imagem por imagem, quantos kilobytes economizou. Por fim, acompanhe no Google Search Console se as impressões vindas do Google Imagens crescem nas semanas seguintes, o sinal de que o buscador está premiando o trabalho.
Checklist final de otimização de imagens
Salve esta lista e passe por ela antes de publicar qualquer página:
- Formato certo escolhido (WebP ou AVIF na maioria dos casos)
- Imagem redimensionada para o tamanho real de exibição
- Arquivo comprimido (referência: abaixo de 100 kb)
- Nome de arquivo descritivo, com hífens e sem códigos
- Alt text natural e descritivo em toda imagem de conteúdo
- Largura e altura definidas no código (evita o CLS)
- Lazy loading nas imagens abaixo da dobra
fetchpriority="high"na imagem principal do topo- Imagem posicionada perto do texto relacionado a ela
- Teste no PageSpeed Insights antes e depois
Deixe suas imagens trabalharem pelo seu ranqueamento
A otimização de imagens para SEO é daqueles trabalhos silenciosos que transformam um site: a página acelera, o Google entende melhor o conteúdo e um novo canal de tráfego se abre no Google Imagens. E o melhor é que boa parte dos ajustes você faz uma vez e colhe para sempre.
Ainda assim, as imagens são apenas uma das dezenas de frentes que definem quem ocupa o topo do Google. Se você quer que cada detalhe do seu site, do conteúdo à velocidade, trabalhe de forma integrada pelo seu negócio, uma estratégia de SEO completo cuida de tudo isso por você. Fale com um especialista da GAM SEO e receba uma análise gratuita do seu site.
