Divi Lead'lerle Sıfırdan Etkili Bir Açılış Sayfası Nasıl Oluşturulur

Açılış sayfaları, tek bir amaç için oluşturduğunuz sayfalardır: dönüşüm. Sayfa ziyaretçilerini takipçilere, kayıtlara veya müşterilere dönüştürmek istiyorsunuz. Etkili bir açılış sayfasına sahip olmak, tüm çevrimiçi girişiminiz için başarı ve başarısızlık arasındaki fark olabilir.

Birçoğunuz Divi temamızı yıllardır kullanıyorsunuz çünkü bu, WordPress açılış sayfalarını hızlı ve kolay bir şekilde oluşturmak için mevcut en iyi araçlardan biri. Şimdi, Divi 2.7'nin piyasaya sürülmesi ve güçlü bölünmüş test özelliği Divi liderleri sayesinde, aynı zamanda WordPress kullanıcıları için bir açılış sayfası oluşturmanın en etkili yollarından biridir.

Bu makalede, etkili bir açılış sayfasının anatomisini açıklayacağım ve ardından size Divi Lead'leri ile başarı için nasıl split testi yapacağınızı göstereceğim.

Etkili Bir Açılış Sayfasının Anatomisi

Etkili bir açılış sayfası, okuyucunun dikkatini harekete geçirici mesajınıza çekecek ve onlara harekete geçme kararını vermeleri için ihtiyaç duydukları bilgileri verecektir. Bir açılış sayfasını etkili kılan temel unsurlara bir göz atın.

Başlık

Başlık, ziyaretçinin göreceği ilk şeylerden biridir. İki öğe içermelidir:

Sayfa başlığı – sayfanın birincil başlığı ve amacı.

Alt başlık – destekleyici bilgiler sağlar.

İyi bir başlığın önemi fazla ifade edilemez. Başlıklar açık, özlü olmalı ve okuyucunuzun dikkatini çekmelidir. Değillerse, size büyük zamana mal olabilirler.

Dikkat çekici başlıklar yazmaya yönelik bu kılavuzda, yazarlar Neil Patel ve Joseph Putnam, pazarlamada manşetlerin reklam dolarının %90'ı değerinde olduğunu belirtiyorlar. Ve kişisel olarak, bir e-posta konu satırındaki tek bir kelimenin bir kampanyanın dönüşüm oranında %46'lık bir fark yarattığını gördüler.

Resim veya Video

Bu, ürünün bir kahraman resmi veya videosudur. Mümkün olduğu kadar en yüksek kalitede görüntü veya video ve ses kullanın. Harika bir aydınlatmaya sahip olduklarından ve profesyonel fotoğrafçılık standartlarını kullandıklarından emin olun. Cep telefonu görüntüleri gibi görünmemeliler. Stüdyo görüntüleri gibi görünmelidirler.

Teklif ve Avantajlar

Bu, ürünü ve onu kullanmanın faydalarını anlatan reklam metnidir. Başlıktan takip edilmeli ve kesin olmalıdır. Meslekten olmayanların terimlerini kullanın. Ürünü aşırı satmayın ve çok hayali sözler vermeyin. Temiz bir özellik ve fayda listesine bölün.

Eylem çağrısı

Harekete geçirici mesaj, sayfanın birincil amacıdır. Gerisi, ziyaretçilerinizi CTA'ya yönlendirmek ve onlara bilinçli bir karar vermeleri için ihtiyaç duydukları bilgileri vermek için destekleyici bilgilerdir. Bunlar genellikle satın al, indir, katıl, tıkla gibi eylem ifadelerini kullanan ve ardından ücretsiz gibi terimler ekleyen düğmelerdir. Örneğin, düğmeler "Şimdi Satın Alın", "Ücretsiz İndirin", "Bugün Katılın", "%15 indirim için Burayı Tıklayın" gibi metinler içerebilir. Harekete geçirici mesaj düğmeleri iyi etiketlenmiş, belirgin ve yukarıda olmalıdır. "katlama" (kaydırmak zorunda kalmadan masaüstünde görüntülenebilir). Bir ziyaretçiyi asla CTA düğmenizi aramaya zorlamayın.

Sosyal Kanıt ve Güven

Buna derecelendirmeler, incelemeler, röportajlar, satış rakamları, basın açıklamaları, garantiler ve güven oluşturmak için diğer tüm materyaller dahildir. Bu, hem iyi hem de kötü olan ifadeleri ve kesin ve yuvarlanmamış sayılar olan incelemeleri içermelidir. Bu, incelemelerin ve referansların dürüst olduğunu ve yanlış iddialarda bulunmadığını kanıtlar ve güvenilirlik sağlar. Güven oluşturmanın başka bir yolu da güven ve güvenlik rozetleri eklemektir.

Navigasyon Yapısı

Ziyaretçilerinizi harekete geçirici mesajınızdan uzaklaştırmak istemezsiniz. Menü sistemi, anlaşılması ve takip edilmesi kolay birkaç bağlantı ile kısa ve basit olmalıdır. Menüdeki her sayfayı ve kategoriyi istemiyorsunuz. Bu, normal bir sayfada beklediğiniz gibi eksiksiz bir gezinme yapısı değildir. Odak noktasının onları sitedeki başka bir sayfaya yönlendirmek değil, dönüşüm olduğunu unutmayın.

Harekete geçirici mesajınız için bu navigasyonu tamamen bırakmayı bile düşünebilirsiniz. Navigasyon istiyorsanız, ana sayfaya bir bağlantı yeterli olacaktır. Bazıları bu sayfada hiç navigasyon olmamasını tavsiye ediyor. Bazıları, web sitesini tanımlamak için başlıkta logoyu içerirken, bazıları içermez. Daha iyi site tanımlaması için logoyu eklemeyi tercih ederim. Bu, web siteniz için en iyi olanı test edip görebileceğiniz bir şeydir.

Atama

Yerleşim, ziyaretçinin kullandığı ekran veya cihaz türüne ve hedeflemeye çalıştığınız cihaz türüne göre değişir. Ekrandaki en önemli alan, ziyaretçinin kaydırma yapması gerekmeden önce görünen yerdir. Başlık, metin ve CTA gibi sayfanızın en önemli öğelerine burada ihtiyaç duyarsınız. Sosyal kanıt ve ek bilgiler gibi destekleyici öğeler, kaydırmanın (veya katlamanın) altına yerleştirilebilir. Bu, masaüstünde daha belirgindir.

İlk Deneme Çalıştırması

Yukarıda özetlenen kavramları kullanarak Divi Builder'ı kullanarak elle bir açılış sayfası geliştirdim. Gerçek dünyadaki bir testte, harekete geçirme çağrımın sonuçlarını görmek için siteyi birkaç gün (veya istatistiksel olarak anlamlı bir testin yapılması ne kadar uzun sürdüyse) çalıştırırdım. Bu, iyileştirmelerimi karşılaştırmak için bana bir temel sağlar ve verilerimi ölçmeme yardımcı olur. Temelimi aldıktan sonra A/B testlerime başlardım.

Başladığım düzen bu. Bana net bir başlık, alt başlık, ürün resmi, ürün metni, CTA, kullanıcılar için tanıtım yazısı, başka bir resim ve sayfanın alt kısmında başka bir CTA veriyor. Divi Builder Kitaplığındaki açılış sayfası şablonundan birkaç sıra aldım.

Yeterli ölçülebilir veriye sahip olduğumda testlerime başlayabildim.

Test yapmak

Fikir, sadece değişiklik yapmak için değişiklik yapmak değildir. İnce ayarlar, uygulanan en iyi sonuçlarla spesifik ve test edilebilir olmalıdır. Divi ile iyileştirme yapmaya nereye odaklanacağınızı bilmenin en iyi yolu Divi Lead'leri kullanarak bir A/B testi yapmaktır.

Bu bölümde yaptığım testleri ve aldığım sonuçları gösteriyorum. Hangi testlerin uygulanacağına karar vermek için ilk öğeyle başladım ve ne olacağını görmek için bir değişiklik yaptım. Divi Leads A/B testi kullanarak her öğeyi test etmek istiyorum. Gerçekte testleri, bu testlerde yaptığımdan çok daha uzun süre çalıştırırdım ve çok fazla trafik ve tıklama alırdım. Sonuçlar sadece simüle edilmiştir, bu nedenle sayılar küçük ve gerçekçi değildir, ancak bunlar yalnızca tanıtım amaçlıdır.

Başlık metni

Başlık metniyle başladım. Metnin okuyucunun dikkatini ne kadar iyi çektiğini görmek istedim. Bunun için metni konu olarak ve eylem çağrısı düğmesini hedef olarak kullandım.

Sonuçlar

İkinci başlık, birinci başlıktan çok daha iyi bir okuma oranına sahipti. İkinci başlık metnini sakladım ve bir sonraki teste geçtim.

Resim ve Metin Konumu

Bu testte, harekete geçirici mesaj üzerinde hangi düzenin en iyi etkiye sahip olduğunu görmek için resmin ve metnin konumunu karşılaştırıyorum. Harekete geçirici mesajın en iyi görselin altında mı yoksa metnin altında mı çalıştığını bilmek istiyorum. Eylem çağrısını yerinde bırakıyorum ve resim ile metni değiştiriyorum.

Sonuçlar

Sonuçlar, 2. satırın daha fazla gösterim aldığını ancak 1. satırla aynı sayıda tıklamaya sahip olduğunu ve bu da 1. satırın daha yüksek bir tıklama oranı sağladığını gösteriyor. Şimdilik 1. satırı tutacağım.

Bulanıklıklar ve Görüşler

Ardından, ne tür referansların en iyi sonucu vereceğini görmek istiyorum. Modülü konu ve eylem çağrısını hedef olarak kullanıyorum.

Sonuçlar

Sonuçlar, 2. satırın 1. satırdan daha yüksek bir etkileşime sahip olduğunu gösteriyor, yani yığılmış iki referans, yanlarında metin bulunan yatay olarak yerleştirilmiş iki tanıtıcıdan daha başarılıydı.

Görüşler Versiyonlar

Referanslar her iki CTA düğmesine çok yakın olduğu için testi genişletmeye karar verdim. Referanslar için farklı bir düzen denemek ve alt CTA düğmesini eklemek istedim. Harekete geçirici mesajı hedef olarak kullanarak bu satır için yeni bir düzen oluşturdum. Bu sefer referanslar için üçüncü bir seçenek yarattım, bu yüzden şimdi ikisi üst üste, ikisi yan yana ve üçü yan yana. Ayrıca bu sefer ikinci bir test ekledim. Kısa kodu, ikinci harekete geçirici mesajın yol açtığı farklı bir sayfaya ekledim. Bu şekilde daha fazla veri alabilir ve ilk CTA'dan mı yoksa ikincisinden mi daha fazla tıklama aldığımı görebilirim.

Sonuçlar

2. satırın ve 3. satırın her ikisinin de 1. satırdan daha fazla gösterim başına tıklama aldığını görebiliyorum. Hangisini seçmenin daha iyi olacağını bilmek için başka bir faktöre ihtiyacım vardı, bu yüzden kısa kod dönüşüm oranına baktım.

3. satır, 2. satırdan daha yüksek bir kısa kod dönüşüm oranına sahipti. 1. satır kısa kod dönüşümleri için 3. satıra bağlı olduğundan daha fazla analiz yapabilirim, ancak 3. satırın tıklama oranını daha çok seviyorum, bu yüzden şimdilik 3. satırda kalacağım.

Resim ve CTA

Görüntü ve harekete geçirici mesaj için modül yerine satırı test etmek istiyorum. Bu şekilde farklı düzenler deneyebilir, farklı öğeler ekleyebilirim vb. Hedef olarak CTA'yı kullandım.

Sonuçlar

Dört sıradan, 1. ve 2. sıra en iyi sonuçlara sahipti. Bir karar vermeye yardımcı olmak için daha fazla veriye baktım.

Daha ileri analizlerde 1. satırın 2. satırdan daha yüksek hedef görüntüleme ve okuma sayısına sahip olduğunu görebiliyorum, bu yüzden 1. satırı tuttum.

İkinci Eylem Çağrısı

Daha büyük, farklı bir renk, farklı bir metin vb. olup olmadığını görmek için ikinci harekete geçirici mesaj düğmemi denemek istiyorum. Bu test için altı varyasyon oluşturdum. Bazı farklılıklar küçükken diğerleri daha aşırıydı.

Sonuçlar

CTA'nın 3, 5 ve 6'sı eşit performans gösterdi. Benzerlerdi, bu yüzden üçüncüyü tuttum. Bu, net bir kazanan olana kadar her zaman geri dönebileceğim veya test etmeye devam edebileceğim bir şey.

Bölüm Renkleri

Düzende bazı ince ayarlar yaptıktan sonra, her seferinde bir bölüm arka plan için renkleri test etmek istedim. Aynı düzende, biri koyu arka planlı, diğeri açık arka planlı iki bölüm oluşturdum. Bu testi bitirdikten sonra farklı bir renk veya arka plan görüntüsü ile tekrar deneyeceğim. Sayfayı bölümlü ve bölümsüz test etmek isterseniz bir bölümü boş bile bırakabilirsiniz (tabii ki bunu BU bölümle yapmazdınız).

Sonuçlar

Her iki bölüm de aynı sayıda gösterim ve tıklama aldı, ancak 2. bölüm daha yüksek bir hemen çıkma oranına sahipti. Ayrıca, kısa kod dönüşüm oranım diğer testlerden daha yüksekti, bu da son bölümün renginin daha popüler olduğunu gösteriyordu (ikinci CTA'nın olduğu yer burası). Müşteriler ilk yerine ikinci CTA düğmesini kullandığından bu, hemen çıkmaları açıklar.

Optimizasyon

Açılış sayfanızı optimize etmenin en iyi yolu, verileri analiz etmek ve bu verilere göre değişiklikler yapmaktır. Tüm verileri analiz ettikten sonra, hangi modüllerin ve düzenlerin en iyi performansı gösterdiğini buldum. Daha sonra bu modüllere geri döndüm ve daha fazla değişiklik yaptım ve farklı renkler, metin boyutları, konumlar kullanarak, metin miktarını azaltarak, görüntüleri değiştirerek, harekete geçirici mesaj düğmelerinin ifadesini değiştirerek, okuyucunun çizimlerini yapmak için kalın metin kullanarak daha fazla test yaptım. dikkat, vs. Önemli olan test etmeye devam etmek ve bu testlere göre iyileştirmeler yapmak.

Yeterli testten sonra, dönüşüm oranımın ne kadar arttığını bilmek için sonuçları temelimle karşılaştırırdım. Çok az bir çabayla, konuşma hızınızı sıçrama ve sınırlarla kolayca artırabilirsiniz.

Daha azını alıyorum, daha fazla yaklaşım ve düzeni temiz ve basit tutuyorum. Gerekli olmayan her şeyi kesin. Ziyaretçimizin dikkatini çekmek için 5 saniyemiz olduğu için metnin çoğunu kaldırmaya karar verdim. Çok fazla bilgi verirseniz, ziyaretçileri okumaktan caydırabilir ve karar vermelerini zorlaştırabilir. Metin miktarını neredeyse yarı yarıya azalttım. Bu, okuyucunun resimlere ve düğmelere daha fazla odaklanmasını sağladı. Ayrıca, okuyucunun gözünü yönlendirmeye ve sayfayı taranabilir hale getirmeye yardımcı olmak için uygun olan yerlerde daha fazla madde işareti, kalın ve vurgu kullanmaya karar verdim. Sayfanın ne için olduğunu çabucak çözemezlerse, muhtemelen ayrılacaklar.

Çok fazla farklı harekete geçirici mesaj müşterilerin kafasını karıştırabilir. İkinci harekete geçirici mesajı kaldırmak yerine, aynı ürün için tıklayabilecekleri başka bir yer olduğunu daha net hale getirmeye karar verdim. Başka bir seçenek de onu tamamen kaldırmak olabilir, ancak konumu göz önüne alındığında dönüşüm oranını artırabilir. Bu CTA'yı test etmeye devam edersem ve bunun dönüşümü iyileştirmediğini tespit edersem, kaldırmayı düşüneceğim. Aynı teklif için birden fazla CTA'ya sahip olmak sorun değil, ancak bunun kolayca anlaşılması ve görülmesi kolay olması gerekir.

Sıradaki ne? Test etmeye devam edin! Dönüşüm oranınıza yardımcı olmayan her şeyi değiştirin. Buna düzen, başlıklarınızın ifadesi, metin miktarı, renk seçenekleri, düğme seçenekleri vb. dahildir. Açılış sayfanızı değiştirmeyi asla bırakmayın. Test, asla gerçekten bitmeyen bir şeydir. Web sitenizde iyileştirmeler yapmaktan asla vazgeçmeniz gerekmeyecek. Sadece küçük bir iyileştirme, dönüşüm oranınızı artırabilir ve başarı ile başarısızlık arasındaki farkı yaratabilir.

Son düşünceler

Divi Leads, nerede iyileştirmeler yapılacağını görmek için açılış sayfalarını test etmeyi kolaylaştırır. Burada verdiğim test örnekleri, Divi Lead'leri kullanarak tek bir açılış sayfasını test etmenin birçok yolundan sadece birkaçı. İyi açılış sayfası tasarım ilkeleriyle başlayın, bir temel oluşturun ve ardından test etmeye başlayın. Dönüşüm oranınızın arttığını görebilirsiniz.

Mümkün olan en etkili açılış sayfasını oluşturmanın anahtarı, sürekli olarak test etmek ve bu testleri temel alarak iyileştirmeler yapmaktır. Test etmeye devam edin, dönüşüm oranınız size teşekkür edecektir.

Sizden haber almak isteriz! Ekleyeceğiniz herhangi bir açılış sayfası tasarım ipucunuz var mı? Divi Leads ile açılış sayfalarını test etmeyi denediniz mi? Yorumlarda deneyiminizi bize bildirin.

/ Shutterstock.com'dan makale küçük resmi