Hızlı web sitesi rehberi: Core Web Vitals nedir?
Core Web Vitals, Google'ın sayfa deneyimini ölçtüğü üç ölçüttür: LCP (en büyük içeriğin görünme süresi, iyi: 2,5 sn altı), INP (etkileşime tepki süresi, iyi: 200 ms altı) ve CLS (görsel kayma, iyi: 0,1 altı). En etkili iyileştirmeler görsel optimizasyonu, font yönetimi ve gereksiz betiklerin kaldırılmasıdır.
- LCP ≤ 2,5 sn
- INP ≤ 200 ms
- CLS ≤ 0,1
- Değerler ziyaretçilerin %75'inde tutturulmalı
Core Web Vitals nedir?
Core Web Vitals, Google'ın bir web sayfasının kullanıcıya sunduğu deneyimi ölçmek için kullandığı üç temel ölçüttür: yüklenme hızı, etkileşime tepki ve görsel kararlılık. Bu ölçütler Google'ın sıralama sinyallerinin bir parçasıdır ve Search Console'da gerçek kullanıcı verisiyle raporlanır.
| Ölçüt | Neyi ölçer? | İyi | Kötü |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Sayfadaki en büyük içeriğin görünme süresi | ≤ 2,5 sn | > 4 sn |
| INP (Interaction to Next Paint) | Tıklama ve dokunmalara tepki süresi | ≤ 200 ms | > 500 ms |
| CLS (Cumulative Layout Shift) | Yüklenirken sayfadaki kaymalar | ≤ 0,1 | > 0,25 |
Bir sayfanın "iyi" sayılması için bu değerlerin, ziyaretlerin en az %75'inde tutturulması gerekir (güncel eşikler: web.dev · Core Web Vitals). INP, Mart 2024'te eski FID ölçütünün yerini aldı.
Hız neden bu kadar önemli?
Hız hem kullanıcı hem de iş için önemlidir. Yavaş açılan sayfalarda ziyaretçilerin önemli bir kısmı içerik yüklenmeden ayrılır; reklamla gelen trafikte bu, doğrudan harcanan bütçe demektir. Arama tarafında ise sayfa deneyimi, benzer kalitedeki içerikler arasında fark yaratan sinyallerden biridir.
Siteler neden yavaşlar?
- Büyük ve optimize edilmemiş görseller: Telefonda 400 piksel genişliğinde gösterilen bir görselin 4000 piksel olarak indirilmesi.
- Fazla font: Her biri ayrı dosya olan beş-altı font ağırlığı ve harici font sunucusuna istek.
- Eklenti ve takip kodu yığını: Zamanla eklenen sohbet araçları, piksel kodları, kaydırıcılar.
- Tema ve sayfa oluşturucu kodu: Kullanılmayan yüzlerce kilobaytlık CSS ve JavaScript.
- Boyutu belirtilmemiş görsel ve reklam alanları: CLS'nin en yaygın sebebi.
En etkili 8 iyileştirme
- Görselleri WebP veya AVIF formatına çevirin, ekran boyutuna uygun
srcsetkullanın. - Sayfanın ilk görselini önceliklendirin (
fetchpriority="high"), diğerlerini tembel yükleyin. - Her görsel ve video için genişlik ve yükseklik belirtin; kayma olmasın.
- Fontları kendi sunucunuzdan yükleyin, yalnızca gerekli ağırlıkları ve karakter setlerini kullanın.
- Kullanılmayan eklenti ve takip kodlarını kaldırın, gerekenleri erteleyin.
- Videoları poster görseliyle ve yalnızca görünür olduklarında oynatın.
- Sıkıştırma ve uzun süreli önbellek başlıklarını açın, mümkünse CDN kullanın.
- Etkileşimleri yavaşlatan ağır JavaScript'i azaltın; basit işler için kütüphane yüklemeyin.
Kod tabanlı sitelerin avantajı
Hazır tema ve sayfa oluşturucularla kurulan siteler, kullanmadığınız özelliklerin kodunu da taşır. Elle kodlanmış bir sitede sayfa, yalnızca ihtiyaç duyduğu CSS ve JavaScript ile gelir. Bu sitenin kendisi de bu yaklaşımla hazırlandı: tek bir CSS dosyası, küçük bir JavaScript dosyası, kendi sunucusundan yüklenen fontlar ve görünür olunca oynayan videolar.
Nasıl ölçerim?
Gerçek kullanıcı verisi için Google Search Console'daki Core Web Vitals raporunu, tek sayfa testi için PageSpeed Insights'ı kullanın. Laboratuvar ölçümleri (Lighthouse) sorunları bulmak için; gerçek kullanıcı verisi ise sonucu değerlendirmek için kullanılmalıdır.
Sık sorulan sorular
PageSpeed puanım 100 olmalı mı?
Hayır. Puan bir laboratuvar tahminidir; asıl hedef, gerçek kullanıcı verisinde üç Core Web Vitals ölçütünün "iyi" aralıkta olmasıdır.
Hosting değiştirmek siteyi hızlandırır mı?
Sunucu yanıt süresi yavaşsa evet; ancak çoğu sitede asıl yük görseller, fontlar ve betiklerdir. Önce ölçün, sonra karar verin.
WordPress sitelerde Core Web Vitals iyileştirilebilir mi?
Evet. Eklenti temizliği, görsel dönüşümü ve önbellekleme ile belirgin iyileşme sağlanabilir.
