Gerçek kullanıcıların Web Vitals'larını ölçen Rakuten 24, iyi bir Largest Contentful Paint'in (LCP) dönüşüm oranında %61,13 artış sağlayabileceğini de tespit etti.
Rakuten 24, hem çok uluslu hem de yerli tüketici ürünleri üreticileriyle işbirliği yaparak sağlık, içecek, evcil hayvan malzemeleri, bebek ürünleri ve daha pek çok günlük ihtiyaç ürünü sunan bir online mağazadır. Bu mağaza, internet hizmetlerinde dünya lideri olan ve Japonya'daki dijital pazar yeri platformunda en iyi performans gösterenler arasında yer alan Rakuten Group, Inc. tarafından sağlanmaktadır.
Web performansının kullanıcı deneyimi üzerindeki etkisini anlayan Rakuten 24 ekibi, Core Web Vitals ve diğer metrikleri sürekli olarak ölçmekte, optimize etmekte ve izlemektedir.
Sonuç olarak, kullanıcılarının% 75'inden fazlası iyi bir Largest Contentful Paint (LCP), İlk Giriş Gecikmesi (FID) ve İlk Zengin İçerikli Boyama (FCP) deneyimi yaşıyor. Ancak Cumulative Layout Shift (CLS) iyileştirmeleri üzerinde çalışmaya devam ediyorlar.
Ana sayfa verilerini analiz ettikten sonra Rakuten 24, iyi bir LCP puanının aşağıdakilere yol açabileceğini tespit etti:
- Dönüşüm oranında% 61,13'e varan artış.
- ziyaretçi başına gelirde% 26,09 artış elde etti.
- Ortalama sipariş değeri% 11,26 arttı.
- İyi bir FID puanı, dönüşüm oranında% 55,88'e varan bir artışa neden olabilir.
Core Web Vitals ile işletme metrikleri arasında daha fazla ilişki kurmak için Rakuten 24, Core Web Vitals ve ilgili metrikleri optimize etmeye odaklanan bir A/B testi de gerçekleştirdi ve aşağıdaki alanlarda iyileşme elde etti:
- ziyaretçi başına gelirde% 53,37 artış elde etti.
- dönüşüm oranında% 33,13 artış elde etti.
- Ortalama sipariş değeri% 15,20 arttı.
- Ortalama geçirilen sürede% 9,99.
- Çıkış oranında% 35,12 azalma.
Fırsatı öne çıkarın
Web performansını optimize etmek, kullanıcı deneyimini ve işletmenin büyümesini iyileştirmek için akıllıca bir yatırım olsa da Rakuten 24 ekibi, paydaşları Core Web Vitals'ı kullanmaya ve web performansına odaklanmaya ikna etmenin ne kadar zor olabileceğinin farkındadır. Şirket, paydaşların performans optimizasyonunun ne tür bir yatırım getirisi (YG) sağlayabileceğini tam olarak göstermenin, onları programa dahil etmenin en iyi yolu olduğuna inanıyor.
Nispeten yeni ve bağımsız bir hizmet olan Rakuten 24, bu zorlukla başa çıkmak için esneklik avantajından yararlandı. Ekip, bu örnek çalışmanın sonucunda gelecekte daha fazla veriye dayalı karar verebileceklerine, diğer geliştiricilerin çalışmalarının etkisini ölçmelerine ve paydaşlarını performansı iyileştirmenin yatırıma değer olduğuna ikna etmelerine yardımcı olacağına inanıyor. Bunu nasıl yaptıklarına bu yayından ulaşabilirsiniz.
JavaScript'i ve kaynakları optimize edin
- Oluşturmayı engelleyen kaynakları ortadan kaldırın.
- Kodu bölün ve dinamik
import()kullanın. - Tüm içeriği ayrı parçalara bölün ve sayfanın altındaki HTML dosyalarını yavaşça yükleyin.
- JavaScript'i isteğe bağlı olarak yürütün ve yükleyin.
<script>etiketlerinde async özelliğini kullanarak ve önemli kaynaklarla erken bağlantılar kurarak (dns-prefetch,preconnectvepreloadgibi kaynak ipuçları) yavaş JavaScript kaynaklarını tanımlayın ve yükleme sürecini optimize edin.- Kullanılmayan kodları kaldırın ve kodu küçültüp sıkıştırın.
- CDN kullanın.
- Workbox ile hizmet çalışanını kullanarak önbelleğe almayı kontrol edin.
Resimleri optimize edin
- Ekranın alt kısmındaki resimleri geç yükleyin.
- Resimleri bir CDN ile optimize edin, doğru boyutta resimler yayınlayın, resimleri sıkıştırın ve iş için doğru resim biçimlerini (WebP, SVG, Web yazı tipleri) kullanın.
CLS'yi optimize edin
- Resimler yüklenirken resimler için gereken alanı ayırmak üzere CSS'yi
aspect-ratiokullanın. - Öğeler yavaş yüklenirken düzen kaymalarını en aza indirmek için CSS'yi
min-heightkullanın.
Performans ölçümü
Ekip, web sitesini denetlemek için PageSpeed Insights'ı kullanmanın yanı sıra kullanıcıların sahada gerçekten ne yaşadığını öğrenmenin daha iyi bir yolunu bulmak istiyordu. Bu nedenle Rakuten 24, Önemli Web Verileri'ni ve alandaki diğer metrikleri ölçmek ve verileri şirket içi analiz aracına göndermek için web-vitals JavaScript kitaplığını kullanmaya karar verdi.
Performans analizi
Ekip, Core Web Vitals ile temel işletme metrikleri arasında herhangi bir korelasyon olup olmadığını belirlemek için toplanan alan verilerini analiz etti. Dönüşüm gerçekleştiren kullanıcıların, dönüşüm gerçekleştirmeyen kullanıcılara kıyasla daha iyi bir LCP deneyimi yaşama eğiliminde olduğunu tespit ettiler.
Toplanan veriler ayrıca şunları da ortaya koydu:
- İyi bir LCP, dönüşüm oranında% 61,13'e, ziyaretçi başına gelirde% 26,09'a ve ortalama sipariş değerinde% 11,26'ya varan artış sağlayabilir.
- İyi bir FID, genel ortalama verilere kıyasla dönüşüm oranında% 55,88'e varan bir artışa neden olabilir.
Performans izleme
Ekip, sahada toplanan verileri ve iş zekası aracını kullanarak bir performans izleme kontrol paneli oluşturdu. Bu, ilerlemeyi izlemek ve gerilemelerin önüne geçmek için önemlidir.
A/B testi
A/B testlerinin, performans optimizasyonlarının işletme üzerindeki etkisini ölçmenin iyi bir yolu olduğunu düşünen ekip, açılış sayfalarından birini Core Web Vitals için optimize etti ve ardından bir ay boyunca A/B testi aracılığıyla optimize edilmiş sürümü orijinal sayfayla karşılaştırdı. Testin anlamlı sonuçlar elde edebilmesi için önemli miktarda trafiğe ve dönüşüme sahip bir açılış sayfası seçtiler. Test süresi boyunca trafiğin% 50'si optimize edilmiş açılış sayfasına (A sürümü), %50'si ise orijinal sayfaya (B sürümü) gönderildi. A sürümü ile B sürümü arasındaki tek fark, A sürümünün Core Web Vitals için optimize edilmiş olmasıydı. İşlevsel veya görsel açıdan başka bir fark yoktu.
Optimize edilmiş A sürümü, mobil yükleme testinde 0,4 saniye daha erken yüklendi ve önemli bir düzen değişikliği göstermedi. A sürümünün CLS'si B sürümüne kıyasla% 92, 72 oranında iyileşti. Diğer Web Vitals puanları da iyileşti: İGG%7,95 oranında iyileşti, FCP%8,45 oranında iyileşti ve TTFB%18,03 oranında iyileşti.
Optimize edilmiş A sürümünü optimize edilmemiş B sürümüyle karşılaştıran Rakuten 24, A sürümünün şunları sağladığını tespit etti:
- Ziyaretçi başına gelirde% 53,37 artış.
- Dönüşüm oranında% 33,13 artış.
- Ortalama sipariş değerinde% 15,20 artış.
- Ortalama geçirilen sürede% 9,99 artış.
- Çıkış oranında% 35,12 azalma.
Sonuç
Web performansı optimizasyonu zor ancak ödüllendirici bir süreçtir. Veriye dayalı bir yaklaşım benimseyen Rakuten 24, hem daha iyi bir kullanıcı deneyimi sunmayı başardı hem de işletmesi üzerinde olumlu bir etki yarattığını ölçtü. Bu durumun hedef değil, yolculuğun bir parçası olduğunun farkında olan marka, online alışveriş yapanlara daha keyifli deneyimler sunmak için web sitesini iyileştirmeye devam edecek.
Optimizasyon ortak bir çaba gerektirir ve geliştiricilerin bu yolculukta yalnız olmaları gerekmez. Rakuten 24, yaşadıkları zorlukları ve başarılarını paylaşarak daha fazla geliştiricinin, paydaşlarla karşılıklı anlayış geliştirmek ve ardından yüksek kaliteli kullanıcı deneyimi ve işletme büyümesi için birlikte çalışmak amacıyla Core Web Vitals verilerini kullanabileceğini umuyor.