Web Sitenizi Dönüşüm Oranı Optimizasyonu için Nasıl Tasarlayabilirsiniz?

Bir web sitesinin işletmenizin büyümesine yardımcı olabileceği çeşitli yollar vardır. Ancak tek başına bir web sitesine sahip olmak daha fazla müşteriyi garanti etmez. Köklü şirketler, müşterileri çekmek ve dönüştürmek için web sitelerinin satış makinelerine dönüştürülmesi gerektiğini bilirler. HubSpot'un son anketine göre:

Sayfa yükleme süresinin ilk beş saniyesi , dönüşüm oranları üzerinde en yüksek etkiye sahiptir. Web sitesi dönüşüm oranları, her saniye ek yükleme süresiyle ortalama% 4,42 oranında düşer.

İlk izlenim için ikinci bir şansın olmadığını söylüyorlar. Ve web sitenizin tasarımı, ziyaretçilerini ilk saniyeden itibaren çekmeli ve dönüşünceye kadar asla bırakmalarına izin vermemelidir. Peki web sitenizin bu şekilde sizin için nasıl “çalışmasını” sağlarsınız? Size tasarım temellerini gösterelim.

Tam boyutta görüntülemek için tıklayın. Tüm makaleyi okumak için aşağı kaydırın.

Bilmeniz Gereken Anahtar Terimler

İlk önce, konuyu daha iyi anlayabilmeniz için bu eğitimde tartışılan birkaç anahtar terimi anlamanız gerekir.

A / B Testi veya Bölünmüş Test , hangisinin daha iyi dönüşüm sağladığını bilmek için bir web sayfasının iki sürümünü (A ve B) karşılaştırmanın bilimsel bir işlemidir. Başlıklarınızı, resimlerinizi, harekete geçirici mesaj düğmelerinizi ve renklerinizi birkaç isim olarak test edebilirsiniz.

Harekete Geçirici Mesaj (CTA) , ziyaretçilerinizi harekete geçmeye teşvik eden bir düğme veya metin satırıdır. Web sitenizi ziyaret ettiklerinde ne yapacaklarını söyler. Bunun bazı örnekleri, bir web sayfasındaki "Kaydol" düğmesi, bir e-Ticaret mağazasında "Beni satın al" düğmesi ve bir uygulamadaki "İndir" düğmesidir.

Dönüşüm , bir ziyaretçi veya potansiyel müşteri istenen işlemi tamamladığında gerçekleşir. Bu, ziyaretçinin web sitenize başarıyla kaydolduğu veya mağazanızdaki bir ürünü satın aldığı anlamına gelir.

Dönüşüm Oranı , sitenizde istenen bir işlemi yapan ziyaretçilerin yüzdesidir. Toplam dönüşüm sayısını web sitenizdeki toplam ziyaretçi sayısına bölerek dönüşüm oranınızı elde edebilirsiniz.

Dönüşüm Optimizasyonu veya Dönüşüm Oranı Optimizasyonu (CRO) , sitenizi istenen eylemi gerçekleştiren ziyaretçi sayısını artıracak şekilde web sitenizi iyileştirmeye yönelik sistematik bir yaklaşımdır. Amacınız e-posta abonelerinizi artırmaksa, ziyaretçilerinizin bülteninize kaydolmasını isteyeceksiniz. Veya satışlarınızı artırmak istiyorsanız, o zaman satın al düğmesine basmalarını sağlamalısınız.

Açılış Sayfası genellikle bir web sitesinin ana sayfasıdır, ancak sitenizde ziyaretçilerin onları potansiyel müşterilere veya müşterilere dönüştürmek için gidecekleri herhangi bir sayfa olabilir.

Çok Değişkenli veya Çok Değişkenli Test (MVT) , belirli bir sayfada aynı anda birden çok değişkeni test etme sürecidir. Hangi kombinasyonun en çok dönüştüğünü bulmak için farklı öğeler oluşturmayı içerir.

Web Tasarımının Dönüşen Unsurları

Web sitenizi oluşturmak veya yeniden tasarlamak istiyorsanız, dönüşüm sağlayan görsel olarak çekici bir web sitesi oluştururken göz önünde bulundurmanız gerekenler şunlardır:

1. Resimler

Görseller, her web sitesinde önemli bir rol oynar. Her zaman böyle olmasa da, ziyaretçileri kolayca çekmek ve çekmek için kullanılırlar. Potansiyelini en üst düzeye çıkarmak için resimleri nasıl doğru kullanacağınızı bilmelisiniz.

Sitenizde resimleri etkili bir şekilde kullanmayla ilgili bazı ipuçları:

• İnsan Yüzlü Resimleri Seçin

Sitenizde bir kişinin resmini kullandığınızda, ziyaretçilerinize empati ve güçlü bağlantı sağlar.

"Bir yüz gördüğümüzde, bir şeyi hissetmeye veya o kişiyle empati kurmaya otomatik olarak tetikleniriz. Bir web sitesinde bir sorun, ikilem, alışkanlık veya başka herhangi bir şey gibi içeriği tanırsak, kendimizi bağlı ve anlaşılmış hissederiz. " (Sadece Güzel Değil: Web Sitelerinize Duygu Oluşturmak, Sabina Idler)

PayPal'ın bu tekniği açılış sayfasında nasıl kullandığına bir göz atın:

• Görüntüleri Optimize Edin

Bir web sitesi oluştururken, kullandığınız resimleri sitenizin yükleme hızını etkilemeyecek şekilde optimize etmeniz önemlidir. Dahası, araştırmalar, sayfa yanıtında bir saniyelik bir gecikmenin bile dönüşüm oranınızı% 7 azaltabileceğini göstermiştir.

Görüntüleri optimize etme fikri, görüntülerinizi kalitelerini etkilemeden sıkıştırarak açık hale getirmektir. Ücretsiz olarak kullanabileceğiniz bazı görsel optimizasyon araçları şunlardır:

1. Küçük PNG
2. Compressor.io
3. JPEG İyileştirici
4. Optimizilla
5. Kraken.io
6. Kolay Sıralama
7. Fotoğrafları Yeniden Boyutlandır
8. Fotoğrafları Sıkıştır
9. Görüntüyü Dönüştür

• Çarpıcı Resimleri Kullanın

Her şeyi netleştirmek için, kahraman görüntüleri bir süper kahramanın görüntüleri değildir. Bir kahraman resmi, web sitesinin en üstüne yerleştirilmiş büyük bir web banner resmi. Genellikle bir metin satırı veya harekete geçirici mesaj düğmeleriyle arka plana yerleştirilirler.

İşte bir örnek:

Bonus İpucu: Ziyaretçilerinize iyi bir kullanıcı deneyimi sağlamak için kullandığınız resimlerin duyarlı olduğundan emin olun.

2. Tipografi

Wikipedia'ya göre tipografi , yazı dilini okunaklı, okunabilir ve görüntülendiğinde çekici kılmak için yazıyı düzenleme sanatı ve tekniğidir. Yazı tiplerinin, nokta boyutlarının, çizgi uzunluklarının, satır aralıklarının ve harf aralıklarının kullanılmasını ve harf çiftleri arasındaki boşluğun ayarlanmasını içerir.

Bu video tipografinin kağıttan ekrana nasıl geliştiğini açıklıyor:

Kaç yazı tipi olduğunu biliyor musun? Cevap - kimse bilmiyor. Doğru yazı tipi kombinasyonunu seçmenin kolay bir iş olmamasının nedeni budur.

Bu nedenle, hangi kombinasyonları kullanmanız gerektiğine karar vermenize yardımcı olacak bazı yazı tipi eşleştirme araçları şunlardır:

1. Tip Bağlantı
2. Google Türü
3. Yazı Tipi Çifti
4. Genius yazın
5. Kurt yazın
6. Güzel Web Türü
7. Kullanılan Yazı Tipleri
8. Sadece benim tipim
9. Typ.io
10. Blender
11. Yazı Tipi Birleştirici
12. Typotheque
13. Adobe Typekit
14. Eşleştirici
15. Türler

Web Siteniz İçin En İyi Yazı Tiplerini Nasıl Seçersiniz?

3. Boşluk

Google'ın neden web sitesinin alanını maksimize etmediğini hiç merak ettiniz mi? Bunun nedeni, boşlukların gücünü kullanıyor olmalarıdır.

Boşluk , negatif boşluk olarak da adlandırılır, bir web sitesinin boş veya boş bırakılmış bir parçasıdır. Bunu açılış sayfanızda kullanabilirsiniz, böylece ziyaretçiler harekete geçirici mesaja odaklanabilir ve dönüşümünüzü artırabilir. Boşluk, sitenizin arka planının beyaz olması gerektiği anlamına gelmez. Renklerle oynayabilir, hatta bir resmi arka plan olarak kullanabilirsiniz. Amaç, işi basitleştirmek, ancak en iyi kullanıcı deneyimini sağlamaktır.

Unutmayın: Karmaşık olmayan bir web sitesi ziyaretçilerinizin dikkatini çeker. Düzgün ve iyi düzenlenmiş bir sitede gezinmek onlar için zevkli bir deneyimdir.

4. Renkler

Bir web sitesi oluştururken dikkat edilmesi gereken bir diğer önemli unsur renktir. Renklerin anlamları olduğunu, dolayısıyla hangi renkleri seçerseniz seçin, hedef kitlenize iletmek istediğiniz mesajı yansıtmalıdır.

Örneğin, Amerika Birleşik Devletleri'ndeki bankaların çoğu, güveni ifade ettiği için mavi rengi kullanır.

Resim kredisi: The Epoch Times

Doğru renk kombinasyonlarını seçerken bir rengin temsil ettiği bazı olumlu ve olumsuz duyguları not edin.

• Siyah - Fizikte siyah, bir kişi üzerinde psikolojik bir etkiye sahip olmasına rağmen bir renk değildir. Gücü ve gücü sembolize eder ancak aynı zamanda ölümü, mutsuzluğu ve kötülüğü de temsil edebilir.
• Beyaz - Genel olarak beyaz, saflığı ve masumiyeti temsil eder. Hastaneler bir kısırlık duygusu yaratmak için beyaz kullanır. Bununla birlikte, soğuk, yumuşak ve izole bir şeyi de temsil edebilir.
• Kırmızı - Bu renk duygularımızı uyandırır. Sevgi, heyecan ve güven ile ilişkilendirilebilir. Olumsuz yanı, saldırganlığı ve öfkeyi sembolize eder.
• Mavi - Gökyüzünün rengi, okyanus ve en çok erkekler tarafından tercih ediliyor. Mavi renk sakinliği, dinginliği, istikrarı ve güvenilirliği simgeler. Bununla birlikte, üzüntüyü de temsil edebilir ve bu nedenle "mavi hissetme" terimi de kullanılabilir.
• Yeşil - Ormanın rengidir ve genellikle doğayı temsil eder. Yeşil, huzur, iyimserlik ve iyi şanslar demektir.
• Sarı - Tıpkı güneş gibi sarı, parlaklığı ve sıcaklığı temsil eder. En çok dikkat çeken renktir ve bu nedenle yol işaretlerinde yaygın olarak kullanılmaktadır. Ancak yansıttığı ışık miktarı nedeniyle göz yorgunluğu da yaratabilir.
• Mor - Lavanta rengidir. Mor, telif hakkı ve zenginliği simgeler, ancak bazıları onu egzotik veya yapay olarak yorumlayabilir.
• Kahverengi - Topraksı ve doğal bir renktir. Direnç, güvenilirlik ve güvenliği ifade eder. Aynı zamanda üzüntü ve yalnızlık anlamına da gelebilir.
• Turuncu - Sarı renge benzer şekilde turuncu da dikkat çekmek için kullanılır. Sıcaklığı, heyecanı ve enerjiyi temsil eder. Genellikle Cadılar Bayramı ile ilişkilendirilir.
• Pembe - Bu rengin sakinleştirici bir etkisi vardır. Nezaket, bakım ve kadınlık ile ilişkilidir. Markanızın çok kadınsı görünmesini istemiyorsanız bu rengi kullanmaktan kaçınmalısınız.

Bonus İpucu: Web tasarımınız için hangi renklerin en iyi olacağına karar veremediğinizde, A / B Testi veya Çok Değişkenli Test kullanabilirsiniz. Hangi rengin daha iyi dönüştüğünü bilmenize yardımcı olacaktır.

5. Mobil Uyumlu

Web sitenizdeki dönüşümü en üst düzeye çıkarmak için mobil uyumlu olması çok önemlidir. Akıllı telefon kullanımının artması nedeniyle, günümüzde insanlar web sitelerine birden çok ekrandan (masaüstü bilgisayarlar, tabletler ve cep telefonları) erişiyor. Her 10 kişiden 8'inin interneti akıllı telefonlarından kullandığını unutmayın.

WordPress Düzenlerinizi Mobil Trafik için Optimize Etme

Web sitenizin farklı ekran boyutlarına yanıt verme yeteneğini öğrenmek için aşağıdaki araçları kullanın:

1. Google Arama Konsolu ile Mobil Uyumluluk Testi
2. MobileTest.me
3. Bing'den Mobil Uyumluluk Test Aracı
4. MobiReady Mobil Dostu Denetleyicisi
5. Urlitor
6. Browserstack
7. RankWatch
8. Google'dan PageSpeed ​​Insights

Unutmayın: Mobil uyumlu web siteleri, olmayanlardan daha üst sıralarda yer alır.

Sonuç

Dönüşüm oranı optimizasyonu gerçekleştirirken, web tasarımının trafiğinizi kara dönüştürmede büyük rol oynadığını unutmamalısınız. Sitenizde hemen çıkma oranının yüksek olmasını önlemek için yukarıda verdiğimiz ipuçlarını izleyin.