Site Hızlandırma ve Core Web Vitals Metrikleriyle Çalışma

2026 yılında arama sıralamalarındaki konumunuzu ve dönüşüm oranlarınızı iyileştirmek için şu Core Web Vitals değerlerini sağlamanız gerekir: LCP ≤ 2,5 sn, INP ≤ 200 ms ve CLS ≤ 0,1. Mevcut durumu PageSpeed Insights veya Google Search Console'daki "Temel Web Verileri" raporu aracılığıyla kontrol edebilirsiniz. Optimizasyon, render engellemelerini gidermeyi, kaynakların geç yüklenmesini ayarlamayı ve kullanıcı arayüzü öğelerinin boyutlarını sabitlemeyi gerektirir.

2026 yılında sıralama algoritmaları, eski FID'nin yerini alan arayüzün yanıt verebilirliğine (INP) özel vurgu yapmaktadır. Görsel yükleme hızlı olsa bile, düğmeler ve menüler kullanıcı eylemlerine gecikmeli yanıt veriyorsa site trafik kaybedebilir. Aşağıda sorunların teşhisi ve düzeltilmesine yönelik adım adım bir strateji sunulmaktadır.

Teşhis: Hız Doğru Şekilde Nasıl Ölçülür?

Yalnızca laboratuvar testlerine güvenmek yanlıştır. Eksiksiz bir denetim için gerçek kullanıcı verilerini (alan verileri) ve sentetik testleri birleştirmeniz gerekir.

Alan Verileri (Gerçek Kullanıcı Deneyimi)

Bu veriler, sitenin farklı ağ koşullarında ve farklı cihazlarda farklı kişilerde nasıl çalıştığını gösterir.

• Google Search Console (GSC): "Temel Web Verileri" bölümü. Eşik değerlerini geçen sayfaların yüzdesini gösterir. Bir sayfa "İyileştirme Gerekiyor" olarak işaretlenmişse, bu çalışma için bir önceliktir.
• CrUX Dashboard: Alan adına ilişkin geçmiş verileri analiz etmek için Google'ın halka açık aracı.

Laboratuvar Verileri (Sentetik Testler)

Sorunların teknik nedenlerini bulmaya yardımcı olur. Kontrollü bir ortamda çalıştırılır.

• PageSpeed Insights (PSI): 0 ila 100 arasında bir puan ve somut öneriler sunar. Zaman tasarrufu fırsatlarının belirtildiği "Performans verileri" sekmesine bakmak önemlidir.
• Chrome DevTools (Performance Paneli): Sayfa yükleme profilini kaydetmenize, ana iş parçacığındaki uzun görevleri (Long Tasks) görmenize ve INP'yi engelleyen komut dosyasını belirlemenize olanak tanır.
• Web Vitals Extension: Manuel test sırasında metrikleri gerçek zamanlı olarak görmenizi sağlayan tarayıcı uzantısı.

LCP (Largest Contentful Paint) İyileştirme Stratejisi

LCP, en büyük görünür öğenin (genellikle banner, ana görsel veya H1 başlığı) yükleme süresini ölçer. Amaç, kullanıcının içeriği 2,5 saniyeden daha hızlı görmesini sağlamaktır.

1. Ana Görselin Optimizasyonu:

   • Modern formatları kullanın: AVIF veya WebP. JPEG/PNG'ye kıyasla kalite kaybı olmadan daha iyi sıkıştırma sağlarlar.
   • LCP öğesi olan görsel için fetchpriority="high" özniteliğini belirtin. Bu, tarayıcıya kaynağın öncelikli olarak yüklenmesi gerektiğini bildirir.
   • LCP görseli için loading="lazy" kullanmayın. Burada tembel yükleme, kritik içeriğin yüklenmesini geciktirerek sadece zarar verir.

2. Kaynak Teslimatının Hızlandırılması:

   • Kaynakların kullanıcıya coğrafi olarak yakın bir sunucudan sunulması için CDN (Content Delivery Network) yapılandırın.
   • Sunucu yanıt süresini (TTFB) azaltın. Veritabanlarını optimize edin, sunucu tarafında önbellekleme kullanın ve protokolleri HTTP/3 veya en azından HTTP/2'ye yükseltin.

3. Kritik Kaynakların Ön Yüklenmesi:

   • Ana içeriğin görüntülenmesi için gerekliyse, yazı tipleri veya kritik stiller için <link rel="preload"> kullanın.

INP (Interaction to Next Paint) İyileştirme Stratejisi

INP, kullanıcı eylemi (tıklama, dokunma, tuşa basma) ile sonraki karenin çizilmesi arasındaki gecikmeyi gösterir. 200 ms'ye kadar olan sonuçlar iyi kabul edilir.

1. Uzun Görevlerin (Long Tasks) Parçalara Ayrılması:

   • Tarayıcının ana iş parçacığı, art arda 50 ms'den daha uzun süre bir komut dosyası yürütmeyle meşgul olmamalıdır. Bir görev 200 ms sürerse, kullanıcı bu süre boyunca sayfa ile etkileşime giremez.
   • Karmaşık hesaplamaları setTimeout, requestAnimationFrame veya scheduler.yield() kullanarak küçük parçalara bölün.

2. Kodun Web Worker'lara Taşınması:

   • Ağır hesaplamalar, JSON ayrıştırma veya veri işleme, arayüzden sorumlu ana iş parçacığını engellememek için arka plan iş parçacıklarında (Web Workers) gerçekleştirilmelidir.

3. Olay İşleyicilerinin Optimizasyonu:

   • click, input, keydown işleyicileri içindeki mantığı basitleştirin.
   • DOM özelliklerinin okunması ve yazılmasının aynı döngüde gerçekleştiği zorunlu senkron düzen (Layout Thrashing) durumlarından kaçının.

CLS (Cumulative Layout Shift) İyileştirme Stratejisi

CLS, görsel kararlılığı ölçer. İçerik kaymaları kullanıcıları rahatsız eder ve yanlış tıklamalara yol açar. Hedef değer 0,1'in altındadır.

1. Medya Öğelerinin Boyutlarının Sabitlenmesi:

   • <img> ve <video> etiketleri için her zaman width ve height özniteliklerini belirtin. Bu, tarayıcının görsel yüklenmeden önce yer ayırmasını sağlayarak metin kaymasını önler.
   • Reklam blokları ve gömülü iframe'ler için de minimum kapsayıcı boyutları belirleyin.

2. Yazı Tipi Yönetimi:

   • font-display: swap veya optional özelliğini kullanın. Bu, metnin hemen sistem yazı tipiyle gösterilmesine ve yüklendikten sonra özel yazı tipiyle değiştirilmesine olanak tanıyarak metnin kaybolmasını (FOIT) veya ani kaymaları önler.
   • İlk ekran için kritikse, web yazı tiplerini önceden yükleyin (<link rel="preload">).

3. Mevcut İçeriğin Üzerine İçerik Eklemekten Kaçının:

   • Banner'lar, açılır pencereler ve bildirimler, sayfa yüklendikten sonra ana içeriği aşağı itmemelidir. Ekleme gerekliyse, bunun için önceden yer ayırın.

Optimizasyon Araçlarının Karşılaştırmalı Tablosu

Optimizasyonda Sık Yapılan Hatalar

• PSI Önerilerine Körü Körüne Uymak: Tüm tavsiyeler aynı derecede önemli değildir. Küçük bir yazı tipi önbellekleme sorununu düzeltmek, ağır bir JavaScript paketini optimize etmekten daha az etki yaratabilir. Görevleri metrikler üzerindeki etkilerine göre önceliklendirin.
• Üçüncü Taraf Komut Dosyalarını Görmezden Gelmek: Sohbet widget'ları, haritalar, reklamlar ve analitik araçlar sıklıkla kötü INP ve CLS'nin başlıca sorumluları olur. Etiket yöneticilerini geç yükleme ile kullanın veya bunları kullanıcı etkileşiminden sonra yükleyin.
• İzleme Eksikliği: Optimizasyon tek seferlik bir eylem değildir. Yeni özellikler ve içerik performans göstergelerini kötüleştirebilir. GSC'de uyarılar ayarlayın veya Calibre ya da SpeedCurve gibi özel izleme hizmetlerini kullanın.

SSS

Hosting Core Web Vitals'ı etkiler mi? Evet, doğrudan etkiler. Yavaş bir sunucu TTFB'yi (Time to First Byte) artırır, bu da otomatik olarak LCP'yi kötüleştirir. HTTP/3 desteği ve SSD depolama birimleri içeren kaliteli bir hosting kullanımı, iyi performans için temel şarttır.

PageSpeed Insights'ta yeşil göstergelere (90–100 puan) ulaşmak gerekir mi? Hayır. Google sıralama için alan verilerini (CrUX) kullanır. Laboratuvar verileri (PSI'daki puanlar) teşhis amaçlıdır. Gerçek kullanıcılarınızın (GSC verilerine göre) iyi göstergeleri varsa, sentetik testteki düşük puan kritik değildir, ancak iyileştirmeye çalışmak faydalıdır.

Optimizasyon sonuçları ne kadar quickly görülür? Google Search Console'daki alan verileri yaklaşık 28 günlük bir gecikmeyle (kayan pencere) güncellenir. Laboratuvar değişiklikleri, düzeltmeler uygulandıktan hemen sonra görülür. Verilerin daha hızlı güncellenmesi için API Indexing veya GSC aracılığıyla sayfaların yeniden dizine eklenmesini talep edebilirsiniz.