Web Sitesi Hız Optimizasyonu: Core Web Vitals'ı Geçmek İçin Teknik Rehber

Hız Neden Hem SEO Hem Dönüşüm Meselesi?

Google'ın araştırması: Sayfa yükleme süresi 1 saniyeden 3 saniyeye çıktığında bounce rate (hemen çıkma oranı) %32 artıyor. 1'den 5'e çıktığında %90.

Etkilenen iki alan:

• SEO: Core Web Vitals sıralama faktörü, yavaş sayfa = düşük sıra — SEO hizmetlerimiz bu metrikleri optimize eder
• Dönüşüm: Her 1 saniyelik gecikme = %7 dönüşüm kaybı (Amazon araştırması) — web tasarım hizmetlerimiz hız odaklı geliştirme sunar

Ölçüm: Neyi Düzeltmeniz Gerektiğini Bulun

Google PageSpeed Insights (pagespeed.web.dev):

• "Lab Data" → Lighthouse simülasyonu
• "Field Data" → Gerçek kullanıcı verisı (CrUX)

Önemli: Yalnızca Lab Data'ya bakma. Field Data'daki CWV skorları Google'ın sıralamada kullandığı gerçek verilerdir.

LCP Optimizasyonu (Largest Contentful Paint)

Hedef: 2.5 saniye altı

1. Görsel Formatı

WebP formatı JPEG'den %25-35 daha küçük. AVIF ise WebP'den %20 daha küçük.

html <picture> <source srcset="hero.avif" type="image/avif"> <source srcset="hero.webp" type="image/webp"> <img src="hero.jpg" alt="..." width="1200" height="630"> </picture>

2. Hero Görseli Preload

LCP elementi genellikle hero görselidir. Tarayıcıya erken yüklemesini söyleyin: html <link rel="preload" as="image" href="hero.webp" fetchpriority="high">

3. TTFB İyileştirmesi (Time to First Byte)

• Hosting: Paylaşımlı hosting yerine VPS veya managed cloud (teknik SEO rehberimiz sunucu seçimini detaylandırır)
• CDN: Cloudflare ücretsiz planı bile TTFB'yi dramatik düşürür
• Server-side caching: Redis veya Varnish

CLS Düzeltme (Cumulative Layout Shift)

Hedef: 0.1 altı

Tüm görsellere boyut atayın: html <!-- Bu CLS yaratır ❌ --> <img src="photo.jpg" alt="...">

<!-- Bu CLS önler ✅ --> <img src="photo.jpg" alt="..." width="800" height="600">

Web fontları için space rezerve edin: css @font-face { font-family: 'CustomFont'; font-display: optional; / Fallback font kullan, layout shift yok / }

Reklam/widget alanları için sabit boyut: css .ad-container { min-height: 250px; / Reklam gelmeden önce alan rezerve / aspect-ratio: 728/90; }

INP Optimizasyonu (Interaction to Next Paint)

Hedef: 200ms altı

Long Tasks'ı kırın: Ana thread'i 50ms'den fazla bloke eden JavaScript görevleri INP'yi bozar. Chrome DevTools → Performance sekmesi → "Long Tasks" kırmızı gösterir.

Çözüm stratejileri:

• Code splitting: Büyük JS bundle'larını lazy load edin
• Web Workers: Ağır hesaplamaları ana thread dışına taşıyın
• Passive event listeners: Scroll/touch için {passive: true}

CDN Kurulumu

CDN (Content Delivery Network) içeriğinizi kullanıcıya en yakın sunucudan sunar.

Cloudflare (Ücretsiz Plan):

• cloudflare.com → Add Site → Domain girişi
• DNS kayıtlarını Cloudflare'e aktarın
• SSL/TLS → Full (Strict)
• Speed → Optimization → Auto Minify (JS/CSS/HTML)
• Caching → Cache Everything kuralı ekleyin

Sonuç: Türkiye içi TTFB genellikle 800ms → 80-120ms'ye düşer.

Sonuç

Site hız optimizasyonu, hem SEO hem dönüşüm oranı açısından en yüksek getirili teknik yatırımlardan biridir. Core Web Vitals metriklerini (LCP, CLS, INP) düzenli takip ederek performans düşüşlerini erken yakalayın. Cloudflare gibi ücretsiz CDN çözümleri bile TTFB'de dramatik iyileşme sağlayabilir — hiçbir bütçe kısıtlaması bu adımı atlamamak için bir mazeret oluşturmaz.

Optimizasyonu bir kerelik bir proje değil, sürekli bir süreç olarak düşünün. Her yeni özellik, plugin veya içerik güncellemesi sayfa hızını etkileyebilir. Aylık PageSpeed Insights kontrolü yaparak skordaki değişimleri izleyin ve gerileme olduğunda hızla müdahale edin. Küçük iyileştirmeler birikimli olarak büyük fark yaratır.