Velocidade
Como Melhorar o LCP do Seu Site: Guia Prático
O que é o LCP, como descobrir qual elemento atrasa o carregamento e as correções que mais reduzem o tempo, das imagens ao servidor.
Resumo Rápido
- O LCP mede quando o maior conteúdo da primeira tela termina de aparecer. Bom é até 2,5 segundos.
- O primeiro passo é descobrir qual elemento é o LCP: quase sempre é a imagem de destaque ou o título principal.
- As correções que mais ajudam são servidor rápido, imagem leve e priorizada, e nada bloqueando a primeira pintura.
O Que É o LCP
O LCP (Largest Contentful Paint) é uma das três Core Web Vitals. Ele marca o momento em que o maior elemento visível na primeira tela termina de aparecer: uma foto de destaque, um banner, um vídeo com imagem de capa ou um bloco grande de texto.
Para o Google, o LCP é bom até 2,5 segundos, precisa melhorar entre 2,5 e 4 segundos e é ruim acima disso, sempre considerando 75% das visitas reais.
Descubra Qual É o Elemento do LCP
Não dá para melhorar sem saber o que medir. O PageSpeed Insights mostra, nos diagnósticos, qual elemento foi o LCP do teste. No Chrome, o painel de desempenho das ferramentas do desenvolvedor também marca o LCP na linha do tempo.
Teste no celular: o elemento do LCP muda com o tamanho da tela. No computador pode ser uma foto lateral; no celular, o título.
As Quatro Partes do Tempo do LCP
O Google divide o tempo do LCP em quatro partes. Saber qual delas pesa mais mostra onde mexer:
| Parte | O que é | Solução típica |
|---|---|---|
| Tempo até o primeiro byte | O servidor demorando a responder | Cache, CDN, hospedagem melhor |
| Atraso para começar a carregar | O navegador descobre a imagem tarde | Imagem no HTML, prioridade alta, sem lazy |
| Tempo de download | A imagem é pesada | WebP ou AVIF, tamanho certo |
| Atraso para pintar | Algo segura a exibição | Menos CSS e JavaScript bloqueando |
As Correções que Mais Ajudam
1. Deixe o servidor responder rápido
Tudo começa quando o HTML chega. Se o servidor leva mais de meio segundo, sobra pouco tempo para o resto. Cache de página, CDN e uma hospedagem adequada resolvem a maior parte dos casos. Veja tempo de resposta do servidor.
2. Nunca adie a imagem do LCP
O carregamento adiado (loading="lazy") é ótimo para imagens abaixo da primeira tela e péssimo para a imagem de destaque. Muitos temas e plugins aplicam lazy em tudo. Tire da imagem do topo e, se possível, dê prioridade alta a ela:
<img src="/fotos/destaque.webp" width="1200" height="675"
alt="Fachada da loja" fetchpriority="high">Mais detalhes em lazy loading.
3. Faça a imagem pesar pouco
Use WebP ou AVIF, no tamanho em que ela aparece, com versões diferentes para celular e computador (srcset). Uma foto de destaque raramente precisa passar de 150 KB no celular. Veja imagens em WebP e AVIF.
4. Coloque a imagem no HTML
Imagem de fundo definida no CSS, ou inserida por JavaScript, só é descoberta depois que esses arquivos carregam. Sempre que puder, use uma tag <img> no HTML. Se precisar manter a imagem no CSS, um <link rel="preload"> avisa o navegador mais cedo.
5. Tire o que bloqueia a primeira pintura
Arquivos CSS grandes e scripts no topo da página seguram a exibição. Reduza o CSS sem uso, adie os scripts que não são essenciais e evite fontes baixadas que escondem o texto até carregar.
6. Evite carrossel no topo
Sliders e carrosséis costumam montar o banner por JavaScript, carregar várias imagens grandes de uma vez e mudar de slide durante o carregamento. Uma imagem fixa e leve no topo quase sempre tem LCP melhor e converte igual ou mais.
LCP no WordPress e nas Lojas
- Desative o lazy da imagem de destaque nas configurações do plugin de cache ou de otimização. A maioria tem a opção de excluir as primeiras imagens.
- Troque sliders do topo por uma imagem fixa.
- Nas lojas, cuide do tamanho do banner principal que você envia: a plataforma redimensiona, mas um arquivo enorme ainda pesa.
Laboratório e Campo
A melhoria aparece na hora no PageSpeed Insights, mas o relatório do Search Console usa visitas reais dos últimos 28 dias. Espere algumas semanas para ver o resultado lá.
Perguntas Frequentes
O LCP do meu site é um texto. Como melhorar?
Com o LCP em texto, o que pesa é o servidor, o CSS e as fontes. Responda rápido, reduza o CSS que bloqueia a pintura e use a fonte do sistema ou fontes com exibição imediata.
Pré-carregar todas as imagens ajuda?
Não. Pré-carregar muita coisa faz tudo competir pela rede. Priorize só a imagem do LCP.
Por que o LCP muda tanto entre testes?
Rede, servidor e scripts de terceiros variam. Rode o teste algumas vezes e compare a mediana. Veja como testar a velocidade do site.
Equipe IndexaJá
Escrito pela equipe do IndexaJá, que audita e otimiza sites para o Google com a meta de 100 em todo site. Publicado em 21 de outubro de 2026.