Blog ComercialWeb - São Paulo - SP
E-mail: [email protected]
Home » Programação » SEO
Atualizado: 06/10/2025

Como melhorar o Largest Contentful Paint (LCP) no Lighthouse

Melhorar LCP no Lighthouse

Priorize a imagem LCP

  • Defina width/height ou aspect-ratio para reduzir CLS.
  • Use preload da imagem principal e fetchpriority="high".
  • Comprima em WebP/AVIF e sirva tamanhos adequados (srcset/sizes).
<link rel="preload" as="image" href="/img/hero-1200.webp" imagesrcset="/img/hero-800.webp 800w, /img/hero-1200.webp 1200w" imagesizes="(max-width: 900px) 90vw, 1200px">
<img src="/img/hero-1200.webp" width="1200" height="630" loading="eager" fetchpriority="high" alt="Hero">

Elimine bloqueios e otimize fontes

  • Adie scripts não críticos (defer/async), minimize CSS e use CSS crítico inline.
  • Faça preconnect para CDNs e preload de fontes; use font-display: swap.
<link rel="preconnect" href="https://fonts.gstatic.com" />
<link rel="preload" href="/fonts/Inter-400.woff2" as="font" type="font/woff2" crossorigin>
@font-face{ font-family: Inter; src: url(/fonts/Inter-400.woff2) format('woff2'); font-display: swap; }

Checklist rápido

  • Imagem LCP com preload, fetchpriority e srcset/sizes.
  • CSS crítico inline e scripts com defer.
  • Servir imagens no formato moderno e dimensionadas.
  • Fonts com preload e swap.
Fonte: Redação


Mais Lidos

» Entendendo tudo sobre SEO — um guia detalhado.


» Imagens responsivas com picture, srcset e sizes — HTML5 na prática.