Hızlı özet
- Google hızı Core Web Vitals ile ölçer: LCP (yüklenme), INP (etkileşim) ve CLS (görsel kayma).
- Laboratuvar puanına değil, gerçek kullanıcı verisine (saha verisi) ve dönüşüm oranına odaklanın.
- Shopify mağazalarında en yaygın yavaşlık sebebi uygulama yığılması ve kalıntı kodlardır.
- Sayfanın en büyük ilk görseli (genellikle ana banner) tembel yüklenmemeli ve doğru boyutta olmalıdır.
- Takip kodlarını temaya elle eklemek yerine Shopify'ın yerleşik kanallarını ve müşteri olaylarını kullanın.
Core Web Vitals nedir?
Google, sayfa deneyimini üç temel metrikle ölçer. Bir sayfanın "iyi" sayılması için ziyaretçilerin en az %75'inin bu eşiklerin içinde kalması gerekir:
| Metrik | Neyi ölçer? | İyi | Kötü |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Sayfadaki en büyük içeriğin (genellikle ana görsel) yüklenme süresi | ≤ 2,5 sn | > 4 sn |
| INP (Interaction to Next Paint) | Tıklama ve dokunmalara sayfanın tepki süresi | ≤ 200 ms | > 500 ms |
| CLS (Cumulative Layout Shift) | Sayfa yüklenirken öğelerin kayma miktarı | ≤ 0,1 | > 0,25 |
Shopify hızınızı nasıl ölçersiniz?
- PageSpeed Insights: hem gerçek kullanıcı verisini (saha verisi, yeterli trafik varsa) hem laboratuvar testini gösterir. Ana sayfa, bir koleksiyon ve bir ürün sayfasını ayrı ayrı test edin.
- Search Console – Core Web Vitals raporu: sitenizdeki sayfa gruplarının mobil ve masaüstünde gerçek kullanıcı deneyimini gösterir.
- Shopify yönetim paneli: Shopify'ın analiz bölümündeki web performansı raporu, mağazanızın Core Web Vitals değerlerini zaman içinde izlemenizi sağlar.
Laboratuvar puanını 100 yapmak hedef değildir. Asıl hedef, gerçek kullanıcıların Core Web Vitals değerlerini "iyi" aralığa çekmek ve bunun dönüşüm oranına yansıdığını görmektir. Mobil trafiğiniz çoğunluktaysa önceliği mobile verin.
Shopify'ı yavaşlatan 10 sebep ve çözümleri
1. Uygulama yığılması
Her uygulama siteye kendi JavaScript ve CSS dosyalarını ekleyebilir. On beş uygulamalı bir mağazada sayfa, ürünü göstermeden önce onlarca dosya indirir. Çözüm: uygulamaları tek tek gözden geçirin; satışa katkısı ölçülemeyenleri kaldırın, aynı işi yapan uygulamaları birleştirin.
2. Silinen uygulamalardan kalan kodlar
Eski tip uygulamalar silindiğinde temaya ekledikleri kodlar kalabilir. Çözüm: tema kodunda artık kullanılmayan uygulamalara ait parçaları (snippet ve script çağrıları) tespit edip temizleyin; bunu temanın bir kopyası üzerinde yapın.
3. Büyük ve yanlış boyutlu görseller
Shopify görselleri CDN üzerinden ve tarayıcıya uygun formatta sunar, ama 4000 piksellik bir görseli 400 piksellik alanda göstermek yine de gereksiz yük demektir. Çözüm: temanın görselleri ekran boyutuna göre (srcset ile) sunduğundan emin olun ve yüklemeden önce görselleri makul boyuta getirin.
4. Ana görselin tembel yüklenmesi
Sayfanın ilk ekranındaki en büyük görsel (LCP öğesi) tembel yükleme (lazy load) ile işaretlenirse tarayıcı onu geç indirir ve LCP kötüleşir. Çözüm: ilk ekrandaki görsel hemen yüklenmeli, alttaki görseller tembel yüklenmelidir.
5. Ağır slider'lar ve otomatik oynayan videolar
Ana sayfanın en üstündeki çok slaytlı bannerlar ve otomatik oynayan videolar hem yüklemeyi hem etkileşimi yavaşlatır. Çözüm: ilk ekranda tek ve güçlü bir görsel kullanın; videoyu tıklayınca yüklenecek şekilde kurgulayın.
6. Fazla font
Birden fazla font ailesi ve çok sayıda ağırlık, metnin geç görünmesine ve kaymalara yol açar. Çözüm: en fazla iki font ailesi ve gerçekten kullandığınız ağırlıklarla sınırlı kalın.
7. Üçüncü taraf kodlar
Canlı destek, pop-up, ısı haritası ve yorum widget'ları sayfa açılır açılmaz yüklenirse etkileşim süresini (INP) bozar. Çözüm: bu araçları sayfa yüklendikten sonra veya kullanıcı etkileşimiyle yükleyin; gerçekten kullanmadıklarınızı kaldırın.
8. Temaya elle eklenmiş takip kodları
Pixel ve analitik kodlarını temaya elle eklemek hem hızı düşürür hem de Shopify'ın kendi entegrasyonlarıyla birlikte çalıştığında çift sayıma yol açar. Çözüm: Meta, Google ve diğer platformlar için Shopify'ın yerleşik satış kanallarını ve müşteri olaylarını (custom pixel) kullanın. Ölçümün doğru kurulup kurulmadığını Meta Conversion API rehberimizdeki testlerle kontrol edin.
9. Ağır veya eski tema
Çok sayıda bölüm ve animasyon içeren temalar ya da sayfa oluşturucu uygulamalar sayfaları ağırlaştırır. Çözüm: Online Store 2.0 uyumlu, hafif bir tema tercih edin; kullanılmayan bölümleri kaldırın.
10. Yerleşim kaymaları (CLS)
Boyutu belirtilmemiş görseller, sonradan beliren duyuru çubukları ve pop-up'lar sayfayı kaydırır; müşteri yanlış yere tıklar. Çözüm: görsellere genişlik ve yükseklik verin, banner ve pop-up'lar için yer ayırın.
Öncelikli iyileştirme planı
Hepsini aynı anda yapmaya çalışmayın. Bu sırayla ilerlemek, en büyük etkiyi en az riskle verir:
| Sıra | Ne yapılır? | Etkilediği metrik |
|---|---|---|
| 1 | Mevcut durumu ölçün (mobil, 3 sayfa türü) | — |
| 2 | Uygulama denetimi ve kalıntı kod temizliği | LCP, INP |
| 3 | İlk ekran: tek görsel, doğru boyut, tembel yükleme yok | LCP |
| 4 | Görsel boyutları ve alttaki görsellerin tembel yüklenmesi | LCP |
| 5 | Üçüncü taraf kodları erteleme, takip kodlarını yerleşik kanallara taşıma | INP |
| 6 | Font sadeleştirme, görsel boyutları ve ayrılmış alanlar | CLS, LCP |
| 7 | Yeniden ölçüm ve dönüşüm oranıyla karşılaştırma | — |
Her değişikliği temanın bir kopyasında yapıp test ettikten sonra yayına alın. Değişikliklerin ardından birkaç hafta saha verisini ve dönüşüm oranını izleyin; laboratuvar testleri anında, gerçek kullanıcı verisi ise zamanla güncellenir.
Hız, SEO ve dönüşüm ilişkisi
Hız, Google'ın sayfa deneyimi değerlendirmesinin bir parçasıdır; ama tek başına sizi üst sıraya taşımaz. Asıl etkisi dönüşümdedir: hızlı açılan ve kaymayan bir sayfa, reklamla ve organik aramayla kazandığınız ziyaretçinin daha büyük kısmını müşteriye çevirir. Shopify mağazanızın genel SEO'su için Shopify SEO rehberimize, dönüşüm optimizasyonunun tamamı için dönüşüm oranı rehberimize bakabilirsiniz.
Sıkça sorulan sorular
Shopify mağazam neden yavaş?
En yaygın sebepler; çok sayıda uygulama ve silinen uygulamalardan kalan kodlar, büyük ve yanlış boyutlu görseller, ilk ekrandaki ağır slider ve videolar, fazla font kullanımı ve sayfa açılır açılmaz yüklenen üçüncü taraf kodlardır. Shopify altyapısının kendisi genellikle sorun değildir.
Shopify için iyi bir PageSpeed puanı kaç olmalı?
Laboratuvar puanı yol göstericidir ama asıl hedef değildir. Önemli olan, gerçek kullanıcı verisinde LCP'nin 2,5 saniyenin, INP'nin 200 milisaniyenin ve CLS'nin 0,1'in altında kalmasıdır. Bu değerler Search Console'daki Core Web Vitals raporunda izlenebilir.
Uygulama silmek Shopify'ı hızlandırır mı?
Genellikle evet, özellikle siteye kod ekleyen uygulamalar için. Ancak bazı eski uygulamalar silindikten sonra da temada kod bırakabilir; bu kalıntıların temizlenmesi gerekir. Değişiklikleri temanın bir kopyasında yapıp test etmek riski azaltır.
Hız Google sıralamasını etkiler mi?
Evet, Core Web Vitals Google'ın sayfa deneyimi değerlendirmesinin bir parçasıdır. Ancak içerik ve alaka düzeyi sıralamada daha belirleyicidir. Hızın en büyük etkisi genellikle dönüşüm oranında görülür.
Shopify'da görselleri sıkıştırmam gerekir mi?
Shopify görselleri CDN üzerinden ve tarayıcıya uygun formatlarda sunar, ancak gereğinden çok büyük görseller yine de yük oluşturur. Görselleri gösterildikleri boyuta yakın yüklemek ve temanın ekran boyutuna göre farklı boyutlar sunduğundan emin olmak yeterlidir.
Hız optimizasyonu için tema değiştirmek gerekir mi?
Her zaman değil. Çoğu mağazada uygulama denetimi, görsel düzenlemesi ve üçüncü taraf kodların ertelenmesi büyük kazanç sağlar. Tema çok eski veya çok ağırsa, Online Store 2.0 uyumlu hafif bir temaya geçiş değerlendirilebilir.