Üç sayı gerçekte neyi ölçüyor
LCP — Largest Contentful Paint — görünür en büyük öğenin render olduğu ana kadar geçen süredir: hero görseli, başlık bloğu. "Sayfa ne zaman yüklenmiş hissettirdi"ye en yakın metriktir. Gerçek ziyaretlerin 75. yüzdelik dilimi için 2,5 saniyenin altı iyidir.
INP — Interaction to Next Paint — bir dokunma, tıklama ya da tuşa basmadan sonra sayfanın görünür tepki vermesinin ne kadar sürdüğünü, ziyaretin tamamı boyunca ölçer. 200ms altı iyidir. 2024'te FID'in yerini aldı ve daha katıdır: yalnızca ilk girdiyi değil, JavaScript ağırlıklı sayfalarda kullanıcının hissettiği hantallığı yakalar.
CLS — Cumulative Layout Shift — görünür içeriğin kullanıcı istemeden ne kadar hareket ettiğini puanlar: okuduğunuz paragrafın reklam yüklenince zıplaması, tam dokunacakken yer değiştiren düğme. 0,1 altı iyidir ve diğer ikisinin aksine zaman değil birimsiz bir puandır.
Saha verisi vs laboratuvar: hangi sayılara inanmalı
PageSpeed Insights iki ayrı dünya gösterir. Üst bölüm — "gerçek kullanıcılar ne yaşadı" — Chrome kullanıcılarından 28 günlük saha verisidir ve Google'ın gerçekte kullandığı budur. Alttaki puan, kısıtlanmış donanımda bir laboratuvar simülasyonudur: teşhis için yararlı, hedef olarak yanıltıcı.
Pratik sonuçlar: laboratuvarda 60 ama sahada yeşilseniz durumunuz iyidir; laboratuvarda mükemmel ama sahada kırmızıysanız gerçek ağlardaki gerçek ziyaretçiler acı çekiyor, laboratuvar makinesi çekmiyordur. Saha sayıları için optimize edin, laboratuvar raporunu NEDEN öyle olduklarını bulmak için kullanın — ve saha verisinin geciktiğini unutmayın: bugünkü düzeltmenin tam görünmesi 28 günü bulur.
LCP'yi düzeltmek: çoğunlukla bir dağıtım problemi
LCP şuna ayrışır: HTML'in gelme süresi, ana görselin keşfi, indirilmesi, render'ı. Bu dördün üçü dağıtımdır — LCP'nin CDN'in en çok oynattığı vital olmasının ve doğru ilk hedef olmasının sebebi budur.
Etki sırasıyla kollar: HTML'i ve varlıkları edge cache'ten sunun ki ilk baytlar origin'inizden değil yakından gelsin; hero görsellerini WebP/AVIF'e çevirin ve kamera çözünürlüğü göndermek yerine gerçek görüntü boyutuna getirin; render'dan önce gelmesi gereken metni sıkıştırın. cdn.com.tr'de üçü de dağıtım kuralı ayarıdır — edge cache, otomatik WebP/AVIF görsel optimizasyonu ve Brotli/Gzip — yani en büyük LCP kolları yeniden inşa değil, işarettir. Uygulama tarafında hero görseline yüksek fetch önceliği verin ve onu asla lazy-load etmeyin: LCP öğesini lazy-load etmek, kendi kendine açılan en yaygın LCP yarasıdır.
CLS'i düzeltmek: yeri ayırın
Düzen kaymasının tek kök nedeni vardır: yeri ayrılmadan gelen içerik. Düzeltmeler gösterişsiz ve güvenilirdir. Her görsele ve videoya açık width/height nitelikleri (ya da CSS'te aspect-ratio) verin ki tarayıcı kutuyu dosya gelmeden ayırsın. Reklam alanlarına ve gömmelere, içerik yüklense de yüklenmese de yerini koruyan sabit boyutlu kaplar verin. Özel fontları preload edin ve geç takasların sayfayı yeniden akıtmasını önleyen font-display stratejileri kullanın. Ve yüklemeden sonra mevcut içeriğin ÜSTÜNE asla banner enjekte etmeyin — berbat CLS puanlarının çoğunun arkasında o tek desen vardır.
CLS, bir hafta sonluk nitelik eklemenin kalan bir sayfayı düzenli olarak yeşile taşıdığı vital'dir.
INP'yi düzeltmek: ana iş parçacığında daha az JavaScript
INP inatçı olandır, çünkü nedeni yapısaldır: kullanıcıya da cevap vermesi gereken iş parçacığında çok fazla iş yapan çok fazla JavaScript. Dağıtım kenarlardan yardım eder — daha küçük, sıkıştırılmış paketler daha hızlı gelir ve ayrıştırılır — ama gerçek düzeltmeler uygulamadadır: uzun görevleri bölün ki tarayıcı aralarında nefes alabilsin, etkileşimden önce çalışması gerekmeyen üçüncü taraf script'leri erteleyin ve yıllar içinde birikmiş tag-manager yükünü kırpın. Önce ölçün: performans panelinin uzun-görev görünümü, iş parçacığını hangi script'lerin tuttuğunu tam olarak söyler.
JavaScript'inize dokunmadan INP düzeltmesi vadeden herkese şüpheyle yaklaşın — metrik tam da dağıtımın tek başına tepkiselliği taklit edememesi için var.
Aklı başında bir iş sırası
Yalnızca anasayfanın değil, ticari olarak önemli sayfaların saha verisine bakın. LCP kalıyorsa: edge cache, görsel formatı ve boyutu, sıkıştırma — dağıtım seti — sonra fetch önceliği. CLS kalıyorsa: boyutlar, ayrılmış alanlar, font yükleme. INP kalıyorsa: gerçek uygulama işi bütçeleyin; başka hiçbir şey onu dürüstçe oynatmaz. Her turdan sonra sahada yeniden ölçün ve 28 günlük gecikmeyi bekleyin.
Ve çerçeveyi koruyun: mesele rozet değil. Metriği tatmin eden o 2,5 saniye, kalan ziyaretçiyle giden ziyaretçi arasındaki farkın ta kendisidir — rozet yalnızca bunu görebildiğiniz yerdir.
Sık sorulan sorular
Core Web Vitals sıralamayı gerçekten etkiliyor mu?
Evet, birçok sinyalden biri olarak — baskın bir faktörden çok karşılaştırılabilir sonuçlar arasında eşitlik bozucu. Daha büyük ticari etki genellikle doğrudandır: metriği kaldıran yavaşlık, sıralama devreye girmeden ziyaretçi kaybettirir.
Laboratuvar puanım kötü ama saha verim yeşil, neden?
Laboratuvar, kısıtlı ağda yavaş bir cihazı simüle eder; gerçek kitleniz daha iyi donanımda olabilir. Sayılan cevap yeşil saha verisidir — laboratuvarı yalnızca teşhis için kullanın, hedef olarak değil.
CDN vitals'ımı ne kadar hızlı iyileştirir?
Mekanizma anındadır: edge'de cache'lenen HTML ve optimize görseller, bir sonraki cache'siz ziyarette LCP'yi değiştirir. RAPORLANAN saha sayıları 28 güne kadar bir sürede oynar, çünkü gerçek ziyaretlerin kayan penceresidir.
Önce hangi vital'ı düzeltmeliyim?
Para kazandıran sayfalarınızda saha verisinde kalanı. Birkaçı kalıyorsa: önce LCP (dağıtım ayarları, en hızlı kazanç), sonra CLS (ucuz uygulama düzeltmeleri), en son INP (gerçek JavaScript işi).