Core Web Vitals Nedir? LCP, INP ve CLS ile Site Hızını İyileştirme Rehberi

Bir ziyaretçinin sitenizde kalıp kalmayacağı çoğu zaman ilk birkaç saniyede belli olur. Sayfa geç açılıyorsa, butonlar tıklamaya geç tepki veriyorsa ya da içerik yüklenirken yerinden kayıyorsa kullanıcı geri döner. Google bu deneyimi ölçmek için Core Web Vitals adını verdiği üç metriği kullanır. Bu rehberde her metriğin ne anlama geldiğini, nasıl ölçüldüğünü ve WordPress sitelerde nasıl iyileştirileceğini anlatıyoruz.

Core Web Vitals nedir?

Core Web Vitals, Google’ın gerçek kullanıcı deneyimini ölçmek için belirlediği performans metrikleridir. Yüklenme hızını, etkileşime yanıt süresini ve görsel kararlılığı ölçerler. Bu metrikler Google’ın sayfa deneyimi sinyallerinin bir parçasıdır; tek başına sıralamayı belirlemezler ama benzer kalitedeki içerikler arasında fark yaratabilirler. Daha da önemlisi, doğrudan dönüşüm oranınızı etkilerler.

Üç temel metrik: LCP, INP ve CLS

LCP (Largest Contentful Paint)

LCP, sayfadaki en büyük görünür öğenin (genellikle ana görsel ya da başlık) ekrana ne kadar sürede çizildiğini ölçer. Google’a göre iyi bir LCP değeri 2,5 saniye veya daha azdır.

INP (Interaction to Next Paint)

INP, kullanıcı bir butona tıkladığında ya da bir alana yazdığında sayfanın görsel olarak ne kadar sürede tepki verdiğini ölçer. Mart 2024’te FID metriğinin yerini almıştır. İyi bir INP değeri 200 milisaniye veya daha azdır.

CLS (Cumulative Layout Shift)

CLS, sayfa yüklenirken içeriğin beklenmedik şekilde kaymasını ölçer. Okuduğunuz satırın bir anda aşağı kayması ya da yanlış butona basılması bu sorunun tipik örnekleridir. İyi bir CLS puanı 0,1 veya daha azdır.

Core Web Vitals nasıl ölçülür?

Ölçümde iki tür veri vardır: gerçek kullanıcılardan toplanan saha verisi ve test ortamında üretilen laboratuvar verisi. Google değerlendirmesinde saha verisini ve ziyaretlerin 75. yüzdelik dilimini esas alır.

• PageSpeed Insights: Hem saha hem laboratuvar verisini tek ekranda gösterir.
• Google Search Console: “Core Web Vitals” raporu, sitenizdeki sorunlu URL gruplarını listeler.
• Chrome DevTools ve Lighthouse: Geliştirme sırasında sorunları yerinde bulmak için idealdir.

LCP’yi iyileştirmenin yolları

• Ana görseli WebP veya AVIF formatında, gösterileceği boyuta uygun çözünürlükte sunun.
• İlk ekrandaki görsele fetchpriority="high" verin, onu tembel yüklemeye (lazy load) almayın.
• Sunucu yanıt süresini düşürmek için sayfa önbelleği ve CDN kullanın.
• Kritik olmayan CSS ve JavaScript dosyalarını geciktirin; render’ı engelleyen kaynakları azaltın.

INP’yi iyileştirmenin yolları

• Uzun süren JavaScript görevlerini küçük parçalara bölün.
• Kullanmadığınız eklentileri ve üçüncü taraf betikleri (sohbet, takip, reklam kodları) gözden geçirin.
• Etkileşim sırasında büyük DOM güncellemelerinden kaçının; animasyonlarda transform ve opacity kullanın.

CLS’yi iyileştirmenin yolları

• Tüm görsel ve videolara width ve height değerleri verin.
• Reklam, banner ve gömülü içerikler için önceden alan ayırın.
• Web fontlarında font-display: swap kullanın ve kritik fontları önceden yükleyin.

WordPress için hızlı kontrol listesi

1. Güncel bir PHP sürümü ve kaliteli bir barındırma (hosting) altyapısı kullanın.
2. Bir önbellek eklentisi kurun ve CDN ile birlikte yapılandırın.
3. Görselleri yüklemeden önce sıkıştırın ve modern formatlara dönüştürün.
4. Sayfa oluşturucu kullanıyorsanız gereksiz widget ve animasyonları azaltın.
5. Değişikliklerden sonra PageSpeed Insights ile tekrar ölçün; saha verisinin güncellenmesinin birkaç hafta sürebileceğini unutmayın.

Sonuç

Core Web Vitals, hızı teknik bir detay olmaktan çıkarıp kullanıcı deneyiminin ölçülebilir bir parçası haline getirir. LCP, INP ve CLS’yi düzenli olarak takip ettiğinizde hem ziyaretçileriniz hem de arama motorları farkı hisseder. Sitenizin performans analizini birlikte yapmak isterseniz SEO hizmetlerimize göz atın ya da bizimle iletişime geçin.

Site hızı sorunlarını sizin için çözmemizi isterseniz teknik SEO hizmeti ve web sitesi bakım ve destek sayfalarımıza göz atın. Hızın kullanıcı deneyimiyle ilişkisini UX odaklı SEO yazımızda anlattık.