Hızlı Özet (TL;DR)
Google’ın sıralama faktörü olarak kullandığı Core Web Vitals; sayfa hızını kullanıcı deneyimi odaklı üç temel metrikle ölçer: LCP (En Büyük İçerikli Boyama - Hız), INP (Sonraki Boyamayla Etkileşim - Tepkisellik) ve CLS (Kümülatif Düzen Kayması - Kararlılık). Yüksek puan almak için görsellere modern WebP/AVIF formatı ve sabit boyut atanmalı, kritik CSS satır içine alınmalı ve JavaScript ana iş parçacığı (Main Thread) blokajları temizlenmelidir.
3 Temel Core Web Vitals Metriği ve Hedef Değerler
Google tarafından “İyi” (Good) olarak kabul edilen eşik değerleri:
| Metrik | Anlamı | Odaklandığı Deneyim | İdeal Hedef | Kötü Değer |
|---|---|---|---|---|
| LCP (Largest Contentful Paint) | Ana görsel veya başlık metninin ekrana gelme süresi | Yükleme Hızı | < 2.5 Saniye | > 4.0 Saniye |
| INP (Interaction to Next Paint) | Kullanıcının tıklama veya dokunmasına sayfanın tepki süresi | Etkileşim Tepkiselliği | < 200 Milisaniye | > 500 Milisaniye |
| CLS (Cumulative Layout Shift) | Sayfa yüklenirken öğelerin beklenmedik şekilde kayması | Görsel Kararlılık | < 0.1 Puan | > 0.25 Puan |
LCP Optimizasyonu: En Büyük Bloğu Hızlandırma
Sayfanın LCP öğesi genellikle ana kahraman (hero) görseli veya büyük bir H1 başlığıdır:
- Görsel Ön Yükleme (Preload): Kahraman görseli tarayıcı HTML’i okurken derhal indirilmeye başlanmalıdır:
<link rel="preload" as="image" href="/img/hero.webp" fetchpriority="high" /> - Modern Formatlar: PNG ve JPEG yerine %70 daha hafif olan WebP veya AVIF kullanılmalıdır.
- Sunucu Yanıt Süresi (TTFB): Statik site üretimi (SSG) ve etkili CDN kullanımıyla sunucu yanıtı 200 ms altına çekilmelidir.
CLS Optimizasyonu: Düzen Kaymalarını Engelleme
Kullanıcı bir düğmeye basmak üzereyken yukarıdan yüklenen bir görsel veya reklam yüzünden düğmenin aşağı kayması en sinir bozucu kullanıcı deneyimidir.
- Tüm
<img>ve<iframe>etiketlerine kesinliklewidthveheightnitelikleri verilmelidir:<img src="/img/logo.webp" width="200" height="60" alt="Maysa Yazılım" /> - Yazı tiplerinde (Web Fonts)
font-display: swapkullanılırken yerel sistem fontlarıyla metrik uyumu (size-adjust) sağlanmalıdır.
Maksimum Google sıralaması ve ultra hızlı kullanıcı deneyimi sunan kurumsal siteler için Web Sayfası Tasarım hizmetimizi inceleyebilirsiniz.