Core Web Vitals: Google'ın Sıralama Faktörü Artık Tartışmasız

2021’de Google, Core Web Vitals’ı resmi bir sıralama faktörü olarak duyurduğunda sektör karışmıştı. Birçok ajans “zaten optimize ediyoruz” dedi. Gerçekte ise çoğu site hâlâ yeşil alan göremiyordu. 2025’te bu metriklerin önemi daha da arttı — ve çoğu kurumsal site hâlâ yanlış şeyleri ölçüyor.

Üç Metrik, Üç Farklı Soru

LCP — Largest Contentful Paint

“Sayfa yüklendi” anı kullanıcıya göre ne zaman? LCP tam da bunu ölçüyor: en büyük görünür içerik öğesinin ekranda belirdiği an.

İyi eşik: 2.5 saniyenin altı.

En yaygın LCP tetikleyicisi hero görselleridir. Çözüm basit ama gözden kaçıyor: fetchpriority="high" özelliği.

<img
  src="/hero.webp"
  fetchpriority="high"
  decoding="async"
  alt="Hero görseli"
/>

Bu tek satır, LCP’yi ortalama 400-800ms iyileştirebilir.

CLS — Cumulative Layout Shift

Sayfa yüklenirken içerik “zıplıyor” mu? Fontlar yüklenince mi kayıyor? Bu her “kaymayı” puanlayan metriktir.

İyi eşik: 0.1’in altı.

Türkçe sitelerde en büyük CLS kaynağı: Google Fonts. font-display: swap kullanıyorsanız FOUT (Flash of Unstyled Text) kaçınılmaz. Çözüm: değişken fontlar + size-adjust descriptor.

@font-face {
  font-family: 'DMSans';
  src: url('/fonts/DMSans.woff2') format('woff2');
  font-display: optional; /* swap yerine optional, daha az CLS */
}

INP — Interaction to Next Paint

2024’te FID’in yerini alan INP, kullanıcı etkileşiminden sonra tarayıcının ne kadar sürede tepki verdiğini ölçüyor.

İyi eşik: 200ms’nin altı.

React uygulamalarında en büyük INP katili: büyük JavaScript bundle’ları ve senkron state güncellemeleri. startTransition ve Suspense bu sorunu ele almanın yerleşik yoludur.

import { startTransition } from 'react';

function SearchBar() {
  const [query, setQuery] = useState('');

  const handleChange = (e) => {
    // Acil: input'u güncelle
    setQuery(e.target.value);

    // Ertelenebilir: sonuçları filtrele
    startTransition(() => {
      setFilteredResults(filterData(e.target.value));
    });
  };
}

Gerçek Dünya: Bir Vaka Çalışması

Bir üretim şirketinin kurumsal sitesinde analiz yaptık. Başlangıç skorları:

Değişiklikler:

1. Hero görseli WebP’ye çevrildi, fetchpriority="high" eklendi
2. Google Fonts self-hosted’a taşındı
3. Above-the-fold CSS inline edildi
4. JavaScript bundle code-splitting ile 3’e bölündü

Sonuç: Organik trafik ilk 3 ayda %31 arttı.

Araçlar ve Takip

Metrik takibi için önerilen araç seti:

• PageSpeed Insights — anlık analiz
• Search Console → Core Web Vitals raporu — gerçek kullanıcı verileri (RUM)
• Chrome DevTools → Performance sekmesi — yerel hata ayıklama
• web-vitals npm paketi — üretimde RUM toplama

import { onLCP, onCLS, onINP } from 'web-vitals';

onLCP(console.log);
onCLS(console.log);
onINP(console.log);

Sonuç

Core Web Vitals bir checkbox listesi değil, kullanıcı deneyiminin sayısal yansıması. Google’ın sıralama algoritması her geçen gün bu metriklere daha fazla ağırlık veriyor. Yatırımı hak eden tek teknik SEO aksiyonu muhtemelen budur.

Sitenizin Core Web Vitals analizini SudoQ olarak ücretsiz yapıyoruz. İletişime geçin →