Bir web sitesinin hızlı olduğunu söylemek kolay, ölçmek ise başka bir iş. Core Web Vitals, Google'ın bir sayfanın kullanıcıya nasıl hissettirdiğini ölçmek için kullandığı üç metriktir: sayfanın ne kadar hızlı yüklendiği, tıklamalara ne kadar çabuk tepki verdiği ve yüklenirken ne kadar kaydığı. Bu yazıda Core Web Vitals nedir, hangi değerler iyi sayılır, nasıl ölçülür ve en sık görülen sorunlar nasıl düzeltilir, Google'ın kendi kaynaklarına dayanarak anlatıyoruz.
Core Web Vitals'ı oluşturan üç metrik
LCP: Largest Contentful Paint (yükleme)
LCP, sayfadaki en büyük görünür içeriğin, genellikle ana görselin ya da büyük bir başlık bloğunun, ekranda belirdiği anı ölçer. Ziyaretçinin "sayfa açıldı" dediği an budur. Google'a göre iyi bir deneyim için LCP, sayfa yüklenmeye başladıktan sonraki 2,5 saniye içinde gerçekleşmelidir (web.dev).
INP: Interaction to Next Paint (etkileşim)
INP, kullanıcı bir düğmeye bastığında, menüyü açtığında ya da forma yazdığında sayfanın bir sonraki tepkiyi ekrana ne kadar sürede çizdiğini ölçer. İyi bir sayfa için INP 200 milisaniye veya altında olmalıdır. INP, 2024'te kararlı bir Core Web Vital haline gelerek eski FID (First Input Delay) metriğinin yerini aldı (web.dev).
CLS: Cumulative Layout Shift (görsel kararlılık)
CLS, sayfa yüklenirken içeriğin beklenmedik biçimde kaymasını ölçer. Okuduğunuz paragrafın bir anda aşağı kayması ya da tam basacağınız sırada düğmenin yer değiştirmesi bu metriğe yansır. İyi bir sayfada CLS 0,1 veya altında olmalıdır.
"İyi" sonuç neye göre belirleniyor?
Google bu değerlerin tek bir ölçümde değil, gerçek sayfa yüklemelerinin 75. yüzdelik diliminde tutturulmasını öneriyor ve mobil ile masaüstünü ayrı ayrı değerlendiriyor (web.dev). Yani ziyaretlerin en az dörtte üçü bu eşiklerin içinde kalmalı. Kendi bilgisayarınızda hızlı açılan bir site, eski bir telefonda ve zayıf mobil bağlantıda bambaşka sonuç verebilir. Bu yüzden ölçümü her zaman mobil için de yapın.
Core Web Vitals sıralamayı etkiler mi?
Google, Core Web Vitals'ın da içinde olduğu sayfa deneyimi unsurlarının, temel sıralama sistemlerinin ödüllendirmeye çalıştığı şeyle örtüştüğünü söylüyor ve Search'te başarı için iyi Core Web Vitals değerlerini güçlü biçimde öneriyor (Google Search Central). Bununla birlikte hız tek başına bir sayfayı üst sıraya taşımaz. Aranan konuya en iyi cevabı veren içerik hâlâ belirleyicidir. Hızı, iyi içeriğin önündeki engeli kaldıran bir temel olarak düşünmek daha doğru.
Sıralamanın ötesinde asıl etki kullanıcıda görülür. Yavaş açılan, kayan ya da tıklamalara geç tepki veren bir sayfada ziyaretçi formu doldurmadan, aramayı yapmadan ayrılır.
Nasıl ölçülür?
- PageSpeed Insights: Sayfanın adresini girip ölçüm alırsınız. Sitenizin yeterli gerçek kullanıcı verisi varsa üstte gerçek kullanıcı deneyimi sonuçları, altta ise laboratuvar ortamında yapılan test ve iyileştirme önerileri görünür.
- Search Console Core Web Vitals raporu: Sitenizdeki sayfaları LCP, INP ve CLS açısından iyi, iyileştirilmesi gerekli ve zayıf olarak gruplar. Yeni ya da az ziyaret alan sitelerde bu raporda veri oluşması zaman alır.
- Chrome geliştirici araçları: Lighthouse ve Performance panelleri, sorunun hangi görselden ya da hangi scriptten kaynaklandığını bulmak için kullanışlıdır.
Laboratuvar testi tek bir cihazda, tek bir anda yapılan bir simülasyondur. Core Web Vitals eşikleri ise gerçek ziyaretler üzerinden tanımlanır. İki sonuç farklı çıkabilir; laboratuvar testini sorunu bulmak, gerçek kullanıcı verisini durumu izlemek için kullanın.
LCP nasıl iyileştirilir?
- Ana görseli modern bir formatta (WebP veya AVIF) ve ekrana uygun boyutta sunun. 4000 piksellik bir fotoğrafı telefona göndermeyin.
- İlk ekranda görünen ana görseli tembel yüklemeye (lazy loading) bırakmayın; bu görsel öncelikli yüklenmeli.
- Sunucu yanıt süresini kısaltın: iyi bir CDN, doğru önbellek ayarları ve gereksiz eklentilerden arınmış bir altyapı.
- İlk ekranı çizmek için gerekmeyen CSS ve JavaScript dosyalarını sonraya bırakın, yazı tipi sayısını sınırlayın.
INP nasıl iyileştirilir?
- Sayfaya yüklenen JavaScript miktarını azaltın. Hazır temalarda ve sayfa oluşturucularda kullanılmayan onlarca script çoğu zaman her sayfada yüklenir.
- Uzun süren işleri parçalara bölün. Tek seferde yüzlerce milisaniye süren kod, tıklamanın ekrana yansımasını geciktirir.
- Sohbet balonları, izleme kodları ve reklam etiketleri gibi üçüncü taraf araçları gerçekten ihtiyaç duyduklarınızla sınırlayın.
CLS nasıl iyileştirilir?
- Görsellere ve videolara genişlik ve yükseklik verin ya da onlar için yer ayırın; böylece yüklendiklerinde içerik kaymaz.
- Sonradan beliren duyuru şeritleri, çerez bantları ve reklam alanları için baştan yer ayırın ya da bunları içeriği itmeyen bir katmanda gösterin.
- Web fontu yüklenirken metnin zıplamaması için yedek fontu benzer ölçülerde seçin.
Hazır tema mı, özel kod mu?
Hazır temalar ve sayfa oluşturucular hızlı kurulur. Ancak her işletmeye uyacak şekilde tasarlandıkları için çoğu sitenin hiç kullanmadığı kodu da beraberinde getirirler ve sonradan eklenen her eklenti bu yükü artırır. Sıfırdan kodlanan bir sitede sayfada yalnızca o sayfanın ihtiyaç duyduğu kod bulunur. Bu, üç metriği baştan kontrol altında tutmayı kolaylaştırır. İyi optimize edilmiş bir tema sitesi de iyi sonuç alabilir; önemli olan ölçmek ve düzenli takip etmektir.
Kısa kontrol listesi
- Ana sayfanızı ve en çok ziyaret alan iki hizmet sayfanızı PageSpeed Insights'ta mobil için test edin.
- LCP 2,5 saniyenin, INP 200 milisaniyenin ya da CLS 0,1'in üzerindeyse önce ilk ekrandaki görseli ve scriptleri inceleyin.
- Search Console'daki Core Web Vitals raporunu ayda bir kontrol edin.
- Yeni bir eklenti, sohbet aracı ya da izleme kodu eklediğinizde ölçümü tekrarlayın.
Sitenizin bu üç metrikte nerede durduğunu merak ediyorsanız ücretsiz site analizi kapsamında hız, mobil uyum ve teknik SEO durumunu sizin için inceleyebiliriz.