LCP

Eş anlamlılar: Largest Contentful Paint

LCP (Largest Contentful Paint), sayfanın görünen alanındaki en büyük içerik öğesinin (resim, video, text bloğu) render olma süresidir. Google Core Web Vitals metrikidir. İyi skor 2.5s altıdır. SEO ranking'i doğrudan etkiler.

LCP Nedir?

LCP (Largest Contentful Paint — En Büyük İçerik Çizimi), bir web sayfasının yüklenmesi sırasında kullanıcının görünen alanında (viewport) en büyük içerik öğesinin render edildiği anı ölçen performans metriğidir. Google'ın Core Web Vitals üçlüsünün ilkidir. Kullanıcıya "sayfa yüklenmiş" hissini veren en önemli görsel faktördür.

LCP'de Hangi Öğeler Sayılır?

  • <img> etiketi
  • SVG içindeki <image>
  • CSS background-image (inline, URL ile yüklenen)
  • <video> poster image
  • Block-level text elemanı (ör. <h1>, büyük paragraf)

Google'ın LCP Hedefleri

  • İyi: 2.5 saniye altı
  • Geliştirilmesi gerek: 2.5-4.0 saniye
  • Kötü: 4.0 saniye üzeri

LCP'yi Yavaşlatan Nedenler

  • Yavaş sunucu yanıtı (yüksek TTFB)
  • Render-blocking JavaScript ve CSS
  • Yavaş kaynak yükleme (büyük resim, eksik CDN)
  • Client-side rendering (CSR)
  • Yanlış sırada yüklenen web font'ları
  • Preload eksikliği
  • Responsive olmayan görsel

LCP İyileştirme Yöntemleri

1. TTFB'yi Düşür

  • Hızlı hosting + LiteSpeed/NGINX
  • CDN entegrasyonu
  • Redis/Memcached cache
  • Server-side rendering (Next.js SSR/ISR)

2. Görsel Optimizasyonu

  • WebP veya AVIF formatı
  • Responsive srcset kullanımı
  • Lazy loading (ama LCP görseli eager!)
  • Image compression (TinyPNG, Squoosh)
  • CDN ile sunma

3. Preload

<link rel="preload" as="image" href="hero.webp" fetchpriority="high">

4. Render-Blocking Kaldır

  • Critical CSS inline
  • Async/defer JavaScript
  • Font-display: swap
  • Gereksiz CSS/JS'yi kaldır

5. fetchpriority="high"

LCP öğesinin öncelikli yüklenmesi için:

<img src="hero.jpg" fetchpriority="high" alt="...">

LCP Ölçme

  • PageSpeed Insights: Lab + field data
  • Chrome DevTools Lighthouse
  • Chrome DevTools Performance
  • Web Vitals Chrome eklentisi
  • Search Console → Core Web Vitals raporu
  • CrUX Dashboard (real user data)

LCP ve SEO

Google Mayıs 2021'den itibaren Core Web Vitals'ı ranking faktörü olarak kullanır. LCP skoru kötü olan siteler mobil arama sonuçlarında geri düşer. Özellikle e-ticaret ve haber siteleri için kritiktir.

LCP Yaygın Hataları

  • LCP görseli lazy-load edilmiş — görünür olana kadar yüklenmez
  • Büyük hero image optimize edilmemiş
  • JavaScript framework LCP'yi geciktiriyor (CSR)
  • Web fontları LCP text'i bloklu render
  • CDN yok, her istek origin'den

MeoHost LCP Optimizasyonu

MeoHost LiteSpeed Enterprise + LSCache + Cloudflare CDN kombinasyonu ile WordPress sitelerinin LCP'si genellikle 1.5-2.2 saniyeye iner. SEO uyumlu performans için hazır altyapı sunulur.

İlgili Terimler