Core Web Vitals Nedir? LCP, INP ve CLS'yi Anlamak

Core Web Vitals, Google'ın bir web sayfasının kullanıcıya nasıl hissettirdiğini ölçmek için kullandığı üç metriktir: sayfanın ana içeriği ne kadar çabuk görünüyor (LCP), sayfa dokunuşlara ne kadar çabuk tepki veriyor (INP) ve yüklenirken içerik yerinden ne kadar kayıyor (CLS). Üçü de gerçek ziyaretçilerden toplanan veriyle ölçülür ve Search Console'da sitenizin karnesi olarak görünür.

Teknik bir konu gibi duruyor, ama aslında üçü de hepimizin bildiği can sıkıcı anlara karşılık geliyor. Bir sayfanın boş beyaz ekranla beklemesi, bir butona bastığınızda hiçbir şey olmaması, tam tıklayacakken bağlantının aşağı kayması. Aşağıda her birini bu gündelik hallerinden yola çıkarak anlatıyoruz.

LCP: ana içerik ne kadar hızlı görünüyor?

LCP (Largest Contentful Paint), sayfadaki en büyük görsel ya da metin bloğunun ekranda belirdiği an. Çoğu sitede bu, en üstteki büyük fotoğraf ya da ana başlıktır. Bir restorana oturduğunuzu düşünün: garsonun su getirmesi iyi bir işaret ama sizi asıl ilgilendiren, ana yemeğin masaya gelmesi. LCP, ana yemeğin gelme süresidir.

Google'ın yayımladığı ölçüte göre LCP 2,5 saniye ya da altındaysa iyi, 4 saniyenin üzerindeyse kötü sayılır. Arası 'iyileştirilmesi gerekir' bölgesidir.

Küçük işletme sitelerinde LCP'yi bozan sebep çoğu zaman aynı: ana sayfanın en üstüne konmuş, telefonla çekilip olduğu gibi yüklenmiş, birkaç MB'lık bir fotoğraf. Masaüstünde hızlı internetle fark edilmez; mobilde, zayıf bir bağlantıda saniyeler sürebilir. Bu görseli doğru boyuta küçültüp WebP ya da AVIF gibi modern bir formata çevirmek, çoğu zaman LCP'yi belirgin şekilde iyileştirir. Diğer sık sebepler yavaş yanıt veren bir sunucu ve sayfanın görünmesini geciktiren, en üstte yüklenen ağır yazı tipi ve script dosyalarıdır.

Bir de slider meselesi var. Ana sayfanın tepesinde dönen beş büyük fotoğraf hem LCP'yi geciktirebilir hem de birçok ziyaretçi ilk kareden sonrasına bakmaz bile. Tek, iyi seçilmiş bir görsel genellikle hem daha hızlı hem daha etkilidir.

INP: site tıklamalara ne kadar hızlı yanıt veriyor?

INP (Interaction to Next Paint), ziyaretçi bir şeye dokunduğunda, tıkladığında ya da bir tuşa bastığında, sayfanın buna görünür bir tepki vermesinin ne kadar sürdüğünü ölçer. Bir kapı zili düşünün. Zile basıyorsunuz ve içeriden ses gelmiyor. Bir daha basıyorsunuz. Belki zil bozuk, belki kimse yok. Sitede de aynısı olur: menü butonuna basılır, bir şey olmaz, kullanıcı tekrar basar ve menü iki kere açılıp kapanır.

INP, Google'ın duyurusuyla 2024'te eski FID metriğinin yerini aldı. FID yalnızca ilk etkileşimi ölçüyordu; INP ise ziyaret boyunca yapılan etkileşimlerin en yavaşlarına yakın bir değeri raporlar. Google'ın ölçütü şöyle: 200 milisaniye ya da altı iyi, 500 milisaniyenin üzeri kötü.

INP'yi bozan şey genellikle tarayıcının meşgul olmasıdır. Sayfa yüklenirken çalışan çok sayıda JavaScript, özellikle üçüncü taraf scriptler (canlı destek pencereleri, reklam ve takip kodları, sosyal medya gömme kodları, ağır çerez bannerları) tarayıcıyı meşgul eder ve kullanıcının tıklaması sıraya girer. Hangi altyapı olursa olsun, her biri kendi scriptini yükleyen çok sayıda eklenti de aynı etkiyi yapabilir. İlk yapılacak iş, sayfada gerçekten kullanılmayan scriptleri kaldırmak ve kalanların sayfanın görünmesinden sonra yüklenmesini sağlamaktır.

CLS: sayfa neden kayıyor?

CLS (Cumulative Layout Shift), sayfa yüklenirken içeriğin beklenmedik şekilde yer değiştirmesini ölçer. Herkesin yaşadığı bir an: bir habere tıklamak için parmağınızı uzatıyorsunuz, tam o sırada üstte bir reklam yükleniyor, her şey aşağı kayıyor ve başka bir şeye tıklıyorsunuz. Bir e-ticaret sitesinde bu 'sepete ekle' yerine başka bir ürüne tıklamak demek. Bir form sayfasında yanlış alana yazmak.

CLS bir süre değil, bir puandır. Google'ın ölçütüne göre 0,1 ve altı iyi, 0,25'in üzeri kötü kabul edilir.

En sık sebep, boyutu belirtilmemiş görsellerdir. Tarayıcı görselin ne kadar yer kaplayacağını bilmediği için önce boşluk bırakmaz, görsel gelince altındaki her şeyi iter. Görsellere genişlik ve yükseklik değeri vermek ya da görselin oranını kodda sabitlemek bu sorunu çözer. Diğer sebepler, sonradan yüklenen bannerlar, çerez uyarıları, kampanya şeritleri ve web yazı tipinin geç gelip metnin boyutunu değiştirmesidir. Bu tür öğeler için yerini baştan ayırmak gerekir.

Saha verisi ve laboratuvar verisi farkı

Google'ın PageSpeed Insights aracında sitenizi test ettiğinizde iki ayrı bölüm görürsünüz ve müşterilerin kafası en çok burada karışıyor.

Üstteki bölüm saha verisidir. Chrome kullanan gerçek ziyaretçilerinizin son 28 gün içinde yaşadığı deneyimden derlenir ve Google'ın sayfa deneyimi değerlendirmesinde kullandığı veri budur. Değerlendirme, ziyaretlerin yüzde 75'inin yaşadığı deneyime göre yapılır; yani ziyaretçilerin dörtte üçü iyi deneyim yaşıyorsa metrik iyi sayılır. Siteniz yeniyse ya da az ziyaretçi alıyorsa bu bölüm boş olabilir, çünkü yeterli veri yoktur.

Alttaki bölüm laboratuvar verisidir. Google'ın sunucusunda, yavaşlatılmış bir mobil bağlantı ve orta seviye bir telefon simüle edilerek o anda yapılan tek bir testtir. Puan (0-100 arası renkli daire) buradan gelir. Sorunu teşhis etmek için çok kullanışlıdır ama her testte biraz farklı sonuç verir ve sıralamaya doğrudan girmez.

Bu yüzden 'PageSpeed puanım 62, çok mu kötü?' sorusunun cevabı genellikle 'saha verisine bakalım' oluyor. Laboratuvar puanı 62 olan ama gerçek kullanıcılarda üç metriği de yeşil olan bir site, Core Web Vitals açısından iyi durumdadır. Tersi de mümkün.

Sıralamaya etkisi ne kadar?

Google, Core Web Vitals'ı sıralama sinyallerinden biri olarak kullandığını açıkça söylüyor. Ama aynı zamanda, iyi bir sayfa deneyiminin alakalı ve kaliteli içeriğin önüne geçmediğini de söylüyor. Pratikte bunu şöyle yorumluyoruz: aranan konuyu iyi anlatan iki sayfa arasında, hızlı ve sorunsuz olan bir adım öne geçebilir. Ama konuyu iyi anlatmayan hızlı bir sayfa, yavaş ama doğru cevabı veren sayfayı geçemez.

Yine de Core Web Vitals'ı yalnızca SEO meselesi olarak görmek eksik olur. Mobilde açılması uzun süren bir sayfadan birçok ziyaretçi sayfa açılmadan çıkar. Reklam verdiğiniz bir sayfada bu, ödediğiniz tıklamanın boşa gitmesi demektir. Hız, sıralamadan önce dönüşümü etkiler.

Sitenizin durumunu görmek için en pratik başlangıç, Search Console'daki Core Web Vitals raporuna bakmak. Hangi sayfa grubunda hangi metriğin sorunlu olduğunu orada görürsünüz. Ardından o sayfaları PageSpeed Insights'ta tek tek açıp öneri listesine bakmak, nereden başlayacağınızı söyler. Sorunları en az eforla en çok kazanç sırasına göre nasıl çözeceğinizi yavaş siteleri hızlandırma yazımızda adım adım anlattık; mobil uyum testini ise ayrı bir yazıda ele aldık.