Önce ölçün, hangi araç neyi söyler?

LCP, INP ve CLS’in resmî tanımları web.dev üzerinde yayınlanıyor. İki tür veri var: laboratuvar verisi, sayfayı kontrollü koşullarda çalıştırıp ölçüyor; hızlı geri bildirim veriyor ama gerçek kullanıcıyı temsil etmiyor. Saha verisi ise sitenizi gerçekten ziyaret eden kullanıcıların cihaz ve bağlantılarından toplanıyor.

Karar verirken saha verisine bakın, düzeltme yaparken laboratuvar verisiyle hızlı deneyin. İkisi çeliştiğinde saha verisi haklıdır.

Araç Veri tipi Ne için kullanılır
PageSpeed Insights Saha + laboratuvar Genel durum ve öneri listesi
Lighthouse Laboratuvar Düzeltme sonrası hızlı doğrulama
Search Console; Core Web Vitals Saha Sayfa grupları bazında sorun tespiti
Tarayıcı geliştirici araçları Laboratuvar Hangi kaynağın gecikmeye sebep olduğunu bulma

LCP, en büyük içeriğin görünme süresi

LCP, ekranın görünen kısmındaki en büyük öğenin ne zaman çizildiğini ölçüyor. Bu genelde bir kahraman görseli ya da büyük bir başlık oluyor. 2,5 saniyenin altı iyi, 4 saniyenin üstü kötü kabul ediliyor.

LCP’yi bozan en yaygın üç sebep: gereğinden büyük görseller, geç yüklenen yazı tipleri ve sayfayı bloklayan stil dosyaları.

  • Kahraman görselini WebP formatına çevirin ve gerçek görüntülenme boyutuna küçültün
  • Ekranın üst kısmındaki görsele lazy loading uygulamayın; o görsel hemen gerekli
  • Yazı tiplerini font-display: swap ile yükleyin, metin beklemeden görünsün
  • Kullanılmayan CSS ve JS dosyalarını sayfadan çıkarın
  • Sunucu yanıt süresini 200 ms altında tutun; gerekirse önbellekleme ekleyin

INP, tıklamaya verilen yanıt süresi

INP, kullanıcı bir şeye dokunduğunda arayüzün ne kadar sürede tepki verdiğini ölçüyor ve 2024’te eski FID metriğinin yerini aldı. 200 milisaniyenin altı iyi sayılıyor. Buradaki sorun neredeyse her zaman JavaScript: ana iş parçacığını uzun süre meşgul eden betikler, kullanıcı dokunduğunda tarayıcının cevap vermesini geciktiriyor.

  • Kritik olmayan betikleri defer ile yükleyin
  • Üçüncü taraf eklentileri gözden geçirin; çoğu sitede en büyük yük buradan geliyor
  • Uzun süren işlemleri parçalara bölün
  • Kaydırma ve fare olaylarını gereksiz sıklıkta dinlemeyin

CLS, sayfanın zıplaması

Okumaya başladığınız metnin bir anda aşağı kayması ve yanlış butona basmanız CLS sorunudur. 0,1’in altı iyi kabul ediliyor. Sebebi genelde boyutu belirtilmemiş görseller, sonradan yüklenen reklam alanları ve geç gelen yazı tipleri.

  1. 1 Görsellere boyut verin

    Her img etiketine width ve height yazın; tarayıcı yeri baştan ayırsın.
  2. 2 Dinamik alanlara yer ayırın

    Reklam, video gömme ve bildirim çubukları için sabit yükseklik tanımlayın.
  3. 3 Yazı tipi geçişini yumuşatın

    Yedek yazı tipini benzer ölçüde seçin ki değişimde satırlar kaymasın.
  4. 4 İçeriği yukarıdan eklemeyin

    Mevcut içeriğin üstüne sonradan öğe eklemek en büyük kaymaya sebep olur.

Görsellerde en hızlı kazanç sizi bekliyor

Çoğu sitede toplam sayfa ağırlığının yarıdan fazlası görsellerden geliyor ve bu alan aynı zamanda en kolay düzeltilen yer. 3000 piksel genişliğinde bir fotoğrafı 400 piksellik bir alanda göstermek, gereksiz yere sekiz kat fazla veri indirmek demek.

Uygulaması basit üç kural var: gerçek görüntülenme boyutuna küçültün, WebP kullanın, ekranın altında kalan görselleri gecikmeli yükleyin.

Sunucu ve altyapı tarafı

İstemci tarafında ne kadar iyileştirme yaparsanız yapın, sunucu ilk baytı geç gönderiyorsa hepsi geç başlıyor. Metin sıkıştırma (gzip veya brotli), tarayıcı önbelleği ve yeterli kaynak, hız çalışmasının görünmeyen ama en belirleyici kısmı. Barındırma tarafını biz üstleniyoruz; ayrıntısı hosting ve sunucu hizmetimizde.

  • HTML, CSS ve JS için metin sıkıştırma açık olmalı
  • Statik dosyalara uzun önbellek süresi tanımlanmalı
  • HTTP/2 veya HTTP/3 kullanılmalı
  • Hedef kitleye coğrafi olarak yakın bir sunucu seçilmeli

Hız çalışması sıralamayı ne kadar etkiler?

Core Web Vitals bir sıralama sinyali, ama tek başına içeriğin önüne geçen bir sinyal değil. İçeriği zayıf hızlı bir sayfa, içeriği güçlü yavaş bir sayfayı geçmiyor. Buna karşılık benzer güçteki iki sayfa arasında hız belirleyici olabiliyor.

Asıl kazanç kullanıcı tarafında: hızlı açılan sayfada terk oranı düşüyor, form tamamlama artıyor. Yani hız çalışması hem sıralamayı hem dönüşümü birlikte iyileştiriyor. Teknik denetim ve sıralama tarafını SEO hizmetimizde birlikte yürütüyoruz.

Nereden başlamalı?

Sırayla ilerleyin: önce ölçün, sonra en büyük kaybı veren tek şeyi düzeltin, tekrar ölçün. Aynı anda beş değişiklik yapıldığında hangisinin işe yaradığı asla anlaşılmıyor. Sitenizin mevcut durumunu birlikte incelememizi isterseniz bize yazın; ücretsiz bir hız değerlendirmesi çıkarıyoruz.