Frank

LCP, INP ve CLS Skorlarının Sıralamaya Doğrudan Etkisi

Web Sitesi Performans Optimizasyonu: Core Web Vitals ve SEO Etkisi

Google, Core Web Vitals'ı 2021'de sıralama sinyali olarak ilan etti. 2024 itibarıyla First Input Delay'in yerini Interaction to Next Paint (INP) aldı. 2026'ya geldiğimizde performans, kurumsal web sitelerinin SEO başarısının doğrudan belirleyicisi. Bu yazıda Core Web Vitals'ın üç metriğini, ölçüm yöntemlerini ve pratik optimizasyon tekniklerini ele alıyoruz.

LCP: Largest Contentful Paint

LCP, sayfanın en büyük görünür içerik öğesinin yüklenme süresini ölçer. İdeal eşik 2.5 saniye altıdır. Genellikle hero görsel, ürün görseli veya öne çıkan içerik bloku LCP elementi olur. Yüksek LCP'nin tipik nedenleri; optimize edilmemiş görseller, yavaş sunucu yanıt süresi, render bloklayıcı CSS ve JS kaynakları.

INP: Interaction to Next Paint

INP, kullanıcı bir etkileşim başlattığında (tıklama, dokunma, klavye girişi) tarayıcının bir sonraki görsel güncellemeyi yapma süresini ölçer. İdeal eşik 200ms altıdır. JavaScript ana iş parçacığını uzun süre bloklayan kodlar, ağır framework başlatmaları ve büyük üçüncü parti scriptler INP'yi olumsuz etkiler.

CLS: Cumulative Layout Shift

CLS, sayfa yüklenirken meydana gelen beklenmedik düzen kaymalarını ölçer. İdeal eşik 0.1 altıdır. Boyutsuz görseller, sonradan yüklenen reklamlar, geç yüklenen webfont'lar ve dinamik içerik enjeksiyonu CLS'yi yükseltir.

Ölçüm Araçları

PageSpeed Insights: Tek sayfa için saha (CrUX) ve laboratuvar (Lighthouse) verisini birlikte sunar. Hızlı analiz için ilk durak.

Lighthouse: Chrome DevTools içinde laboratuvar ortamında test sağlar. Geliştirme aşamasında kullanılır; gerçek kullanıcı verisini temsil etmez.

Chrome User Experience Report (CrUX): Chrome kullanıcılarından toplanan gerçek saha verisi. Google sıralama sinyali olarak bunu kullanır.

Web Vitals Chrome eklentisi: Geliştirme sırasında canlı ölçüm yapar.

Optimizasyon Teknikleri

LCP için: Hero görseli WebP veya AVIF formatında, doğru boyutta sun. CDN üzerinden dağıt. Render bloklayıcı CSS ve JS'i azalt; kritik CSS'i inline et. Sunucu yanıt süresini (TTFB) 200ms altında tut.

INP için: JavaScript ana iş parçacığını ayır. Uzun görevleri yieldToMain, requestIdleCallback gibi tekniklerle böl. Üçüncü parti scriptleri lazy yükle. React 18+ kullanıyorsanız useTransition ile non-urgent state güncellemelerini ayır.

CLS için: Görsellere width ve height öznitelikleri ver. Reklam alanlarına min-height tanımla. Web font'ları font-display: swap ile yükle ve fallback metrik eşleştirmesi yap.

Kurumsal Web Sitelerinde Tipik Sorunlar

Kurumsal web siteleri genellikle çoklu pazarlama ve analitik aracını taşır (GTM, Hotjar, GA, MarTech entegrasyonları). Bu üçüncü parti scriptler INP'yi en çok yoran kaynaklardır. Bunları lazy yüklemek, sadece gerektiğinde başlatmak ve sayfa yüklendikten sonra inisiyalize etmek; kritik bir adımdır.

Performans Bütçesi

Tasarım ve geliştirme süreçlerinin başında bir performans bütçesi tanımlamak; sonradan büyük yenileme maliyetlerinin önüne geçer. Tipik bir bütçe; sayfa boyutu 1.5 MB altı, sayfa başına 200 KB JavaScript, LCP 2.0 saniye altı, INP 150ms altı, CLS 0.05 altı. Bütçe aşıldığında geliştirme süreci durdurulur ve kaynak gözden geçirilir.

SEO Sıralamasına Etki

Core Web Vitals tek başına sıralama belirlemez; içerik kalitesi, backlink profili, teknik SEO sağlığı çok daha güçlü sinyallerdir. Ama eşik altı performans, diğer sinyalleri etkisiz kılar. Yüksek skor mecbur değildir; eşiklerin üstünde kalmak yeterlidir. Eşik altına düşmek, sıralamayı doğrudan aşağı çeker.

Sonuç

Core Web Vitals, kurumsal web sitelerinin SEO sağlığının ölçülebilir bileşenidir. Performansı sonradan optimize edilen bir konu olarak değil; tasarım brief'inin ilk satırından itibaren bir kısıt olarak ele almak gerekir. Performans bütçesi, doğru ölçüm araçları ve disiplinli optimizasyon teknikleri; uzun vadeli organik trafik için sürdürülebilir bir altyapı kurar.

Devamını oku