Core Web Vitals (LCP, INP, CLS) nedir, site hızı SEO'yu nasıl etkiler? Görsel optimizasyonu, lazy load, CDN ve kod iyileştirme adımları. Solid Medya'dan Google PageSpeed ve Search Console odaklı performans rehberi.
Bir sayfanın hızlı olması yalnızca ne kadar çabuk açıldığı demek değildir. Google, kullanıcı deneyimini üç ölçüyle değerlendirir: ana içeriğin ne zaman göründüğü, sayfanın dokunmaya ne kadar çabuk cevap verdiği ve yüklenirken içeriğin ne kadar yerinden oynadığı. Bu üç ölçüye Core Web Vitals (temel web verileri) denir.
Aşağıda eşik değerleri, ölçüm yöntemlerini ve her metrik için uygulanabilir iyileştirmeleri, görsel optimizasyonundan CDN ve kod sadeleştirmeye kadar sırasıyla bulacaksınız.
Core Web Vitals nedir ve eşik değerleri nelerdir?
Core Web Vitals, Google'ın gerçek kullanıcı deneyimini ölçmek için kullandığı üç metriktir: LCP, INP ve CLS. Bir metriğin "iyi" sayılması için sayfa yüklemelerinin en az yüzde 75'inde eşik değeri sağlaması gerekir; mobil ve masaüstü ayrı değerlendirilir. Bu eşikler değişmez değildir; Google ölçütleri zamanla güncelleyebilir, INP'nin FID'in yerini alması bunun örneğidir. Bu yüzden bir kez ayarlayıp unutmak yerine düzenli aralıklarla kontrol etmek gerekir.
- LCP (Largest Contentful Paint): ekrandaki en büyük içerik öğesinin, genellikle ana görselin ya da başlık bloğunun görünme süresidir. İyi değer 2,5 saniye veya altıdır; 4 saniyenin üzeri zayıf sayılır.
- INP (Interaction to Next Paint): kullanıcı tıkladıktan, dokunduktan ya da tuşa bastıktan sonra sayfanın görsel olarak cevap verme süresidir. İyi değer 200 milisaniye veya altıdır; 500 milisaniyenin üzeri zayıftır. INP, Mart 2024'te FID metriğinin yerini aldı.
- CLS (Cumulative Layout Shift): sayfa yüklenirken içeriğin beklenmedik biçimde kayma miktarıdır ve birimsiz bir skorla verilir. İyi değer 0,1 veya altıdır; 0,25'in üzeri zayıftır.
Site hızı SEO'yu nasıl etkiler?
Sayfa deneyimi, Google'ın sıralamada dikkate aldığı sinyallerden biridir, ancak tek başına belirleyici değildir; içeriğin soruyla uyumu ve kalitesi çoğu zaman daha ağır basar. Hızlı ama içeriği zayıf bir sayfa sıralamada yükselmez.
Buna rağmen hız, dolaylı etkilerle SEO'yu besler. Yavaş sayfa ziyaretçinin ayrılma ihtimalini artırır, sunucu yanıtı yavaş büyük sitelerde Googlebot'un tarama verimini düşürür ve reklam ya da kampanya trafiğinin dönüşümünü azaltır. Konu ve kalite açısından birbirine yakın iki sayfadan hızlı olanın avantajlı çıkması beklenir.
Hız yatırımının asıl karşılığı çoğu zaman sıralamadan çok ziyaretçi davranışında görülür: sayfa çabuk açıldığında form doldurma ve sepete ekleme gibi adımlar daha az yarıda kalır. Bu nedenle çalışmanın başarısını yalnızca sıralamayla değil, terk oranı ve dönüşüm verisiyle de izleyin.
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 laboratuvar simülasyonu. Saha verisi Chrome Kullanıcı Deneyimi Raporu'ndan (CrUX) gelir; PageSpeed Insights'ın üst bölümünde ve Search Console'daki Core Web Vitals raporunda görünür. Google'ın değerlendirmesinde esas alınan veri budur. Yeterli ziyaretçisi olmayan sayfalar için saha verisi görünmeyebilir.
Lighthouse ise tek bir test koşusudur. Değişiklikten sonra hızlı geri bildirim almak için idealdir, ancak gerçek etkileşim gerektiren INP'yi doğrudan ölçemez. Pratik yöntem şöyledir: Search Console'da sorunlu URL gruplarını bulun, PageSpeed Insights'ta tek tek inceleyin, düzeltmeyi yapın ve saha verisinin yenilenmesi için yaklaşık 28 günlük kayan pencereyi bekleyin. Search Console benzer sayfaları "zayıf", "iyileştirme gerekli" ve "iyi" gruplarında toplar; aynı şablonu kullanan yüzlerce sayfa tek bir düzeltmeden yarar sağlayabileceği için sorunu şablon düzeyinde düşünün.
PageSpeed puanının (0 ile 100 arası) Core Web Vitals'ın kendisi olmadığını da unutmayın. Hedef 100 puan almak değil, saha verisinde üç metriği de "iyi" aralığına çekmektir. Test cihazı, ağ ve saat gibi koşullar laboratuvar sonuçlarını dalgalandırır; bu yüzden tek bir ölçüme değil, birkaç ölçümün eğilimine bakın.
LCP nasıl iyileştirilir?
LCP'yi düşürmenin en etkili yolu, en büyük öğeyi (çoğunlukla ana görseli) küçültmek, erken yüklemek ve sunucu yanıtını hızlandırmaktır. Önce PageSpeed Insights'ın hangi öğeyi LCP olarak işaretlediğine bakın; çözümü o öğeye göre seçin.
- Görseli WebP ya da AVIF biçiminde sunun ve gösterildiği boyuta uygun çözünürlükte dosya kullanın.
- İlk ekrandaki ana görseli lazy load (gecikmeli yükleme) ile yüklemeyin; fetchpriority=high özelliği tarayıcıya önceliği bildirir.
- Sunucu yanıt süresini düşürün: sayfa önbelleği, yeterli barındırma kaynağı ve yavaş veritabanı sorgularının azaltılması bunun yollarıdır.
- Sayfa gösterimini engelleyen CSS ve JavaScript dosyalarını sadeleştirin, ilk ekran için gereken CSS'i öne alın.
- CDN kullanın; statik dosyalar ziyaretçiye coğrafi olarak yakın bir sunucudan gelir.
- Yazı tipi sayısını sınırlayın ve ana yazı tipini önceden yükleyin.
INP nasıl iyileştirilir?
INP'yi iyileştirmek için tarayıcının ana iş parçacığını uzun süre meşgul eden JavaScript'i azaltmak gerekir. Tarayıcı bir tıklamaya cevap verirken aynı anda ağır bir script çalıştırıyorsa ekran geç tepki verir. Uzun görevleri küçük parçalara bölün, kullanılmayan JavaScript'i kaldırın ve sayfa yüklenirken ihtiyaç duyulmayan script'leri defer ile erteleyin.
En sık sorun kaynağı üçüncü taraf eklentilerdir: canlı destek pencereleri, takip pikselleri ve etiket yöneticisine eklenmiş çok sayıda etiket. Her birinin gerçekten gerekli olup olmadığını sorgulayın. Menü açma ya da filtre uygulama gibi etkileşimlerde ağır işi arka plana alıp kullanıcıya hemen görsel bir geri bildirim vermek, algılanan hızı belirgin biçimde iyileştirir.
Sorunlu etkileşimi bulmak için Chrome geliştirici araçlarındaki Performance panelinde bir tıklamayı kaydedin. Kırmızı işaretli uzun görevler, yani 50 milisaniyeden uzun süren işlemler genellikle ilk şüphelidir; hangi script dosyasından geldiğini görerek kaldırma ya da erteleme kararı verebilirsiniz.
CLS (düzen kayması) nasıl düşürülür?
CLS'yi düşürmek için sayfadaki her öğenin yer ihtiyacını yüklenmeden önce ayırmak gerekir. Bir görsel, reklam ya da gömülü içerik geç geldiğinde altındaki her şeyi aşağı iter; kullanıcı tam tıklayacağı sırada buton kayarsa yanlış yere basar.
- Görsel ve videolara genişlik ile yükseklik değerlerini (ya da aspect-ratio özelliğini) yazın.
- Reklam, harita ve iframe alanları için sabit yükseklikli kutu ayırın.
- Yazı tipi yüklenirken oluşan kaymayı font-display ayarı ve boyutları benzer bir yedek yazı tipiyle azaltın.
- Sayfa yüklendikten sonra üstten eklenen duyuru bandı ya da çerez bildirimini içeriği itmeyecek şekilde, alanını önceden ayırarak veya üstüne bindirerek gösterin.
- Animasyonlarda top ve left yerine transform kullanın.
Hız iyileştirmesine hangi sırayla başlanmalı?
En yüksek getiriyi genellikle şu sıra verir: önce ölçüm, sonra görseller, ardından sunucu ve önbellek, en sonda kod ve üçüncü taraf script'ler. Search Console ve PageSpeed Insights ile hangi metriğin kırmızıda olduğunu görmeden iş yapmak zaman kaybıdır; sorun CLS ise görsel sıkıştırma çalışması sonucu değiştirmez.
Çoğu sitede görseller tek başına büyük fark yaratır, bu yüzden onlarla başlayın. WordPress gibi eklenti tabanlı sistemlerde ise sorun sıklıkla, ihtiyaç duyulmayan sayfalara da script ve stil dosyası ekleyen eklentilerdir; bunları yalnızca gerekli sayfalarda yüklemek ya da kaldırmak ciddi kazanç sağlar. Her adımdan sonra yeniden ölçün ve saha verisinin yenilenmesinin birkaç hafta alabileceğini unutmayın. Bu çalışmayı kendi ekibinizle yapamıyorsanız site denetimi ve hız iyileştirmesini Solid Medya'dan talep edebilirsiniz.