Core Web Vitals LCP (Largest Contentful Paint) Süresi Nasıl Düşürülür?

## LCP (Largest Contentful Paint) Hastalığı ve Teşhisi Nedir? Bir makale ya da kampanyalı E-Ticaret anasayfanızı açtığınızı hayal edin. Sayfa yüklenirken devridaim çarkı döner ve beyaz ekranda önce küçük logolar, sonra siyah menü yazılı fontlarınız yüklenir. Tam 4. saniyede ise anasayfanızdaki "Büyük Kara Cuma Kampanyası" dev manşetinin fotoğrafı (Hero Banner / IMG) ekranda koca bir alanı kaplayarak ekrana yansır. İşte sayfa ilk çağırıldığı an ile o ekrandaki **EN BÜYÜK BOYUTLU (Piksel alanı kaplayan) ÖĞENİN (Büyük blok başlıkları veya Hero görsellerinin)** kullanıcının gözünün görebileceği şekilde bitmiş (boyanmış) haline LCP (En Büyük Zengin İçerikli Boyama) süresi denir. Google için kutsal LCP Sınırı **2.5 Saniyenin Altıdır (İYİ - Yeşil Statü)**. Eğer süre 4 saniyeleri geçiyorsa o sayfa "POOR - Zayıf" grubuna hapsedilir ve SEO sıralamalarından kesik atılır. ## LCP Süresini Patlatan 3 Kesin Suçlu ve Reçeteleri ### 1. Suçlu: Hedef Görselin (Hero Image) Hantal veya Geç Yüklenmesi Ekranda en fiyakalı dursun diye eklediğiniz dev afiş eğer Lazy Loading (Yavaşlatılmış Yükleme - `loading="lazy"`) etiketi barındırıyorsa büyük bir trajedi yaşıyorsunuz demektir. Kullanıcı sayfaya ilk girdiğinde en acil gereken o Hero Görsel, tembel yüklemeye bırakılarak geciktiriliyorsa LCP çakılır. **Çözümü:** Sayfanın zirvesinde, (Above the Fold) kullanıcı ilk girdiği (kaydırma yapmadığı alandaki) alan görsellerinde katiyen lazy loading kullanılamaz! Ayrıca o resmi `preload` etiketiyle en can alıcı öncelikle tarayıcıya empoze etmelisiniz (``) ### 2. Suçlu: Uzakta Bekleten (Blocking) Render Süreçleri ve Javascript Devleri Eğer sitenizin ilk açılış saniyelerindeki asıl görünüm (Makale gövdesi) çizilmeden önce tarayıcınız "Google Fonts" yüklemekle uğraşıyorsa, sayfada "Tıklama, izlenme tetikleyici" GTM analiz Javascript kodlarını ve reklam kodlarını okumakla sistemi donduruyorsa ana içeriğiniz o js kodları bitene kadar "Bembeyaz" kalmaya (Blocked) mecburdur. **Çözümü:** Arayüzün çizilmesine kritik seviyede engel (Render-Blocking) oluşturan CSS mimarilerini daraltmak (Critical CSS inlining taktiği) ve sitenin ilk anında hayati yeteneği bulunmayan reklam javasriptlerini "Asenkron (`async`) veya Ertelenen (`defer`)" modlara sokarak CPU kilitlenme zincirini HTML iskeletinin üzerine koymamaktır. ### 3. Suçlu: Ölümcül Server TTFB Hantallığı Sırtınızdaki yük ne kadar hafif olursa olsun (Sayfanız ne kadar temiz ise) sunucunuz yani arkanıza bağlandığınız lokomotif makine (Hosting) o sinyali işleyip vermesi için sizden saliseler değil tam "Saniyeler" çalıyorsa LCP'ye asla yaranamazsınız. **Çözümü:** Mükemmel bir CDN (Content Delivery Network - Cloudflare) ağı inşa etmeli, sisteminizi önbelleklemeli (Caching) ve sunucunuzun barındığı Fiziksel Veri Merkezi kulelerini hedef kitleniz neresiyse "Örn: Türk Okur", gidip "İngiltere" lokasyonu değil "İstanbul, Türkiye" sularında bulunan hostinglerden tahsis etmelisiniz.