E-Ticaret Core Web Vitals, bir çevrim içi mağazanın yüklenme hızı, kullanıcı etkileşimlerine verdiği tepki ve sayfa düzeninin görsel kararlılığı hakkında önemli performans verileri sunar.
Ürün görselleri, kategori filtreleri, kampanya alanları, reklam kodları, canlı destek araçları ve ödeme eklentileri e-ticaret sitelerini sıradan içerik sitelerinden daha karmaşık hale getirir. Bu nedenle teknik olarak çalışan bir mağaza, kullanıcı açısından hızlı ve rahat çalışan bir mağaza anlamına gelmeyebilir.
Başarılı bir E-Ticaret Core Web Vitals çalışması yalnızca PageSpeed Insights puanını yükseltmeye odaklanmaz. Asıl amaç; ziyaretçinin ürünü hızlı görmesini, filtreleri gecikmeden kullanmasını, sayfa kaymalarından etkilenmemesini ve satın alma sürecini kesintisiz tamamlamasını sağlamaktır.
Bu rehberde LCP, INP ve CLS metriklerini, saha verisi ile laboratuvar verisi arasındaki farkı ve e-ticaret sitelerinde uygulanabilecek dokuz etkili performans yöntemini inceleyeceğiz.
E-Ticaret Core Web Vitals Nedir?
E-Ticaret Core Web Vitals, çevrim içi mağazaların gerçek kullanıcı deneyimini üç temel metrik üzerinden değerlendiren performans yaklaşımıdır.
- LCP: Sayfadaki ana içeriğin ne kadar hızlı görüntülendiğini ölçer.
- INP: Sayfanın kullanıcı etkileşimlerine ne kadar hızlı yanıt verdiğini ölçer.
- CLS: Sayfa yüklenirken meydana gelen beklenmedik görsel kaymaları ölçer.
Google, bu metriklerin iyi seviyede olmasını kullanıcı deneyimi açısından tavsiye eder. Ancak Core Web Vitals değerleri tek başına yüksek sıralama garantisi sağlamaz. İçerik kalitesi, arama niyeti, teknik erişilebilirlik ve site güvenilirliği önemini korur.
E-ticaret sitelerinde performans sorunları özellikle şu sayfalarda görülebilir:
- Ana sayfa,
- Kategori sayfaları,
- Ürün detay sayfaları,
- Site içi arama sonuçları,
- Sepet sayfası,
- Ödeme adımları,
- Üyelik ve giriş ekranları.
E-Ticaret Core Web Vitals Metrikleri
| Metrik | Ölçtüğü alan | İyi değer |
|---|---|---|
| LCP | Yüklenme performansı | 2,5 saniye veya daha kısa |
| INP | Etkileşim hızı | 200 milisaniye veya daha kısa |
| CLS | Görsel kararlılık | 0,1 veya daha düşük |
İyi bir kullanıcı deneyimi için ilgili eşiklerin sayfa ziyaretlerinin en az yüzde 75’inde karşılanması hedeflenir.
E-Ticaret Core Web Vitals İçinde LCP Nedir?
Largest Contentful Paint, görünür ekrandaki en büyük içerik öğesinin yüklenme süresini ölçer.
E-ticaret sayfalarında LCP öğesi genellikle şunlardan biridir:
- Ana kampanya görseli,
- Ürün fotoğrafı,
- Kategori banner’ı,
- Büyük başlık alanı,
- Arka plan görseli,
- Öne çıkan ürün bölümü.
LCP sorunları çoğunlukla büyük görseller, yavaş sunucu yanıtı, oluşturmayı engelleyen CSS ve JavaScript dosyaları veya yanlış kaynak önceliklendirmesi nedeniyle oluşur.
E-Ticaret Core Web Vitals İçinde INP Nedir?
Interaction to Next Paint, kullanıcının tıklama, dokunma veya klavye etkileşimi sonrasında sayfanın yeni görüntüyü sunmasına kadar geçen süreyi değerlendirir.
Kötü INP deneyimi e-ticaret sitelerinde şu şekillerde hissedilebilir:
- Sepete ekle düğmesinin geç tepki vermesi,
- Ürün filtresinin donması,
- Varyant seçiminin gecikmesi,
- Mobil menünün yavaş açılması,
- Kupon kodunun geç uygulanması,
- Ödeme formunun yazarken takılması.
E-Ticaret Core Web Vitals İçinde CLS Nedir?
Cumulative Layout Shift, sayfa yüklenirken kullanıcı müdahalesi olmadan gerçekleşen beklenmedik düzen değişikliklerini ölçer.
Örneğin müşteri “Sepete Ekle” düğmesine basmak üzereyken sonradan yüklenen bir kampanya alanı düğmeyi aşağı kaydırıyorsa kötü bir CLS deneyimi oluşur.
Yaygın CLS nedenleri şunlardır:
- Boyutları tanımlanmamış görseller,
- Sonradan açılan reklam alanları,
- Geç yüklenen web fontları,
- Stok ve fiyat mesajlarının sonradan eklenmesi,
- Çerez bildirimlerinin içeriği itmesi,
- Üçüncü taraf uygulama bileşenleri.
E-Ticaret Core Web Vitals İçin 9 Etkili Yöntem
1. Ürün Görsellerini Optimize Edin
Ürün görselleri e-ticaret deneyiminin merkezindedir ancak performans sorunlarının da en yaygın kaynaklarından biridir.
- Görselleri görüntülenecek alana uygun boyutta yükleyin.
- WebP veya AVIF formatlarını değerlendirin.
- Kaliteyi bozmayacak sıkıştırma uygulayın.
- Mobil ve masaüstü için farklı boyutlar sunun.
- Görsellere genişlik ve yükseklik değerleri tanımlayın.
- Ekranın altındaki görsellerde tembel yükleme kullanın.
- LCP görselini tembel yüklemeye dahil etmeyin.
Ana ekranın üst kısmındaki büyük kampanya veya ürün görselinin erken yüklenmesi gerekir. Bu görselin JavaScript çalıştıktan sonra sayfaya eklenmesi LCP süresini uzatabilir.
2. LCP Öğesini Önceliklendirin
E-Ticaret Core Web Vitals çalışmalarında öncelikle sayfanın LCP öğesi belirlenmelidir.
Şunları kontrol edin:
- LCP görseli HTML içinde doğrudan bulunuyor mu?
- Görsel CSS arka planı olarak mı çağrılıyor?
- Kaynak tembel yükleme nedeniyle gecikiyor mu?
- Görsel farklı bir alan adından mı geliyor?
- Sunucu yanıt süresi yüksek mi?
- Gereksiz yönlendirme bulunuyor mu?
Gerekli durumlarda kritik görsel için ön yükleme veya yüksek kaynak önceliği kullanılabilir. Ancak bütün görselleri yüksek öncelikli yapmak ağ kaynaklarının birbirleriyle yarışmasına neden olabilir.
3. JavaScript Yükünü Azaltın
E-ticaret sitelerinde analiz, reklam, canlı destek, öneri sistemi, ödeme ve kişiselleştirme araçları çok sayıda JavaScript dosyası oluşturabilir.
- Kullanılmayan JavaScript dosyalarını kaldırın.
- Büyük kod paketlerini küçük parçalara ayırın.
- Gerekli olmayan modülleri geç yükleyin.
- Uzun görevleri daha kısa işlemlere bölün.
- Etiket yöneticisindeki eski kodları temizleyin.
- Aynı işlevi sağlayan birden fazla eklentiyi kaldırın.
- Üçüncü taraf kodların performans etkisini ölçün.
Ana iş parçacığını uzun süre meşgul eden kodlar, sepete ekleme ve filtreleme gibi kullanıcı işlemlerinin gecikmesine neden olabilir.
4. Ürün Filtrelerini ve Aramayı Hızlandırın
Kategori filtreleri, sıralama seçenekleri ve site içi arama özellikle geniş ürün kataloglarında INP sorununa yol açabilir.
- Filtre sorgularını veritabanı düzeyinde optimize edin.
- Sık kullanılan sonuçları önbelleğe alın.
- Her seçimde tüm sayfayı yeniden yüklemeyin.
- Gereksiz filtre seçeneklerini kaldırın.
- Arama isteklerinde kısa gecikmeli tetikleme kullanın.
- Sonuç beklenirken yükleme durumu gösterin.
- Mobil filtre panelini hafif tutun.
5. Görsel Kaymalarını Önleyin
CLS değerini azaltmanın en etkili yollarından biri, sonradan yüklenecek öğeler için sayfa düzeninde önceden alan ayırmaktır.
Şu bileşenlere genişlik, yükseklik veya minimum yükseklik tanımlayın:
- Ürün görselleri,
- Kampanya banner’ları,
- Reklam alanları,
- Önerilen ürün blokları,
- Canlı destek düğmeleri,
- Çerez bildirimleri,
- Stok mesajları,
- Yorum alanları.
6. Web Fontlarını Optimize Edin
Çok sayıda font ailesi ve ağırlığı yüklemek sayfayı yavaşlatabilir. Font geç yüklendiğinde metin biçimi değişerek görsel kaymaya neden olabilir.
- Gereksiz font ailelerini kaldırın.
- Yalnızca kullanılan ağırlıkları yükleyin.
- WOFF2 formatını kullanın.
- Kritik fontları kontrollü biçimde önceden yükleyin.
- Uygun sistem fontu yedeği tanımlayın.
- Font gösterim stratejisini test edin.
7. Önbellek ve CDN Kullanın
Önbellekleme, aynı kaynağın her ziyarette yeniden oluşturulmasını veya indirilmesini azaltır. CDN ise statik dosyaları kullanıcıya daha yakın sunuculardan dağıtır.
Önbelleğe alınabilecek kaynaklar:
- Ürün görselleri,
- CSS ve JavaScript dosyaları,
- Fontlar,
- Genel sayfa şablonları,
- Anonim kullanıcı sayfaları.
Sepet, ödeme ve kullanıcı hesabı sayfaları gelişigüzel önbelleğe alınmamalıdır. Yanlış ayarlar kullanıcı verilerinin karışmasına veya ödeme işlemlerinin bozulmasına neden olabilir.
Sunucu ve CDN maliyetlerini değerlendirirken Bulut Maliyetlerini Düşürme rehberimizi de inceleyebilirsiniz.
8. Üçüncü Taraf Kodları Denetleyin
Üçüncü taraf araçlar fark edilmeden site performansını düşürebilir.
Düzenli olarak şu kodları inceleyin:
- Reklam ve yeniden pazarlama etiketleri,
- Canlı destek sistemleri,
- Isı haritası araçları,
- Kişiselleştirme yazılımları,
- Sosyal medya bileşenleri,
- Yorum servisleri,
- Ödeme ve taksit modülleri,
- A/B test araçları.
Her aracın amacı, sahibi, veri toplama kapsamı ve performans etkisi belgelenmelidir.
9. Gerçek Kullanıcı Verilerini İzleyin
Bir geliştirme bilgisayarında alınan yüksek Lighthouse puanı, gerçek müşterilerin aynı deneyimi yaşadığını garanti etmez.
Başarılı bir E-Ticaret Core Web Vitals sürecinde şu araçlar birlikte kullanılmalıdır:
- Google Search Console,
- PageSpeed Insights,
- Chrome Kullanıcı Deneyimi Raporu,
- Lighthouse,
- Chrome DevTools,
- Gerçek Kullanıcı İzleme sistemleri,
- Sunucu performans kayıtları.
Özellikle mobil ürün ve kategori sayfaları ayrı izlenmelidir. Ana sayfanın iyi performans göstermesi bütün ürün şablonlarının iyi olduğu anlamına gelmez.
E-Ticaret Core Web Vitals Nasıl Ölçülür?
Google Search Console
Search Console benzer sayfaları URL grupları halinde değerlendirir ve mobil ile masaüstü sonuçlarını ayrı gösterir. Rapor, gerçek kullanıcı deneyimine dayanan son 28 günlük verileri kullanır. :contentReference[oaicite:1]{index=1}
PageSpeed Insights
Mevcut olduğunda saha verilerini ve laboratuvar analizini aynı ekranda sunar. Mobil ve masaüstü sonuçları ayrı değerlendirilmelidir.
Chrome DevTools
Uzun JavaScript görevlerini, ağ isteklerini, LCP öğesini ve görsel kaymaları ayrıntılı biçimde incelemeyi sağlar.
Lighthouse
Kontrollü koşullarda performans sorunlarını tespit etmek için kullanışlıdır. Ancak gerçek kullanıcı verisinin yerine geçmez.
Saha Verisi ile Laboratuvar Verisi Arasındaki Fark
| Özellik | Saha verisi | Laboratuvar verisi |
|---|---|---|
| Kaynak | Gerçek kullanıcı ziyaretleri | Simüle edilmiş test |
| Dönem | Son 28 günlük veriler | Testin yapıldığı an |
| Amaç | Gerçek deneyimi değerlendirmek | Teknik sorunları teşhis etmek |
| Değişkenlik | Cihaz ve bağlantıya göre değişir | Test koşullarına bağlıdır |
WordPress E-Ticaret Sitelerinde Dikkat Edilecekler
- Aynı görevi yapan birden fazla hız eklentisi kullanmayın.
- JavaScript erteleme ayarlarını ödeme sayfalarında test edin.
- Ürün varyantlarının çalışmasını kontrol edin.
- Sepet bileşenlerinin gereksiz sayfalarda yüklenmesini engelleyin.
- Eski geçici veritabanı kayıtlarını temizleyin.
- Görsel ölçülerini tema şablonlarına uygun hale getirin.
- Sayfa oluşturucuların gereksiz bileşenlerini kaldırın.
- Canlı sitede değişiklik yapmadan önce test ortamını kullanın.
E-Ticaret Core Web Vitals ve Satış Performansı
Yavaş veya kararsız bir sayfa, ziyaretçinin ürünleri incelemesini ve satın alma sürecini tamamlamasını zorlaştırabilir.
Performans iyileştirmeleri şu verilerle birlikte izlenebilir:
- Ürün sayfasından sepete ekleme oranı,
- Filtre kullanım oranı,
- Sepet terk oranı,
- Ödeme tamamlama oranı,
- Mobil dönüşüm oranı,
- Sayfa başına gelir,
- Tekrar satın alma oranı.
Sık Yapılan Core Web Vitals Hataları
- Yalnızca ana sayfayı test etmek,
- Masaüstü puanını mobil deneyim sanmak,
- LCP görselinde lazy loading kullanmak,
- Görsel boyutlarını tanımlamamak,
- Bütün JavaScript dosyalarını tek dosyada birleştirmek,
- Sepet ve ödeme sayfalarını yanlış önbelleğe almak,
- Üçüncü taraf kodları denetlememek,
- Yalnızca Lighthouse puanını takip etmek,
- Gerçek kullanıcı verisini dikkate almamak.
E-Ticaret Core Web Vitals Kontrol Listesi
| Kontrol maddesi | Durum |
|---|---|
| LCP değeri 2,5 saniye veya altında mı? | Evet / Hayır |
| INP değeri 200 milisaniye veya altında mı? | Evet / Hayır |
| CLS değeri 0,1 veya altında mı? | Evet / Hayır |
| LCP görseli lazy loading dışında mı? | Evet / Hayır |
| Görsel boyutları tanımlandı mı? | Evet / Hayır |
| Kullanılmayan JavaScript kaldırıldı mı? | Evet / Hayır |
| Filtre ve arama hızı ölçüldü mü? | Evet / Hayır |
| Üçüncü taraf kodlar denetlendi mi? | Evet / Hayır |
| Mobil ürün sayfaları test edildi mi? | Evet / Hayır |
| Sepet ve ödeme akışı kontrol edildi mi? | Evet / Hayır |
Güvenilir Kaynaklar
- Google Arama Merkezi Core Web Vitals Rehberi
- web.dev Web Vitals Rehberi
- Search Console Core Web Vitals Raporu
- PageSpeed Insights
Sık Sorulan Sorular
E-Ticaret Core Web Vitals nedir?
E-Ticaret Core Web Vitals, çevrim içi mağazaların yüklenme, etkileşim ve görsel kararlılık deneyimini LCP, INP ve CLS metrikleriyle değerlendiren performans yaklaşımıdır.
İyi LCP değeri kaç olmalıdır?
LCP değerinin 2,5 saniye veya daha kısa olması hedeflenmelidir.
İyi INP değeri kaç olmalıdır?
INP değerinin 200 milisaniye veya daha kısa olması iyi kabul edilir.
İyi CLS değeri kaç olmalıdır?
CLS değerinin 0,1 veya daha düşük olması hedeflenmelidir.
PageSpeed puanının 100 olması gerekli midir?
Hayır. Asıl amaç laboratuvar puanını kusursuz hale getirmek değil, gerçek kullanıcıların hızlı ve kararlı bir deneyim yaşamasını sağlamaktır.
LCP görseline lazy loading uygulanmalı mı?
Genellikle uygulanmamalıdır. Sayfanın üst kısmındaki LCP görselinin tembel yüklenmesi ana içeriğin geç görünmesine neden olabilir.
Core Web Vitals sonuçları ne zaman güncellenir?
Search Console saha verileri son 28 günlük kullanıcı deneyimine dayandığı için yapılan düzeltmelerin etkisi gecikmeli görülebilir.
E-Ticaret Core Web Vitals: Sonuç
E-Ticaret Core Web Vitals, yalnızca teknik SEO kontrolü değil, müşterinin alışveriş deneyimini doğrudan etkileyen bir performans yönetimi sürecidir.
Ürün görsellerini optimize etmek, LCP öğesini erken yüklemek, JavaScript yükünü azaltmak, filtreleri hızlandırmak ve görsel kaymaları önlemek önemli kazanımlar sağlar.
Kalıcı başarı için laboratuvar testleriyle gerçek kullanıcı verileri birlikte değerlendirilmelidir. Ana sayfa, kategori, ürün, sepet ve ödeme şablonları ayrı ayrı izlenmelidir.
Düzenli ölçüm ve kontrollü geliştirmeyle E-Ticaret Core Web Vitals değerleri iyileştirilebilir, mobil kullanıcı deneyimi güçlendirilebilir ve satın alma sürecindeki teknik engeller azaltılabilir.
