E-ticaret Açılış Sayfalarınızın A/B Testlerini Nasıl ve Neden Oluşturmalısınız?

Uzun zaman önce, Chicago'nun ana alışveriş caddesi Michigan Bulvarı'nda ilk kez yürüdüğümde, birden fazla mağazanın vitrinlerine hayran kaldığımı hatırlıyorum. Nike mağazası Michael Jordan'a büyük bir övgüydü, FAO Schwarz oyuncak mağazası muhteşem bir mini eğlence parkıydı vb. İçeri girdiniz ve sadece deneyimden bir hatıra almak için yanınıza bir şeyler aldınız.

Çevrimiçi mağazanızdaki fiziksel mağaza penceresinin eşdeğeri, Açılış Sayfanızdır. Bir açılış sayfası, web sitenizin çok önemli bir sayfasıdır: çoğu durumda, bir ziyaretçinin bir Google araması yaptıktan veya blogunuzdaki bir gönderiyi okuduktan sonra göreceği ilk sayfadır.

İnsanlar genellikle açılış sayfasının web sitenizin ana sayfası olduğunu ve bu nedenle yalnızca bir tane olduğunu düşünür. Hiçbir şey gerçeklerden daha uzak olamazdı. Bu tür sayfalar, web sitemize giriş noktaları olarak tasarladığımız sayfalardır. Ziyaretçinin dikkatini çeken, onları sitemizde tutan ve alışveriş deneyimini başlatan şeydir. Örneğin, Nelio web sitemizde Nelio A/B Testini göstermemiz gereken bazı açılış sayfaları şunlardır:

• Nelio A/B Testing'in ana sayfası
• İşletmeniz için Nelio A/B Testi
• E-ticaret için Nelio A/B Testi
• vb

Bu sayfaların her biri, ürünümüzle ilgilenebilecek farklı profil türlerine yanıt vermek için ürünümüzü biraz farklı bir perspektiften sunar. Bu nedenle, örneğin, bir e-ticaretin açılış sayfası, e-ticareti olan web sitelerinin özelliklerini veya işlevlerini vurgular. Potansiyel müşterileri dönüştürmek amacıyla oluşturulurlar. İşte bu nedenle bu sayfalardaki asıl amacınız dönüşüm oranınızı optimize etmektir.

Bu gönderide, bir açılış sayfasının temel özelliklerini ve dönüşüm oranlarını iyileştirmeye yönelik en iyi uygulamaları göreceğiz.

Bir E-ticaret Açılış Sayfasının Özellikleri

Daha önce gördüğünüz gibi, bir e-ticaret açılış sayfası, özellikle pazarlama amacıyla oluşturulmuş bağımsız bir web sayfasıdır. Bir ziyaretçinin, bir reklamdan, bir arama motoru sonucundan veya bir promosyon kampanyasından bir bağlantıya tıkladığında "bulunduğu" sayfadır.

Bir açılış sayfasının amacı, müşterilerin belirli bir işlemi tamamlamasını sağlamaktır; bu, bir e-ticaret söz konusu olduğunda esas olarak bir satın alma yapmaktır. Bir açılış sayfasının web'de sahip olabileceğiniz diğer sayfalardan temel farklarından biri, bir yandan belirli bir ziyaretçi profiline uyacak şekilde özelleştirilmesidir: başlıklar, metinler, resimler ve referanslar o profile özeldir, bu nedenle bu profile sahip birinin satın almaya teşvik edilmesi. Öte yandan, bir açılış sayfası her zaman bir veya daha fazla harekete geçirici mesaj içerir.

Örneğin, bir kişi e-ticaretinde dönüşüm oranını nasıl optimize edeceğini araştırırsa ve farklı sonuçları gördükten sonra e-ticaret için Nelio A/B Testi bağlantısını tıklarsa (yukarıdaki resimde kısmi bir ekran görüntüsü görebilirsiniz) ), sayfaya geldiklerinde aramayla eşleşen bir başlık görecekler, bir mağaza resmi ve onları A/B testleri oluşturmaya başlamaya davet eden bir metin ve harekete geçirici mesaj bulacaklar. Sayfa ayrıca, mağazalarındaki ürünlerin sunumunu nasıl optimize edebileceklerini açıklar ve ziyaretçiye daha fazla güven vermek için bir referans içerir. Son olarak, veriler sayesinde satışları nasıl artırabileceklerini açıklayan birkaç bölüm ve tabii ki bize neden güvenebileceklerine dair ek bilgiler var.

Yukarıdaki örnekte görebileceğiniz gibi, herhangi bir açılış sayfasının amacı, potansiyel alıcının tam olarak aradıklarını saniyeler içinde bulmasıdır. Sayfanın içeriği, önemli ürün özellikleri de dahil olmak üzere (yine belirli bir hedef kitle düşünülerek yazılmış), güven katan ve ziyaretçinin satın almasını kolaylaştıran alıcı kişiliğine göre uyarlanmıştır.

Farklı açılış sayfalarına sahip olmanın en büyük avantajı, belirli müşterileri çok daha iyi hedefleyebilmenizdir . Tasarım, değer önerisi ve harekete geçirici mesaj, bir pazar segmentine çok daha uygun hale getirilebilir.

Bir Açılış Sayfasında Neden ve Hangi Testleri Oluşturmalıyım?

Yukarıda bahsedilen özellikleri basitçe uygulamak yerine neden A/B testinin zahmetine girdiğinizi merak edebilirsiniz. Bir şey, kullanıcılarınızın dönüşümünü iyileştireceğine inanabileceğiniz bir şey ve çok farklı bir şey, web sitenizde gerçekte olan şeydir. Neyin işe yarayıp neyin yaramadığını kontrol etmenin tek yolu A/B testleri yapmaktır.

Bildiğiniz gibi, bir A/B testi bir iyileştirme hipotezi ile başlar (örneğin, belirli ilgili bilgileri daha iyi görüntülemek için Açılış Sayfasının yeniden dağıtılmasının daha fazla dönüşüme yol açacağını düşünebiliriz), hipotezi bir varyantta uygular, ve bu varyantın orijinal sayfanızdan daha iyi performans gösterip göstermediğini test eder. Teknik olarak, A/B testi ziyaretçilerinizin her birine bir varyantı veya diğerini gösterecek, ne yaptıklarını takip edecek ve hangisinin (varsa) en iyi olduğunu belirleyecektir.

Bu, sitenize uyguladığınız herhangi bir değişikliğin daha iyi bir dönüşüm oranına sahip olacağını garanti eder, çünkü söz konusu değişikliğin gerçek bir iyileştirme olup olmadığını gerçek verilerle doğruladınız.

Bir örnekle göstereceğim gibi, bir A/B testinde elde edilen sonuçların beklenenlerden farklı olabileceğini ve bu nedenle bunları gerçekleştirmenin çok önemli olduğunu unutmayın. Ayrıca, A/B testleri sürekli olarak yapılmalı ve dönüşüm oranı optimizasyon süreci veya CRO olarak bilinen sürecin bir parçası olmalıdır.

Web sitenizin açılış sayfalarında kullanmaya başlayabileceğiniz en iyi uygulamalardan bazılarına göz atalım.

Sayfayı Basitleştirin

Bir açılış sayfası basit ve takip etmesi kolay olmalıdır. Ziyaretçinin çok fazla metinle boğulmadığından veya kaybolmadığından ve “Şimdi Satın Al” düğmesini bulamadığından emin olun. Sayfayı basitleştirmek için bazı ipuçları:

• Kısa ve öz başlıkları göster
• Net ve görünür harekete geçirici mesajlar görüntüleyin
• Ödeme sayfasına yönlendirmeyen gezinme bağlantılarını ortadan kaldırın
• Ürün ayrıntılarını madde işaretleri ile göster
• Yalnızca temel bilgileri gösteren metni küçültün

Bir açılış sayfasını, üzerinde kalmaya veya daha iyi bir şey bulmaya karar vermek için hızlı bir bakış attığınız bir sayfa olarak düşünün. Gereksiz metinlerden kaçının ve kendinizi ziyaretçiye değer katan şeyleri yanıtlamakla sınırlayın.

Teori iyi olsa da, en önemli şey, sayfanızda oluşturduğunuz sadeleştirmenin gerçekten de ziyaretçilerinizin tercih ettiğini doğrulayan A/B testi oluşturmaktır. Örneğin, Nelio Software ana sayfamızı basitleştirmek istedik ve bunun bir A/B testi oluşturduk. Amacımız, dönüşümü artırmak için daha basit, daha görsel ve daha özlü bir alternatif versiyon tasarlamaktı.

• 
  

• 
  

Testi çalıştırdık ve şaşırtıcı bir şekilde yarattığımız yeni varyant, dönüşümü iyileştirmek için daha iyi bir çözüm değildi. Test etmemiş olsaydık, daha iyi olduğunu düşündüğümüz ama aslında olmayan bir sayfa uygulardık. Yaptığımız A/B testinin detaylarını bu yazımızda bulacaksınız.

Ancak aşağıdaki resimde görebileceğiniz gibi, burada durmadık ve Nelio'nun ana sayfamızın farklı türevlerini test etmeye devam ettik. Bu yazıyı yazarken ana sayfamızın tasarımı önceki tekliflerden çok farklı: daha açık, daha basit ve daha düzenli. Ve daha iyi performans gösteriyor!

• 

• 

• 

• 

Açılış Sayfanızın İlk Katlaması

Açılış sayfanızın ilk katı en önemli bölümdür. O sayfaya gelen her ziyaretçinin göreceği ilk şey budur. Web sitenize göz atmaya devam etmeleri, daha fazlasını görmek için aşağı kaydırmaları veya iki saniyeden kısa sürede Google arama motoruna kaçmaları buna bağlıdır.

Ne yazık ki, bu ilk kattaki tüm bilgilere sahip olamazsınız: oraya ne koyacağınızı dikkatlice seçmelisiniz. Bir ziyaretçiye söylemeniz gereken en önemli bilgi nedir? İlk sayfanın A/B testi oluşturmak, web sitenizin dönüşümünü iyileştirmede büyük bir etkiye sahip olabilir.

Örneğin, ürünün açıklandığı ve dönüşüm hedefi kullanıcının ürün fiyatlandırma sayfasını ziyaret etmesini sağlamak olan Nelio A/B Testi açılış sayfasında, ilk sayfasının farklı sürümlerini test ettik. Her iki sürümü de karşılaştırmak için bloğun üzerine gelin ve kaydırıcıyı hareket ettirin:

Varyasyonda başlığı değiştirdik ve logoda zaten görünen ürün adı yerine ziyaretçinin merakını uyandıracak bir mesaj ekledik. Farklı bir renk mi? Düğmeler için farklı bir şekil mi? Hepsi için alternatif bir yer mi?

Bunu takiben, altyazıyı meraklarını giderecek bir çözüme sahip olduğumuzu gösteren bir şeyle değiştirdik: "Kitlenizin en çok neyi sevdiğini keşfetmek ve dönüşümlerinizi geliştirmek için WordPress'inizin farklı sürümlerini oluşturun ve test edin". Ve son olarak, bir aciliyet noktası ekleyerek eylem düğmesinin metnini değiştirdik: "Şimdi başla". Ayrıca, web sitesinin ilk bölümü, ilk katın tamamını kaplayacaktır. Amaç mesaja odaklanmaktı.

Bu durumda, A/B testinin sonuçları İngilizce versiyon için İspanyolca versiyondan farklıydı. İngilizce versiyonda %12'den fazla bir dönüşüm iyileştirmesi elde ederken, İspanyolca versiyonda kesin veri elde edemedik. Bu deneyle ilgili daha fazla ayrıntı için burayı tıklayın.

Bu örnek, açılış sayfalarınızı A/B testinin önemini bir kez daha gösteriyor. Test edene kadar herhangi bir değişikliğin web sitenizde ne gibi bir etkisi olacağını bilemezsiniz.

Öne Çıkan Görseller

Bir web sitesinin ilk bölümünün ziyaretçi algısını en çok etkileyen unsurları arasında, kullandığımız özellik görseli anahtardır. İlk gördükleri şey olduğu için, ziyaretçinin genel hissi reddedilme ise, onları kaybetmiş olacağız. Ayrıca içerik sosyal medyada paylaşılırken öne çıkan görseller de önemli rol oynuyor.

Bu nedenle, öne çıkan görsellerin A/B testi oluşturmak kadar kolay bir şey, dönüştürme sonuçlarını gördüğünüzde yüzünüzü gülümsetebilir. Dönüşüm hedefi, kullanıcılarımızın fiyatlandırma sayfasını ziyaret etmesi olan Nelio Contents açılış sayfasında, öne çıkan görseli için bir A/B testi gerçekleştirdik.

Bu sayfada, ilk kat, bilgisayarın önünde alnında post-it ve kalın sakallı gülümseyen bir adamı gösteren öne çıkan bir görüntü içeriyor. Bilgisayar ekranında Nelio Content'in editoryal takvimini görüyoruz. İki ek varyantla bir A/B testi oluşturmaya karar verdik: ilk alternatif, bir dizüstü bilgisayarın önünde çalışan bir ekibi gösteren daha geleneksel bir görüntü. İkinci seçenekte, üstündeki metni daha okunaklı hale getirmek için bulanıklaştırma efekti uyguladığımız editoryal takvimin ekran görüntüsünü gösterdik.

• 
  

• 
  

• 
  

Bu durumda, herhangi bir görüntü diğerlerinden daha iyi miydi? Ne düşünüyorsun? Sakallı beyefendi, öne çıkan diğer iki resim varyantını yenebilecek mi?

Merakla kazanan bir görüntü vardı. İşte tam test sonuçları sayfası:

Spesifik olarak, bilgisayarın önünde bir grup insanın olduğu görüntü, İspanyolca versiyonda neredeyse %90 güven ve şimdi bir %95'i aşan daha da yüksek istatistiksel güvenilirlik.

Gördüğünüz gibi, hipotezlerinizi doğrulamak için bir A/B testi oluşturmadıysanız, neyin en iyi sonuç vereceğini tahmin etmek çok zor. Bu test hakkında daha fazla bilgiyi burada bulacaksınız.

Farklı özellikli görselleri test ettiğimiz gibi, denenmesi gereken bir başka ilginç test türü de bir video için görseli değiştirmenin daha iyi olup olmadığıdır. Bu yazıda, bu deney hakkında daha fazla ayrıntı açıklıyoruz.

Eylem Düğmeleri Çağrısı

Bir açılış sayfasında denemeniz gereken başka bir test türü, sayfadaki farklı harekete geçirici mesaj butonlarını test etmektir. Düğmenin boyutunu, stilini ve metnini test edersiniz.

Harekete geçirici mesaj düğmesi için hangi rengin en iyi olduğuna dair bazı teorileri takip ederek, Nelio Content açılış sayfasındaki düğmelerin rengi üzerinde bir A/B testi yapmaya karar verdi. Bu durumda, Nelio A/B Testing ile bir CSS stilleri testi gerçekleştirdik.

Gerçekleştirdiğimiz A/B testinin her bir çeşidi için CSS stil düzenleyicisinden görüntülendiğinde eylem düğmelerinin nasıl göründüğü aşağıda açıklanmıştır. İlk önce, düğmeleri turuncu olan orijinal sürüme sahipsiniz. Diğer iki değişken, düğmeleri sırasıyla yeşil ve kırmızı olarak ayarlamak için CSS'yi içerir:

• 
  

• 
  

• 
  

Bu durumda, elde ettiğimiz sonuçlar (burada bu deneyle ilgili daha fazla ayrıntı görebilirsiniz), Nelio İçerik sayfalarındaki İngilizce hedef kitlemiz için en iyi sonucu veren rengin yeşil olduğuydu. Ancak İspanyol izleyicilerimiz için halihazırda sahip olduğumuzdan daha iyi çalışan bir renk bulamadık.

Bu A/B Testlerini Nasıl Oluştururum?

A/B Test aracı kullanıyorsanız A/B testi oluşturmak çok kolaydır. Özellikle, tam entegre bir WordPress eklentisi olan Nelio A/B Testing'i kullanırsanız, blok düzenleyici ile bir sayfada değişiklik yapmak kadar kolay bir şekilde herhangi bir testin varyantlarını oluşturabileceksiniz.

Ayrıca daha önceki bazı görsellerde de gördüğünüz gibi sonuçları WordPress'in kendisinde de alıyorsunuz ve herhangi bir kodlama bilgisine sahip olmanıza veya WordPress dışında bir araç kullanmanıza gerek yok.

Bu eksiksiz kılavuzda, WordPress blok düzenleyicisi ile A/B testlerinin nasıl oluşturulacağını açıklıyorum.

E-Ticaretinizin Dönüşümünü İyileştirmeye Başlayın

E-ticaretinizdeki dönüşümü iyileştirmek, web sitenize yapılan ziyaretlerin sayısını artırmaktan daha önemlidir . Açılış sayfaları, ziyaretçilerinizin ulaştığı sayfalardır ve onları dönüştürmelerini sağlamak ana önceliğiniz olmalıdır. Hepsinin bazı ortak özelliklere sahip olduğunu zaten gördünüz, ancak yalnızca A/B testleri oluşturursanız bunları nasıl geliştireceğinizi bileceksiniz. Bazı örnekler gösterdik, ancak bunları kopyalamak yerine kendi hipotezlerinizi oluşturun ve denemeye başlayın.

Sürekli olarak A/B testleri oluşturma deneyimimiz, çok az çabayla satışları artırmamızı sağladı. Web sitenizdeki dönüşümü iyileştirmek için neyi bekliyorsunuz?

Unsplash'ta Igor Miske tarafından öne çıkan görsel.