Bir sayfa açılıyor ama görsel geç yükleniyor. Kullanıcı butona basıyor, hiçbir şey olmuyor. Sayfa yüklenirken içerik kayıyor, yanlış yere tıklanıyor. Bu üç senaryo rastgele değil; Google’ın kullanıcı deneyimini ölçmek için kullandığı üç temel metriğin tam olarak karşılık geldiği sorunlar.
Core Web Vitals, Google’ın 2021’de sıralama faktörü olarak duyurduğu ve o tarihten bu yana her yıl güncellediği sayfa deneyimi metrikleridir. 2026 itibarıyla bu metrikler teknik SEO’nun en kritik bileşenlerinden biri olmayı sürdürüyor.
Bu rehberde Core Web Vitals’ın ne olduğunu, her metriğin nasıl ölçüldüğünü, neyin “iyi” sayıldığını ve optimize etmek için hangi adımların atılacağını ele alıyorum. Teknik SEO’nun genel çerçevesini görmek için önce teknik SEO rehberimize bakabilirsiniz.
Core Web Vitals nedir?
Core Web Vitals, Google’ın gerçek kullanıcı deneyimini ölçmek için belirlediği üç sayfa performans metriğidir:
- LCP (Largest Contentful Paint): En büyük içerik öğesinin yükleme süresi
- INP (Interaction to Next Paint): Kullanıcı etkileşimine yanıt süresi
- CLS (Cumulative Layout Shift): Beklenmedik düzen kayması miktarı
Bu metrikler, Google’ın “sayfa deneyimi sinyalleri” adını verdiği geniş kümenin çekirdeğini oluşturuyor. Sayfa hızı tek başına artık yeterli değil; etkileşim kalitesi ve görsel kararlılık da ölçülüyor.
Neden önemli?
İki nedeni var. Birincisi, Google bu metrikleri doğrudan sıralama faktörü olarak kullanıyor. Aynı içerik kalitesine sahip iki sayfadan Core Web Vitals puanı daha iyi olan öne geçiyor.
İkincisi ve daha önemlisi: bu metrikler kullanıcı davranışıyla doğrudan ilişkili. Google’ın kendi araştırmaları, LCP’nin bir saniye iyileştirilmesinin mobil dönüşüm oranını yüzde 27’ye kadar artırabileceğini gösteriyor. Yavaş sayfa, dönüşüm düşmanı.
LCP: En büyük içerik öğesi yükleme süresi
Largest Contentful Paint (LCP), sayfanın görünür alanındaki en büyük içerik öğesinin (genellikle hero görseli veya ana başlık) yüklenme süresini ölçer. Ölçüm, sayfa yüklenmeye başladığı andan itibaren başlar.
LCP eşikleri
| Puan | Süre |
|---|---|
| İyi | 2,5 saniye veya altı |
| İyileştirme gerekiyor | 2,5 - 4,0 saniye |
| Zayıf | 4,0 saniye üzeri |
LCP’yi etkileyen başlıca faktörler
Büyük resim boyutları. Hero görseli optimize edilmemişse, sayfanın görünür alanındaki en büyük öğe geç yükleniyor. Modern görsel formatlar (WebP, AVIF) ve doğru boyutlandırma burada kritik.
Render-blocking kaynaklar. CSS ve JavaScript dosyaları, tarayıcının sayfayı oluşturmasını bloke edebiliyor. Kritik CSS’i satır içine almak, kritik olmayan JS’i ertelemek LCP’yi doğrudan etkiliyor.
Yavaş sunucu yanıt süresi (TTFB). Sunucu ilk baytı geç gönderirse LCP süresi de uzuyor. Hosting kalitesi, CDN kullanımı ve sunucu konfigürasyonu burada belirleyici.
Kaynak önceliklendirmesi eksikliği. LCP öğesi olan görsele fetchpriority="high" attribute eklenmemişse tarayıcı onu öncelik sırasında geç yüklüyor.
LCP optimizasyonu için adımlar
- Hero görselini WebP veya AVIF formatına dönüştürün; boyutu sıkıştırın.
- LCP öğesine
fetchpriority="high"ekleyin. - Görsel için
<link rel="preload">kullanın. - Kritik olmayan JavaScript’i
deferveyaasyncile erteleyin. - CDN kullanarak sunucu yanıt süresini kısaltın.
- Kritik CSS’i
<head>içine satır içi alın.
INP: Etkileşimden sonraki boya süresi
Interaction to Next Paint (INP), 2024’te FID’in (First Input Delay) yerini aldı. Kullanıcının bir etkileşim gerçekleştirmesinden (tıklama, klavye girişi, dokunma) tarayıcının ekranı güncellemesine kadar geçen süreyi ölçüyor.
FID yalnızca ilk etkileşimi ölçüyordu. INP ise tüm sayfa ziyareti boyunca gerçekleşen etkileşimlerin en kötüsünü alıyor. Bu değişiklik, tek seferlik hızlı açılışın yetmediğini; sayfanın kullanım boyunca duyarlı kalması gerektiğini vurguluyor.
INP eşikleri
| Puan | Süre |
|---|---|
| İyi | 200 milisaniye veya altı |
| İyileştirme gerekiyor | 200 - 500 ms |
| Zayıf | 500 ms üzeri |
INP’yi etkileyen başlıca faktörler
Uzun JavaScript görevleri. Ana thread’i bloklayan uzun JS görevleri, etkileşimlerin hissedilir biçimde gecikmesine yol açıyor. Chrome DevTools’da “Long Tasks” ile tespit edilebilir.
Aşırı DOM karmaşıklığı. Sayfa çok sayıda DOM öğesi içeriyorsa tarayıcının her etkileşimde yeniden hesaplama yapması zorlaşıyor.
Senkron işlemler. Etkileşim sırasında senkron API çağrısı veya büyük veri işlemi varsa yanıt gecikmesi kaçınılmaz.
Üçüncü taraf scriptler. Reklam servisleri, chatbot widgetları ve analitik araçlar çoğu zaman INP sorunlarının kaynağı.
INP optimizasyonu için adımlar
- Chrome DevTools Performance paneli ile uzun görevleri tespit edin.
- Büyük JavaScript bloklarını küçük parçalara bölün (code splitting).
setTimeoutveyarequestIdleCallbackile kritik olmayan işleri erteleyin.- Üçüncü taraf scriptleri gözden geçirin; gereksizleri kaldırın.
- React veya benzeri kütüphane kullananlar için sanal liste ve lazy loading uygulayın.
- Web Worker kullanarak ağır hesaplamaları ana thread dışına taşıyın.
CLS: Kümülatif düzen kayması
Cumulative Layout Shift (CLS), sayfa yüklenirken veya kullanım sırasında öğelerin beklenmedik biçimde hareket etmesi sonucu oluşan görsel kararsızlığı ölçer. Bir butona basarken içeriğin kayması ve başka bir şeye tıklanması CLS’nin somut örneği.
CLS, 0 ile 1 arasında sayısal bir skordur. Yüksek CLS hem kullanıcı deneyimini bozuyor hem de güven algısını düşürüyor.
CLS eşikleri
| Puan | Skor |
|---|---|
| İyi | 0,1 veya altı |
| İyileştirme gerekiyor | 0,1 - 0,25 |
| Zayıf | 0,25 üzeri |
CLS’yi etkileyen başlıca faktörler
Boyutsuz görseller ve iframeler. width ve height attribute’u olmayan görseller, yüklenene kadar yer kaplamıyor; yüklenince diğer içerikleri itiyor.
Dinamik içerik enjeksiyonu. Kullanıcı etkileşimi olmadan sayfaya eklenen reklam, banner veya bildirim çubuğu.
Web fontlarının geç yüklenmesi (FOUT / FOIT). Font yüklenmeden önce sistem fontu kullanılıyor, font gelince metin yeniden çiziliyor ve düzen kayıyor.
Animasyonlar. top, left, margin gibi düzeni etkileyen CSS özellikleriyle yapılan animasyonlar CLS’ye katkıda bulunuyor.
CLS optimizasyonu için adımlar
- Tüm görsellere
widthveheightattribute ekleyin ya da CSS ile en-boy oranı rezerve edin (aspect-ratio). - Reklam ve dinamik içerik alanları için sayfada önceden alan ayırın.
- Web fontları için
font-display: optionalveyafont-display: swapkullanın. font-display: optionalile fallback fontun boyutunu ana fontla eşleştirin (size-adjust).- Animasyonlarda
transformveopacitykullanın; düzeni etkileyen özellikleri animasyondan çıkarın.
Core Web Vitals nasıl ölçülür?
Lab verisi vs. alan verisi
Lab verisi (Laboratory data): Kontrollü ortamda, simüle edilmiş koşullarda ölçüm. PageSpeed Insights, Lighthouse, WebPageTest bu kategoride. Hızlı geri bildirim sağlar ama gerçek kullanıcı deneyimini tam yansıtmayabilir.
Alan verisi (Field data / CrUX): Gerçek Chrome kullanıcılarından toplanan anonim performans verisi. Google’ın sıralamada kullandığı asıl veri kaynağı bu. Toplamak için yeterli trafik gerekiyor; yeni veya düşük trafikli siteler için alan verisi boş olabiliyor.
En faydalı araçlar
PageSpeed Insights (PSI): Hem lab hem alan verisi sunuyor. Google’ın kendi aracı; birincil referans. Her sayfa için ayrı ayrı test yapılabiliyor.
Google Search Console: “Temel Web Verileri” raporu, tüm site genelinde CWV durumunu URL grupları bazında gösteriyor. Hangi sayfaların “zayıf” kategorisinde olduğunu hızla görüyorsunuz.
Lighthouse: Chrome DevTools içinde çalışıyor. Detaylı tanılama raporu sunuyor; neden kötü olduğunu açıklıyor.
WebPageTest: Gelişmiş test senaryoları, farklı cihaz ve bağlantı hızları, waterfall analizi. Sorunun kaynağını derinlemesine araştırmak için.
Chrome DevTools Performance paneli: INP ve uzun görev tespiti için en detaylı araç. Gerçek zamanlı profil almak mümkün.
CrUX Dashboard: Google Data Studio üzerinde, Chrome Kullanıcı Deneyimi Raporu verilerini görselleştiren ücretsiz dashboard. Alan verisini takip etmek için idealdir.
Sık yapılan hatalar ve kolay kazanımlar
Görsel optimizasyonunu ertelemek
CWV sorunlarının büyük çoğunluğu görsel kaynaklı. Önce görselleri optimize etmek; WebP/AVIF formatına geçmek, lazy loading uygulamak ve hero görseline fetchpriority eklemek çoğu zaman LCP’yi tek adımda “iyi” seviyeye çekiyor.
Üçüncü taraf scriptleri görmezden gelmek
Google Tag Manager, Facebook Pixel, canlı destek widgetları, reklam kodları: bunların her biri hem LCP’ye hem INP’ye katkıda bulunuyor. Her scripti gereklilik açısından sorgulayın. Gereksiz olanı kaldırmak, optimize etmekten kolay ve etkili.
CLS’yi yalnızca masaüstünde test etmek
CLS sorunları mobilde çok daha belirgin. Reklam boyutları, font yüklemeleri ve dinamik banner’lar mobil ekranlarda farklı davranıyor. Her testi mobil simülasyonla da yapın.
Hızlı yükleme = iyi CWV yanılgısı
LCP iyi olsa da INP veya CLS kötü olabilir. Üçü birlikte “iyi” kategorisinde olmalı. Google Search Console raporunda her üç metriği ayrı ayrı takip edin.
JavaScript SEO ve Core Web Vitals ilişkisi
JavaScript ağırlıklı siteler (SPA, React, Vue, Next.js) genellikle CWV açısından zorluk yaşıyor. Client-side rendering, LCP süresini uzatırken INP problemlerine de zemin hazırlıyor.
Bu siteler için önerilen yaklaşım: Server-side rendering (SSR) veya statik ön üretim (SSG). Hem SEO hem CWV açısından en uygun mimari. JavaScript SEO ve rendering stratejilerini derinlemesine görmek için JavaScript SEO rehberimize bakabilirsiniz.
Astro, Next.js ve modern framework’lerde CWV
Bu sitenin altyapısı Astro kullanıyor. Astro’nun “zero JS by default” yaklaşımı, CWV açısından büyük avantaj sağlıyor: gereksiz JavaScript gönderilmiyor, LCP ve INP için temiz bir başlangıç noktası sunuluyor.
Next.js kullananlar için: next/image bileşeni otomatik olarak görsel optimizasyonu, lazy loading ve boyut rezervasyonu yapıyor. Bu bileşeni kullanmak CLS ve LCP’yi birden iyileştiriyor.
WordPress kullananlar için WP Rocket, NitroPack veya LiteSpeed Cache gibi performans eklentileri CWV’de hızlı kazanım sağlıyor. Ama eklenti, kötü kodun üstünü örtüyor; gerçek optimizasyon için altyapı incelemesi gerekiyor.
2026 güncellemeleri: neler değişti?
INP’nin kalıcılaşması. 2024’te FID’in yerini alan INP, 2025-2026 döneminde puanlama açısından daha da ağırlaştı. Google, etkileşim duyarlılığını kullanıcı deneyiminin belirleyici kriteri olarak netleştiriyor.
Mobil öncelik. Google’ın mobil-first indexleme politikası tam oturdu. CWV değerlendirmesinde mobil alan verisi, masaüstü verisine kıyasla daha belirleyici.
INP için yeni threshold tartışmaları. 200ms eşiğinin yeterince agresif olmadığına dair sektörel tartışma sürüyor. Google’ın 2026 sonunda bu eşiği revize edebileceğine dair sinyaller var; takipte olmak gerekiyor.
Sıkça Sorulan Sorular
Core Web Vitals’ı geçmek zorunlu mu?
Zorunlu değil ama avantajlı. Aynı içerik kalitesinde rakiplerin CWV puanı sizinkinden iyiyse sıralamada geride kalabilirsiniz. Ayrıca CWV sorunları kullanıcı deneyimini ve dönüşüm oranını doğrudan etkiliyor.
CWV’yi geçemezsem sıralamam düşer mi?
Otomatik ceza yok. Ama aynı kalitedeki iki sayfa arasında tiebreaker olarak kullanılıyor. Rekabetçi bir anahtar kelimede marjinal fark yaratabilir.
LCP için ideal görsel formatı nedir?
AVIF en iyi sıkıştırmayı sağlıyor ama tarayıcı desteği hâlâ sınırlı. WebP geniş destek + iyi sıkıştırma dengesini sunuyor. <picture> etiketiyle hem AVIF hem WebP hem JPEG sunmak en güvenli yaklaşım.
INP nasıl hızlı tespit edilir?
Chrome DevTools’da sayfayı açın, Performance panelinde kayıt başlatın, bir butona tıklayın, kaydı durdurun. Uzun görevler (50ms+) sarı bloklar olarak görünüyor. “Interaction” olaylarının süresine bakın.
Google Search Console’da CWV raporunu nasıl okuruyorum?
“Temel Web Verileri” raporunu açın. URL’leri “Zayıf”, “İyileştirme gerekiyor” ve “İyi” olarak gruplandırmış durumda. “Zayıf” URL’lere tıklayarak hangi metriğin sorun yarattığını görün. PageSpeed Insights’ta o URL’i test ederek doğrulayın.
CWV ne kadar sürede iyileşir?
Teknik değişiklikler uygulandıktan sonra Google’ın alan verisini güncellemesi 28 güne kadar sürebiliyor. CrUX verisi 28 günlük kayan pencere kullanıyor. Değişiklikleri uyguladıktan sonra Search Console’u bir ay sonra kontrol edin.
Yeni bir site için CWV raporu neden boş?
Alan verisi (CrUX) toplamak için yeterli Chrome kullanıcı trafiği gerekiyor. Düşük trafikli siteler için rapor boş görünüyor. Bu durumda PageSpeed Insights lab verisi ve Lighthouse tek referans.
CWV ile SEO arasındaki doğrudan ilişki ne kadar güçlü?
Google, CWV’yi “tiebreaker” olarak tanımlıyor: içerik eşdeğer olduğunda devreye giriyor. Ancak zayıf CWV, kullanıcı bounce oranını artırıyor ve bu da dolaylı yoldan sıralamayı etkiliyor. Etki hem doğrudan hem dolaylı.
Sonuç
Core Web Vitals artık “bakacağız zamanı gelince” kategorisinde bir konu değil. Hem doğrudan sıralama sinyali hem de dönüşüm oranı üzerindeki pratik etkisiyle düzenli takip ve optimizasyon gerektiriyor.
Üç maddede özetlemek gerekirse:
- LCP için görsel optimizasyonu ve kaynak önceliklendirmesi yapın; çoğu sorun buradan geliyor.
- INP için uzun JS görevlerini ve gereksiz üçüncü taraf scriptleri temizleyin.
- CLS için tüm görsellere boyut verin, font yüklemeyi ve reklam alanlarını yönetin.
Teknik SEO’nun diğer boyutlarını görmek için teknik SEO kontrol listesi iyi bir sonraki durak. JavaScript ağırlıklı bir site kuruyorsanız JavaScript SEO rehberi rendering kararlarında rehberlik edecek.
Sitenizin Core Web Vitals durumunu ücretsiz analiz etmek isterseniz SEO danışmanlığı teklifi alabilirsiniz.