Web Tasarım

Core Web Vitals Rehberi: LCP, INP ve CLS Nasıl İyileştirilir?

Core Web Vitals Rehberi: LCP, INP ve CLS Nasıl İyileştirilir?

Core Web Vitals, Google’ın kullanıcı deneyimini ölçmek için kullandığı üç temel metriktir. Bu değerler gerçek kullanıcı verilerinden hesaplanır ve sayfanızın ziyaretçilerin yüzde 75’i için ne kadar iyi çalıştığını gösterir.

LCP: En büyük içeriğin yüklenme süresi

LCP (Largest Contentful Paint), sayfadaki en büyük görsel veya metin bloğunun ne kadar sürede göründüğünü ölçer. İyi değer: 2,5 saniye ve altı.

İyileştirme yolları:

  • Ana görseli WebP veya AVIF formatında, doğru boyutta sunun.
  • İlk ekrandaki görseli tembel yüklemeye (lazy load) almayın; öncelikli yükleyin.
  • Sunucu yanıt süresini (TTFB) önbellek ve iyi bir hosting ile kısaltın.
  • Kritik olmayan CSS ve JavaScript dosyalarını erteleyin.

INP: Etkileşime yanıt süresi

INP (Interaction to Next Paint), kullanıcı bir butona tıkladığında veya bir menüyü açtığında sayfanın ne kadar hızlı tepki verdiğini ölçer. Mart 2024’te FID’nin yerini almıştır. İyi değer: 200 milisaniye ve altı.

İyileştirme yolları:

  • Ağır JavaScript eklentilerini ve gereksiz üçüncü taraf betiklerini azaltın.
  • Uzun süren işlemleri küçük parçalara bölün.
  • Sohbet, analiz ve reklam betiklerini sayfa yüklendikten sonra çalıştırın.

CLS: Görsel kayma

CLS (Cumulative Layout Shift), sayfa yüklenirken içeriğin ne kadar kaydığını ölçer. Okumaya başladığınız metnin aniden aşağı kaymasını hepimiz yaşamışızdır. İyi değer: 0,1 ve altı.

İyileştirme yolları:

  • Tüm görsellere genişlik ve yükseklik değeri verin.
  • Reklam ve gömülü içerik alanları için önceden yer ayırın.
  • Web fontlarında “font-display: swap” kullanın ve font sayısını sınırlayın.

Nasıl ölçülür?

  • PageSpeed Insights: Hem laboratuvar hem gerçek kullanıcı verisini gösterir.
  • Google Search Console: Core Web Vitals raporu, sorunlu sayfa gruplarını listeler.
  • Chrome Geliştirici Araçları: Performans sekmesiyle sorunun kaynağını bulabilirsiniz.

Sonuç

Üç metrikte de “iyi” eşiğine ulaşan siteler, hem arama sonuçlarında avantaj elde eder hem de ziyaretçiyi müşteriye dönüştürmede daha başarılı olur. Hız, tasarım kadar önemli bir kalite göstergesidir.

Yorum yazın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir