Core Web Vitals Nedir ve Web Sitesi Hızı Dönüşümü Nasıl Etkiler?

Core Web Vitals nedir diye soruyorsanız, kısa cevap şu: Google'ın 2021'den bu yana sıralama faktörü olarak kullandığı, gerçek kullanıcı deneyimini ölçen üç hız metriği. Ama asıl mesele sıralama değil - yavaş siteler ziyaretçiyi kaybeder, hızlı siteler kazanır. Bu kadar basit.

Core Web Vitals Nedir?

Google, yıllarca sayfa hızını tek bir sayıyla (ms cinsinden yükleme süresi) ölçmeye çalıştı. Bu yaklaşım yetersiz kaldı çünkü "yüklendi" kelimesi kullanıcı için hiçbir anlam taşımıyor. Kullanıcı ekranda içerik görünene kadar bekler, tıkladığında yanıt alır, sayfayı okurken yazı kaymazsa memnun olur. Core Web Vitals işte bu üç deneyimi sayısallaştırır: LCP, INP ve CLS.

Metrikler, Chrome'dan toplanan gerçek kullanıcı verilerine (CrUX) dayanır. Yani laboratuvar testi değil, gerçek ziyaretçilerin yaşadığı deneyim ölçülür. Bu da her iyileştirmenin doğrudan kullanıcıya yansıdığı anlamına gelir.

LCP - En Büyük İçerik Boyaması

LCP (Largest Contentful Paint), viewport'taki en büyük içerik öğesinin - genellikle bir hero görseli ya da büyük bir başlık - tarayıcı tarafından boyandığı anı ölçer. Kullanıcı için "sayfa hazır" hissi bu anda oluşur.

• ▸İyi: 2,5 saniye veya altı
• ▸İyileştirme gerekiyor: 2,5 – 4,0 saniye arası
• ▸Kötü: 4,0 saniyenin üzeri

LCP'yi kötüleştiren başlıca nedenler: sunucu yanıt süresi (TTFB), büyük ve optimize edilmemiş görseller, render-blocking CSS/JS, ve yavaş font yüklemesi. Düzeltme adımları sırasıyla şunlardır: CDN kullanımı, WebP/AVIF formatına geçiş, kritik kaynakları `<link rel='preload'>` ile öne çekme ve font-display: swap uygulaması.

INP - Etkileşime Yanıt Süresi

INP (Interaction to Next Paint), Mart 2024'te FID'nin (First Input Delay) yerini aldı. Farkı kritik: FID yalnızca ilk tıklamayı ölçerken INP, sayfadaki tüm tıklama, dokunma ve klavye etkileşimlerinin gecikmesini ölçer ve en kötü %95'i temsil eden değeri raporlar.

• ▸İyi: 200 ms veya altı
• ▸İyileştirme gerekiyor: 200 – 500 ms arası
• ▸Kötü: 500 ms'nin üzeri

INP sorunu çoğunlukla uzun JavaScript görevlerinden kaynaklanır. Ana iş parçacığını bloke eden third-party script'ler, ağır event handler'lar ve gereksiz yeniden render döngüleri en yaygın suçlulardır. Çözüm: uzun görevleri `scheduler.postTask()` ile parçalara ayırın, ağır işlemleri Web Worker'a taşıyın, framework seviyesinde gereksiz re-render'ları kesin.

CLS - Kümülatif Düzen Kayması

CLS (Cumulative Layout Shift), sayfa yüklenirken öğelerin beklenmedik şekilde kaymasını ölçer. Makaleyi okurken aniden kaydırılan metni, yanlış butona tıklamayı, gözünüzün önünde sallanan içerik bloklarını hepimiz yaşadık. CLS bu kötü deneyimi puanlar.

• ▸İyi: 0,1 veya altı
• ▸İyileştirme gerekiyor: 0,1 – 0,25 arası
• ▸Kötü: 0,25'in üzeri

CLS'nin başlıca nedenleri: boyutsuz görseller ve video öğeleri, geç yüklenen reklamlar veya embed içerikler, dinamik olarak eklenen içerik (banner, bildirim vs.) ve web fontlarının geç devreye girmesi. Görsellere her zaman `width` / `height` attribute'u verin, reklam alanları için minimum yükseklik rezerve edin, font-display: optional veya swap kullanın.

Core Web Vitals Nasıl Ölçülür?

Metriklerinizi iki farklı perspektiften ölçebilirsiniz: laboratuvar verisi (simüle edilmiş koşullar) ve saha verisi (gerçek kullanıcılar). Her ikisi de gerekli, ama sıralama etkisi saha verisine göre belirlenir.

• ▸Google Search Console → Core Web Vitals raporu - sayfaları "İyi / İyileştirme Gerekiyor / Kötü" olarak gruplayarak öncelik sırası verir
• ▸PageSpeed Insights - hem lab (Lighthouse) hem CrUX saha verisini tek sayfada gösterir
• ▸Chrome DevTools → Performance paneli + Web Vitals eklentisi - anlık debug için
• ▸web-vitals JS kütüphanesi - gerçek kullanıcı verilerini kendi analytics sisteminize aktarır

Core Web Vitals Nasıl İyileştirilir?

Önce teşhis, sonra tedavi. Hangi metriğin sorunlu olduğunu PageSpeed Insights veya Search Console'dan belirleyin, sonra o metriğe özel aksiyona geçin. Tüm metrikleri aynı anda iyileştirmeye çalışmak genellikle hiçbirini iyileştirmemekle sonuçlanır.

1. 01Search Console'da Core Web Vitals raporunu açın, kötü URL gruplarını listeleyin.
2. 02Her grup için PageSpeed Insights ile teşhis koyun - hangi metrik, hangi öğe?
3. 03LCP için: sunucu TTFB'sini optimize edin, hero görseli preload edin, boyutları küçültün.
4. 04INP için: Chrome DevTools Performance panelinde uzun görevleri bulun, parçalayın.
5. 05CLS için: görsellere boyut verin, font-display: swap ekleyin, dinamik içerik için alan rezerve edin.
6. 06Deploy edin, 28 gün CrUX veri toplamasını bekleyin, Search Console'u tekrar kontrol edin.

Hız bir özellik değil, bir ürün kararıdır. Her saniye gecikme, her ekstra layout shift - bunlar kullanıcının "bu siteye güvenebilir miyim?" sorusuna verdiği cevabı şekillendirir.

- POI369 Web Ekibi

Hız ile Dönüşüm Arasındaki Bağlantı

Core Web Vitals'ı önemli kılan yalnızca SEO değil - asıl baskı dönüşüm tarafından geliyor. Sektör araştırmaları tekrar tekrar şunu gösteriyor: sayfa yükleme süresi arttıkça hemen çıkma oranı yükselir, form doldurmalar azalır, satın alma tamamlanmaz. Mobil kullanıcılar masaüstüne kıyasla çok daha az sabırlı ve mobile ilk sırada sıralama yapılıyor.

Dönüşüm optimizasyonuna ciddi para yatırıp teknik hızı ihmal etmek, sızıntılı bir kovaya su doldurmak gibidir. Dönüşüm odaklı landing page tasarımı ne kadar iyi olursa olsun, sayfa yavaş açılıyorsa ziyaretçi tasarımı görmeden gider.

Öte yandan Core Web Vitals'ı düzeltmek tek başına yeterli değil. Hız, güvenin ilk katmanıdır - ama sonrasında içerik, mesaj netliği ve Next.js ile hızlı kurumsal site mimarisinin sunduğu kullanıcı deneyimi devreye girer. İkisi birlikte çalışır.

SEO açısından bakıldığında, Google'ın Page Experience sinyali içinde Core Web Vitals doğrudan sıralamayı etkiler. "İyi" eşiğini geçen sayfalar, rakipleri benzer içerik kalitesine sahipse görünürlük avantajı kazanır. Bu küçük gibi görünse de rekabetin yüksek olduğu kategorilerde belirleyici olabilir.