Core Web Vitals ve Teknik SEO

Google'ın INP metriği 2024'te resmi Core Web Vitals standardı oldu; sayfa hızı ve etkileşim kalitesi artık doğrudan sıralama kriteri haline geldi.

Yazıyı sosyal medya hesaplarınızda paylaşın

INP Metriği ve Sayfa Hızının Sıralama Üzerindeki Etkisi

Web performansı, dijital pazarlama ve arama motoru optimizasyonunun en teknik — ama bir o kadar da kritik — boyutlarından birini oluşturuyor. Google, Core Web Vitals çerçevesini 2021 yılında hayata geçirdiğinde, sayfa deneyimini sıralama algoritmalarının resmi bir bileşeni olarak tanımladı. O tarihten bu yana metrikler evrim geçirdi ve en önemli gelişme, INP (Interaction to Next Paint) metriğinin Mart 2024 itibarıyla FID (First Input Delay)‘in yerini alarak resmi Core Web Vitals standardına dahil edilmesi oldu. Bu dönüşüm, teknik SEO alanında ciddi bir paradigma değişimine işaret ediyor: Artık yalnızca sayfanın ne kadar hızlı yüklendiği değil, kullanıcının her etkileşimine verilen yanıtın kalitesi de doğrudan ölçülüyor.

Core Web Vitals Nedir?

Core Web Vitals, Google’ın gerçek kullanıcı deneyimini sayısal olarak ölçmek amacıyla belirlediği üç temel performans metriğinden oluşur. Bu metrikler; yükleme hızını, görsel stabiliteyi ve etkileşim duyarlılığını kapsar.

LCP (Largest Contentful Paint) — Sayfanın görünür alanındaki en büyük içerik öğesinin (genellikle bir görsel ya da büyük bir metin bloğu) yüklenmesi için geçen süreyi ölçer. İyi bir LCP skoru 2,5 saniye veya altı olarak tanımlanır. 4 saniyenin üzerindeki değerler ise “Zayıf” kategorisine girer.

CLS (Cumulative Layout Shift) — Sayfa yüklendikten sonra öğelerin beklenmedik biçimde yer değiştirmesini ölçen görsel stabilite metriğidir. Kullanıcının tıklamak istediği bir butonun aniden kayması, yüksek CLS değerine yol açar. İdeal CLS skoru 0,1 veya altı olmalıdır.

INP (Interaction to Next Paint) — Kullanıcının sayfa ile gerçekleştirdiği tüm etkileşimlerin (tıklama, klavye girişi, dokunma) sonraki görsel güncellemeye yansıyana kadar geçen gecikmeyi ölçer. Bu metrik, Mart 2024 itibarıyla FID’in yerini almıştır ve 200 milisaniye veya altı iyi kabul edilir.

INP Metriği: FID’den Farkı ve Neden Daha Kapsamlı?

First Input Delay (FID), yalnızca kullanıcının sayfayla gerçekleştirdiği ilk etkileşimin işlenmeye başlamasındaki gecikmeyi ölçüyordu. Bu yöntem birkaç temel sorunu beraberinde getiriyordu: Kullanıcı sayfayla yüzlerce kez etkileşime girebilir, ancak FID yalnızca ilkini dikkate alırdı. Üstelik etkileşimin tamamlanma süresini değil, yalnızca başlangıç gecikmesini ölçerdi.

INP bu eksiklikleri giderecek biçimde tasarlandı. Sayfa ziyareti boyunca gerçekleştirilen tüm etkileşimleri izler ve en uzun yanıt süresini (aykırı değerler dışında) temel metrik olarak raporlar. Böylece bir sayfanın gerçek anlamda duyarlı olup olmadığı çok daha güvenilir biçimde ölçülmüş olur.

Bir INP değerini üç bileşen oluşturur:

  • Input Delay (Giriş Gecikmesi): Kullanıcının etkileşimi ile tarayıcının işlemeye başlaması arasındaki süre. Ana iş parçacığının (main thread) meşgul olması bu gecikmenin başlıca nedenidir.
  • Processing Time (İşleme Süresi): Olay işleyicilerinin (event handlers) çalıştırılması için geçen süre.
  • Presentation Delay (Sunum Gecikmesi): İşlemenin tamamlanması ile ekranın yenilenmesi arasındaki süre.

Bu üç bileşenin toplamı INP değerini oluşturur. 200 ms altı iyi, 200–500 ms arası iyileştirme gerektiriyor, 500 ms üzeri ise zayıf olarak değerlendirilir.

INP Skorunu Kötüleştiren Başlıca Faktörler

Uzun JavaScript görevleri (Long Tasks), INP’i bozan en yaygın nedendir. Ana iş parçacığını 50 milisaniyeden uzun süre meşgul eden her JavaScript görevi, bir “Long Task” olarak tanımlanır ve kullanıcı girişlerinin işlenmesini engeller. Büyük üçüncü taraf scriptler, ağır analitik kütüphaneleri ve optimize edilmemiş olay dinleyicileri bu kategoriye girer.

Render-Blocking Kaynaklar da kritik bir etkendir. CSS ve JavaScript dosyalarının senkron yüklenmesi, tarayıcının render sürecini durdurur; bu da hem LCP’yi hem de INP’i olumsuz etkiler.

React ve SPA Çerçevelerindeki Hidrasyon Süreci özellikle dikkat gerektiren bir alandır. Sunucu tarafında render edilen (SSR) React uygulamalarında hidrasyon aşaması, ana iş parçacığını uzun süre meşgul edebilir. Bu süreçte kullanıcı etkileşimleri kuyruğa alınır ve yanıt gecikmesi belirgin biçimde artar.

DOM Boyutu ve Karmaşıklığı da INP üzerinde doğrudan etkilidir. Binlerce düğüm içeren büyük DOM yapıları, stil hesaplamalarını ve layout işlemlerini yavaşlatır.

Sayfa Hızını Etkileyen Teknik Faktörler

Core Web Vitals’ın yalnızca INP’ten ibaret olmadığını hatırlatmak gerekir. LCP skoru, doğrudan sayfa yükleme hızıyla bağlantılıdır ve teknik SEO optimizasyonunun merkezinde yer alır.

Sunucu Yanıt Süresi (TTFB — Time to First Byte), tüm yükleme metriklerinin temelini oluşturur. Sunucunun ilk baytı göndermesi için geçen süre olan TTFB, 800 ms altı olmalıdır. CDN (Content Delivery Network) kullanımı, verimli önbellekleme stratejileri ve optimize edilmiş backend kodu bu süreyi doğrudan etkiler.

Görsel Optimizasyonu, LCP’nin iyileştirilmesinde en etkili adımlardan biridir. JPEG yerine WebP veya AVIF formatlarının kullanılması, görsel boyutunu %30–50 oranında düşürebilir. loading="lazy" niteliğiyle ekran dışı görsellerin ertelemeli yüklenmesi, ilk boyama süresini hızlandırır. Hero görsellerinin ise fetchpriority="high" ile önceliklendirilmesi LCP sürelerini doğrudan iyileştirir.

Kritik CSS İnlining tekniği, “above-the-fold” içeriğin stillerini doğrudan HTML içine yerleştirerek harici CSS dosyasının yüklenmesini beklemeden sayfanın görünür kısmının render edilmesini sağlar. Bu yöntem hem LCP hem de FCP (First Contentful Paint) üzerinde olumlu etki yaratır.

Font Optimizasyonu da göz ardı edilemez. Web fontları yüklenmeden önce görünen metin olmadığında FOIT (Flash of Invisible Text) sorunu ortaya çıkar. font-display: swap değerinin kullanılması ve font dosyalarının <link rel="preload"> ile önceden yüklenmesi bu sorunu giderir.

Google Search Console ve PageSpeed Insights ile Performans İzleme

Google, Core Web Vitals performansını ölçmek için iki temel araç sunar: Google Search Console (GSC) ve PageSpeed Insights (PSI).

Search Console’daki Core Web Vitals raporu, gerçek kullanıcı verilerine (CrUX — Chrome User Experience Report) dayanır. Bu rapor, URL’leri “İyi”, “İyileştirme Gerektiriyor” ve “Zayıf” kategorilerine ayırır; site genelinde hangi sayfaların öncelikli müdahale gerektirdiğini tespit etmeye yarar.

PageSpeed Insights ise hem laboratuvar verisi (Lighthouse simülasyonu) hem de gerçek dünya verisini bir arada sunar. Laboratuvar verisi tekrar edilebilir testler için idealdir; ancak gerçek kullanıcı davranışını yansıtmaz. Optimizasyon kararları için her iki veri kaynağının birlikte değerlendirilmesi gerekir.

Chrome DevTools’taki Performance paneli ve Web Vitals uzantısı, geliştiricilerin Long Task’ları, INP bileşenlerini ve render darboğazlarını düğüm düzeyinde incelemesine olanak tanır.

INP ve LCP Optimizasyonu İçin Pratik Stratejiler

JavaScript Kodu Bölme (Code Splitting): Webpack, Vite veya Next.js gibi modern build araçları, JavaScript bundle’ını rota bazında parçalara ayırmanıza olanak tanır. Kullanıcının yalnızca ihtiyaç duyduğu kodu indirmesi, hem ilk yükleme süresini hem de Long Task oluşumunu azaltır.

scheduler.postTask() ve requestIdleCallback(): Kritik olmayan JavaScript görevlerini tarayıcının boşta kaldığı anlara ertelemek, ana iş parçacığının etkileşim işleme kapasitesini artırır. Bu API’ler, INP optimizasyonunda güçlü bir araç olarak öne çıkar.

Üçüncü Taraf Script Yönetimi: Analitik, reklam ve sosyal medya scriptleri genellikle en büyük Long Task kaynaklarıdır. Bu scriptlerin async veya defer nitelikleriyle yüklenmesi, ana iş parçacığı üzerindeki baskıyı azaltır. <link rel="preconnect"> direktifiyle üçüncü taraf alan adlarına erken bağlantı kurulması da gecikmeleri düşürür.

Speculatve Loading API’leri: Google’ın tanıttığı Speculation Rules API, tarayıcının kullanıcının muhtemelen ziyaret edeceği sayfaları önceden yüklemesine (prefetch/prerender) imkân tanır. Bu yöntem özellikle e-ticaret ve haber siteleri için LCP sürelerini dramatik biçimde düşürebilir.

Bfcache (Back/Forward Cache) Uyumluluğu: Tarayıcının geri/ileri gezinme önbelleğiyle uyumlu olmayan sayfalar bu avantajdan yararlanamaz. unload olay dinleyicilerinin kaldırılması ve uygun Cache-Control başlıklarının ayarlanması bfcache uyumluluğunu artırır.

Core Web Vitals’ın SEO Sıralamalarına Etkisi

Google, Sayfa Deneyimi Güncellemesi (Page Experience Update) ile Core Web Vitals’ı resmi bir sıralama sinyali olarak tanımladı. Ancak bu metrikler, içerik kalitesi ve alaka düzeyi gibi güçlü sinyalleri nadiren geçersiz kılar. Öte yandan eşit koşullarda rekabet eden iki sayfa arasında belirleyici fark yaratabilir.

Özellikle rekabetçi nişlerde, benzer içerik kalitesine sahip sayfalar arasında iyi Core Web Vitals skorları görünürlük avantajı sağlar. Mobil aramalar açısından bu etki daha da belirgindir; zira Google, mobil-first indexing politikasıyla mobil deneyimi temel değerlendirme kriteri olarak konumlandırmıştır.

Bunun ötesinde performansın dolaylı SEO etkisi de göz ardı edilemez: Yavaş ve duyarsız sayfalar hemen çıkma oranını (bounce rate) artırır, oturum sürelerini kısaltır ve dönüşüm oranlarını düşürür. Bu davranışsal sinyaller de zaman içinde organik sıralamayı olumsuz etkiler.

Performans Artık Bir Tercih Değil, Zorunluluk

Core Web Vitals ve INP, teknik SEO’nun soyut bir detayı olmaktan çıkmış; kullanıcı deneyimi, arama görünürlüğü ve iş performansı üçgeninin merkezine yerleşmiştir. INP metriğinin devreye girmesiyle birlikte Google, “hızlı yüklenen ama etkileşimde yavaş kalan” sayfaların artık yeterince iyi olmadığını açıkça ortaya koymuştur.

Başarılı bir teknik SEO stratejisi; LCP için sunucu hızı, görsel optimizasyonu ve kritik kaynakların önceliklendirilmesini, INP için ise JavaScript mimarisinin yeniden gözden geçirilmesini, Long Task’ların elimine edilmesini ve etkileşim yanıt sürelerinin sürekli izlenmesini kapsamalıdır. Performans optimizasyonu artık yalnızca bir geliştirici görevi değil; SEO uzmanları, içerik ekipleri ve ürün yöneticilerinin birlikte sahiplenmesi gereken stratejik bir önceliktir.

Yazıyı sosyal medya hesaplarınızda paylaşın

bNET

bNET

Eğitimci, web tasarımcı, grafik tasarımcı...

Articles: 399