PageSpeed 90 Almak İçin Teknik Adımlar: Core Web Vitals 2026 Rehberi

Google PageSpeed Insights\'ta 90 üzeri skor almak, sitenizin Core Web Vitals testlerini geçtiği ve Google\'ın "iyi" kategorisinde değerlendirdiği anlamına geliyor. Bu skor hem kullanıcı deneyimini hem de organik sıralamayı doğrudan etkiliyor. Ancak 90+ skor teknik ayrıntılara dikkat edilmesi gereken bir hedef. Bu yazıda 2026 güncel yöntemlerle PageSpeed 90+ almanın adım adım teknik yolunu aktarıyoruz.

Core Web Vitals 2026: Ölçütler ve Hedefler

Google\'ın kullanıcı deneyimi ölçütleri:

• LCP (Largest Contentful Paint) — En büyük içerik öğesinin yüklenme süresi. Hedef: 2.5 saniye altı. Genellikle hero görseli veya büyük metin bloğu.
• INP (Interaction to Next Paint) — 2024\'te FID\'in yerini aldı. Kullanıcı etkileşimine (tıklama, dokunma) görsel yanıt süresi. Hedef: 200ms altı.
• CLS (Cumulative Layout Shift) — Sayfa yüklenirken düzen kayması ölçüsü. Hedef: 0.1 altı. Görüntü yerleşmeden kayma, geç yüklenen banner\'lar.

Üçü birden "iyi" ise Core Web Vitals testi geçiliyor. PageSpeed skoru bu metrikler dahil daha kapsamlı değerlendirme yapıyor.

Adım 1: Mevcut Durumu Teşhis Edin

Önce nerede durduğunuzu bilin:

• PageSpeed Insights (pagespeed.web.dev) — hem mobil hem masaüstü skoru görün
• GTmetrix — daha detaylı waterfall analizi, hangi kaynak ne kadar sürüyor
• WebPageTest — gerçek sunucu testi, farklı lokasyon seçimi, video kayıt
• Chrome DevTools Performance paneli — etkileşim gecikmeleri için

Teşhis olmadan optimizasyon kör uçuş. Hangi metrik en fazla puan kaybettiriyor? LCP mı CLS mi INP mı? Her birinin farklı çözüm yolu var.

Adım 2: Görüntü Optimizasyonu (En Büyük Kazanım)

Çoğu sitede hız sorununun %50-70\'i görüntülerden kaynaklanıyor:

• WebP formatı — JPEG\'e kıyasla ortalama %30-50 daha küçük, aynı kalite. Tüm modern tarayıcılar destekliyor.
• Boyutlandırma — 2000px genişliğinde görüntüyü 400px\'lik alanda kullanmak. Tarayıcı indiriyor ama 400px\'e küçültüyor — boşa 25 kat veri.
• Lazy loading — Ekran dışı görüntüler yalnızca kaydırılınca yükleniyor. loading="lazy" attribute yeterli.
• LCP görüntüsünü preload edin — <link rel="preload" as="image" href="hero.webp"> hero görüntüsünü önceden yüklüyor.
• Boyut attribute\'ları — Her img elementinde width ve height belirtin — CLS\'i önlüyor.

Adım 3: JavaScript Optimizasyonu (INP İçin Kritik)

• Defer ve async — Render-blocking script\'lere defer veya async ekleyin. defer: DOM hazır olunca çalışır. async: indirilince çalışır (sıra garantisi yok).
• Kullanılmayan JavaScript\'i kaldırın — DevTools Coverage aracı kullanılmayan kodu gösteriyor. Kullanılmayan kütüphane veya özellikler çıkarın.
• Code splitting — Büyük bundle\'ları parçalara bölün — kullanıcı o bölümü açınca yüklensin.
• Web Workers — Ağır hesaplama işlemlerini arka plana taşıyın — ana thread'i serbest bırakın.
• jQuery bağımlılığı — jQuery gerçekten gerekli mi? Modern Vanilla JS çoğu jQuery işlemini karşılıyor ve çok daha hafif.

Adım 4: CSS Optimizasyonu

• Kritik CSS satır içine alın — Above-the-fold içeriğin stillerini <style> etiketiyle HTML\'e gömin. İlk render için harici CSS isteği yok.
• Kullanılmayan CSS temizleme — PurgeCSS ile büyük CSS kütüphanelerinin (Bootstrap, Tailwind) kullanılmayan kurallarını çıkarın. Tipik kazanım: %60-80 boyut azalması.
• CSS minify — Boşluk, yorum ve gereksiz karakterleri kaldırın. Küçük ama ücretsiz kazanım.
• Font yükleme optimizasyonu — font-display: swap ile sistem fontu göster, asıl font hazır olunca değiştir. Google Fonts\'u self-hosted yapın — harici DNS bağlantısı ortadan kalkar.

Adım 5: Sunucu ve Altyapı Optimizasyonu

• Gzip / Brotli sıkıştırma — HTML, CSS, JS dosyaları sıkıştırılarak transfer edilmeli. Boyut %60-80 azalır. Sunucu yapılandırmasında aktif edilir.
• Browser cache — Statik dosyalar (CSS, JS, görüntü) için uzun cache süresi. Geri dönen ziyaretçi dosyaları yeniden indirmiyor.
• Statik HTML cache — Dinamik sayfaların HTML çıktısı cache\'leniyor. Veritabanı sorgusu olmadan doğrudan dosya sunuluyor.
• HTTP/2 veya HTTP/3 — Paralel bağlantı ve başlık sıkıştırma. Modern hosting\'lerde genellikle aktif.
• Sunucu lokasyonu — Türkiye hedefliyorsanız Türkiye\'deki sunucu TTFB\'yi düşürüyor.

Adım 6: CLS Düzeltme

CLS sorunları genellikle şu nedenden kaynaklanıyor:

• Boyutsuz görüntüler: width ve height attribute eksik → browser yer ayıramıyor → görüntü yüklenince düzen kayıyor
• Geç yüklenen banner veya reklam alanları: yer tutmayan konteyner → içerik gelince yukarı itiliyor
• Web fontlar: metin görünüyor, font yüklenince boyut değişiyor → font-display: swap ile azaltılabilir
• Dinamik içerik: API\'den gelen içerik → yer tutucu (skeleton) kullanın

Çözüm formülü: Her boyutlu öğeye boyutunu önceden söyleyin. Tarayıcı yer ayırabilirse düzen kaymaz.

90+ Skora Ne Zaman Ulaşırsınız?

Başlangıç skoruna göre yol haritası:

• Skor 60-80: genellikle 2-4 hafta çalışma ile 90+ mümkün (çoğunlukla görüntü ve cache sorunu)
• Skor 40-60: 4-8 hafta, hosting değişimi gerekebilir
• Skor 40 altı: 8-12 hafta, muhtemelen hosting + JavaScript + görüntü + CSS kapsamlı müdahale gerekiyor

Hız optimizasyonu tek seferlik değil. Yeni içerik, yeni eklenti veya güncelleme skoru düşürebilir. Aylık PageSpeed kontrolü önerilir.