ULUSOY_DIGITAL
← Tüm Yazılar
SEO

Web Sitesi Hızlandırma: Core Web Vitals Optimizasyon Rehberi

Ulusoy Digital 20 April 2026 720 görüntülenme
Web Sitesi Hızlandırma: Core Web Vitals Optimizasyon Rehberi

Web sitesi hızı, hem kullanıcı deneyimi hem de SEO açısından kritik öneme sahiptir. Google'ın Core Web Vitals metrikleri, 2021'den beri arama sıralamalarını etkileyen faktörler arasında. Bu yazıda sitenizi nasıl hızlandıracağınızı öğreneceksiniz.

Core Web Vitals Nedir?

Core Web Vitals, Google'ın kullanıcı deneyimini ölçmek için belirlediği üç temel metriktir:

1. LCP (Largest Contentful Paint)

Sayfadaki en büyük içerik öğesinin ne kadar sürede yüklendiğini ölçer. Genellikle hero image veya ana başlık.

  • İyi: 2.5 saniye altı
  • İyileştirme gerekli: 2.5 - 4 saniye
  • Kötü: 4 saniye üstü

2. INP (Interaction to Next Paint)

Kullanıcı etkileşimlerine (tıklama, dokunma) verilen yanıt süresini ölçer. FID'nin yerini aldı.

  • İyi: 200ms altı
  • İyileştirme gerekli: 200 - 500ms
  • Kötü: 500ms üstü

3. CLS (Cumulative Layout Shift)

Sayfa yüklenirken içeriklerin ne kadar kaydığını ölçer. Beklenmedik layout değişiklikleri kötü kullanıcı deneyimi yaratır.

  • İyi: 0.1 altı
  • İyileştirme gerekli: 0.1 - 0.25
  • Kötü: 0.25 üstü

LCP Optimizasyonu

1. Görsel Optimizasyonu

  • WebP veya AVIF formatı kullanın (JPEG'den %25-50 daha küçük)
  • Lazy loading uygulayın (above-the-fold hariç)
  • Responsive images: srcset ile farklı boyutlar sunun
  • CDN kullanın (Cloudflare, BunnyCDN)

2. Server Response Time

  • TTFB (Time to First Byte) 200ms altında olmalı
  • Veritabanı sorgularını optimize edin
  • Redis veya Memcached ile cache kullanın
  • HTTP/2 veya HTTP/3 aktif edin

3. Critical CSS

Above-the-fold içerik için gereken CSS'i inline olarak ekleyin. Geri kalanı async yükleyin.

INP Optimizasyonu

1. JavaScript Optimizasyonu

  • Büyük JS dosyalarını parçalayın (code splitting)
  • Kullanılmayan JavaScript'i kaldırın (tree shaking)
  • Third-party scriptleri defer veya async ile yükleyin

2. Main Thread Optimizasyonu

  • Uzun görevleri (50ms+) parçalayın
  • Web Workers kullanarak ağır işlemleri ayrı thread'e alın
  • requestIdleCallback ile öncelik düşük işlemleri erteleyin

CLS Optimizasyonu

1. Görsel Boyutları Belirtin

Tüm img ve video elementlerine width ve height attribute'ları ekleyin:

<img src="photo.jpg" width="800" height="600" alt="...">

2. Font Loading

  • font-display: swap kullanın
  • Fontları preload edin
  • Sistem fontlarına fallback tanımlayın

3. Dinamik İçerik

  • Reklamlar için alan ayırın (placeholder)
  • Skeleton loading kullanın
  • İçerik eklerken push yerine overlay tercih edin

Test Araçları

  • PageSpeed Insights: Google'ın resmi aracı
  • Lighthouse: Chrome DevTools'ta yerleşik
  • WebPageTest: Detaylı waterfall analizi
  • GTmetrix: Performans raporları
  • Search Console: Gerçek kullanıcı verileri (CrUX)

Pratik Checklist

  1. Görselleri WebP'ye dönüştürün
  2. Gzip veya Brotli sıkıştırma aktif edin
  3. Browser caching ayarlayın (Cache-Control headers)
  4. CDN kullanın
  5. Kullanılmayan CSS/JS'i kaldırın
  6. Font preload ekleyin
  7. Lazy loading uygulayın
  8. Critical CSS inline yapın

Sonuç

Core Web Vitals optimizasyonu, hem kullanıcı deneyimini hem de SEO performansını artırır. Küçük iyileştirmeler bile büyük farklar yaratabilir. Google Search Console'dan sitenizin Core Web Vitals durumunu kontrol edin ve yukarıdaki adımları uygulayın.

Ulusoy Digital olarak geliştirdiğimiz tüm projelerde performans optimizasyonuna öncelik veriyoruz. Sitenizin hız analizi ve optimizasyonu için bizimle iletişime geçebilirsiniz.