Lazy load é uma técnica que adia o carregamento de imagens e vídeos até o momento em que o usuário rola a página até eles. Sem lazy load, o WordPress carrega todas as imagens da página de uma vez, mesmo as que estão fora da área visível. Com lazy load ativo, apenas as imagens do topo carregam no início, reduzindo o peso inicial da página e melhorando o LCP.

A técnica é simples de ativar, tem impacto direto nas métricas de Core Web Vitals e está disponível em plugins gratuitos. Este tutorial mostra como ativar corretamente, quais configurações fazem diferença e o que evitar para não quebrar imagens importantes.

---

O que é lazy load e como funciona no WordPress

Lazy load funciona adicionando o atributo loading="lazy" nas tags de imagem do HTML. O navegador moderno interpreta esse atributo e só baixa a imagem quando ela está próxima de entrar na área visível da tela.

O WordPress adicionou suporte nativo a lazy load na versão 5.5, lançada em 2020. Isso significa que imagens inseridas pelo editor do WordPress já recebem o atributo automaticamente em instalações atualizadas, sem precisar de plugin.

O que os plugins de lazy load fazem além do nativo é cobrir casos que o WordPress não trata por padrão: imagens inseridas via shortcode, imagens em widgets, thumbnails de posts, iframes de vídeos do YouTube e Vimeo, e imagens carregadas por temas via CSS background.

Para sites simples com imagens apenas no editor, o lazy load nativo do WordPress já resolve. Para sites com thumbnails em listagens de posts, vídeos incorporados ou imagens em widgets, um plugin complementa o nativo.

---

Como verificar se o lazy load já está ativo

Antes de instalar qualquer plugin, verifique se o lazy load nativo está funcionando.

Abra uma página do site, clique com o botão direito em uma imagem e escolha “Inspecionar”. No código HTML, a tag da imagem deve ter loading="lazy". Se tiver, o nativo está ativo.

Outra forma é usar o PageSpeed Insights. Na seção de oportunidades, se aparecer “Adiar imagens fora da tela” com muitas imagens listadas, o lazy load não está cobrindo todas as imagens do site.

---

Ativar lazy load com WP Rocket

O WP Rocket tem implementação própria de lazy load que cobre mais casos que o nativo do WordPress.

Configuração no WP Rocket

Em Media, ativar as opções de lazy load para imagens, iframes e vídeos. O WP Rocket substitui o atributo src das imagens por data-lazy-src e carrega via JavaScript quando necessário, o que permite mais controle sobre o comportamento.

A opção de lazy load para iframes e vídeos é especialmente útil. Vídeos do YouTube incorporados carregam uma miniatura pesada por padrão. Com lazy load de iframe ativo, o WP Rocket substitui o iframe por uma imagem de preview até o usuário clicar para reproduzir. Em páginas com vários vídeos, isso pode reduzir o peso inicial em vários MB.

Excluir imagens do lazy load

Algumas imagens não devem ter lazy load. A imagem hero do topo da página, que é normalmente o elemento de LCP, não deve ter lazy load porque precisa carregar o mais rápido possível. Atrasar o LCP prejudica a nota no PageSpeed.

No WP Rocket, em configurações avançadas de lazy load, é possível excluir classes CSS ou seletores específicos. A imagem hero do tema geralmente tem uma classe específica que pode ser usada como exclusão.

---

Ativar lazy load com LiteSpeed Cache

O LiteSpeed Cache tem configuração de lazy load em Otimização de Imagem.

Configuração no LiteSpeed Cache

Ativar lazy load de imagens e iframes. O comportamento é similar ao WP Rocket: atrasa o carregamento de elementos fora da área visível.

Uma vantagem do LiteSpeed Cache é que em servidores LiteSpeed o lazy load funciona em nível de servidor, sem depender de JavaScript do navegador. Isso é mais robusto para usuários com JavaScript desativado, embora esse cenário seja raro.

O LiteSpeed Cache também permite configurar o placeholder exibido enquanto a imagem carrega. Usar um placeholder de cor sólida correspondente à paleta do site evita o efeito visual de imagem piscando durante o carregamento.

---

Ativar lazy load com plugin dedicado

Para quem não usa WP Rocket nem LiteSpeed Cache, o plugin Smush ou BJ Lazy Load são opções gratuitas específicas para lazy load.

O Smush é o mais completo: cobre imagens, thumbnails, iframes e tem opção de excluir imagens específicas. A versão gratuita cobre lazy load sem limitação. A versão Pro adiciona CDN e compressão avançada, mas para lazy load o gratuito resolve.

BJ Lazy Load é mais leve e direto. Faz o lazy load de imagens e iframes sem configuração extra. Boa opção para quem quer ativar a função sem instalar um plugin de performance completo.

---

O que não colocar em lazy load

Lazy load aplicado nas imagens erradas prejudica o LCP e pode piorar a nota no PageSpeed.

A imagem principal do topo da página nunca deve ter lazy load. Essa imagem é carregada dentro da área visível desde o início e é frequentemente o elemento de LCP. Atrasar o carregamento dela aumenta o LCP diretamente.

Logotipo no cabeçalho também não deve ter lazy load. É pequeno e carrega no início de qualquer forma, mas o atributo loading="lazy" pode criar um atraso desnecessário em alguns navegadores.

Imagens em banners de destaque acima da dobra (a área visível sem scroll) não devem ter lazy load pelos mesmos motivos.

A regra prática: qualquer imagem visível sem scroll no carregamento inicial não deve ter lazy load. Tudo abaixo da dobra pode ter.

---

Lazy load e CLS

Lazy load mal implementado pode causar CLS alto. Quando uma imagem carrega sem dimensões definidas, ela empurra o conteúdo abaixo dela para baixo ao aparecer, gerando CLS.

A solução é garantir que todas as imagens com lazy load tenham atributos width e height definidos no HTML. Com dimensões definidas, o navegador reserva o espaço correto antes de a imagem carregar, sem mover o conteúdo.

O WordPress 5.5 em diante adiciona dimensões automaticamente nas imagens inseridas pelo editor. O problema aparece em imagens carregadas por temas via funções PHP customizadas ou em plugins que inserem imagens sem os atributos de dimensão.

A gente vê no suporte da FULL sites com boa nota de LCP mas CLS alto justamente por causa de lazy load sem dimensões. O PageSpeed Insights aponta os elementos específicos que estão causando o CLS, facilitando o diagnóstico.

---

Lazy load para vídeos do YouTube

Vídeos do YouTube incorporados via iframe carregam scripts e recursos externos pesados que impactam o LCP mesmo quando o vídeo está fora da área visível.

A implementação mais eficiente é o “facade de vídeo”: em vez de incorporar o iframe diretamente, exibir apenas uma imagem de preview com um botão de play. O iframe só carrega quando o usuário clica para assistir.

O WP Rocket faz isso automaticamente quando lazy load de iframe está ativo. Para quem usa outros plugins, o plugin WP YouTube Lyte implementa o mesmo comportamento gratuitamente.

Em páginas com três ou mais vídeos do YouTube incorporados sem facade, o peso inicial pode ser reduzido em 500 KB a 1 MB com essa técnica.

---

Resultado esperado por tipo de site

Tipo de site	Impacto do lazy load	O que cobre
Blog com imagens por post	Alto	Imagens do feed e posts
E-commerce com catálogo	Muito alto	Thumbnails de produtos
Portfólio fotográfico	Muito alto	Galeria de imagens
Site institucional simples	Médio	Imagens de seções
Landing page com vídeo	Alto	Facade de vídeo YouTube

---

Lazy load e o plano PRO da FULL

O plano PRO da FULL inclui WP Rocket, que tem implementação completa de lazy load para imagens, iframes e vídeos com exclusão por seletor CSS. Também inclui Imagify para compressão e conversão WebP das imagens que serão carregadas com lazy load.

As duas ferramentas juntas cobrem o ciclo completo de otimização de imagens: Imagify reduz o peso, WP Rocket adia o carregamento das que estão fora da área visível. Isso impacta diretamente o LCP e o peso total da página.

Por R$849,90 por ano em 10 sites, o custo de R$85 por site com WP Rocket e Imagify inclusos é menor que contratar os dois avulsos para um único site.

Ative o WP Rocket com 1 clique no plano PRO FULL: full.services/planos

---

FAQ

Lazy load já vem ativo no WordPress?

Sim, desde a versão 5.5. Imagens inseridas pelo editor recebem o atributo loading="lazy" automaticamente. Plugins de lazy load complementam o nativo para cobrir thumbnails, iframes e imagens inseridas por temas.

Lazy load melhora o SEO?

Indiretamente. Lazy load melhora o LCP ao reduzir o peso inicial da página, e LCP é fator de ranqueamento do Google desde 2021. Não é um fator direto de SEO, mas impacta as métricas de Core Web Vitals que o Google usa.

Lazy load pode quebrar imagens?

Sim, se aplicado na imagem errada ou em navegadores muito antigos. A imagem hero do topo não deve ter lazy load. Em navegadores modernos o suporte é universal. Para navegadores antigos, os plugins de lazy load têm fallback automático.

Como excluir a imagem hero do lazy load?

No WP Rocket, em configurações avançadas de lazy load, inserir a classe CSS da imagem hero no campo de exclusões. No WordPress nativo, adicionar loading="eager" na tag da imagem via functions.php ou editando o template do tema.

Lazy load funciona com imagens de background CSS?

O lazy load nativo do WordPress não cobre imagens de background CSS. Alguns plugins como Smush Pro e WP Rocket cobrem essa funcionalidade via JavaScript. Para imagens de background críticas acima da dobra, prefira imagens inline com preload em vez de background CSS.

---

Conclusão

Lazy load é uma das otimizações com melhor relação esforço e resultado para sites WordPress. Em sites com muitas imagens, a redução no peso inicial da página é imediata e o impacto no LCP aparece nos testes do PageSpeed Insights logo após a ativação.

O WordPress nativo já faz lazy load das imagens do editor. Para cobrir thumbnails, iframes e vídeos, WP Rocket ou LiteSpeed Cache resolvem sem configuração avançada. O único cuidado necessário é excluir a imagem hero e outras imagens acima da dobra para não prejudicar o LCP.

Para quem quer lazy load integrado com compressão de imagens e CDN no mesmo setup, o plano PRO da FULL inclui WP Rocket e Imagify por R$849,90 por ano em 10 sites, com custo de R$85 por site.

Ative o WP Rocket com 1 clique no plano PRO FULL: full.services/planos