Sitenizin Dönüşüm Oranını Artırmak için Gerçekten Çalışan 10 Web Tasarım Püf Noktası
Yayınlanan: 2018-02-05Akıllı pazarlamacılar, bir web tasarımının dönüşüm oranını artırabileceğini veya azaltabileceğini bilir.
SEO ve sosyal medya pazarlamasının dönüşümler için hayati olduğu doğru olsa da, mükemmel bir tasarıma sahip olmak her şeyi değiştirebilir.
Tüm dijital pazarlama bileşenleri önemlidir. Ancak, web tasarımı dönüşüm oranlarını artırabilir veya bozabilir. Bir Stanford Üniversitesi araştırmasında, insanların yüzde 46,1'i bir şirketin güvenilir olup olmadığını ayırt etmede en önemli ölçütünün web tasarımı olduğunu belirtti. Bunu akılda tutarak, web sitenizin tasarımı hayati önem taşır ve profesyonel görünmesi gerekir.
estetik açıdan hoş
Sitenizin estetiği de dönüşümlerde rol oynayabilir. Bir Adobe çalışmasına göre, site güzel tasarlanmışsa, insanların üçte ikisi içerik tüketir ve kalır. Bununla birlikte, ziyaretçilerinizin yazılarınızı okumasını istiyorsanız sitenizin çekici görünmesi gerekiyor.
Bu durumda, web tasarımını göz ardı edemezsiniz. Sitenizin estetik açıdan hoş olmasını sağlamak için bir serbest çalışan veya bir tasarımcı tutabilirsiniz.
İşte size dönüşümlerde sürdürülebilir bir artış sağlayabilecek bazı web tasarım püf noktaları.
1. Hick Yasasına bakın
Kanun, seçeneklerin sayısını artırarak bireyin karar verme süresini de artırdığını belirtmektedir. Bu yasaya sıklıkla web tasarımında atıfta bulunulur. Bu çalışmada, araştırmacılar daha fazlasının her zaman daha iyi olmadığını buldular çünkü daha az reçel çeşidi gösteren bir masa, 24 çeşit reçel içeren bir masaya göre daha fazla insanı cezbetti. İnsanlar küçük bir ekran gördüklerinde satın alma eğilimindeydiler.
Web tasarımında yasayı uygulamak için ziyaretçileriniz için sahip olduğunuz seçeneklerin sayısını sınırlamanız gerekir. Web sitenizde gezinme çubuğunuzda ne olduğunu değerlendirin. Seçenek sayısını azaltmak için nelerden kurtulabileceğinizi bulmak için gidilecek en iyi yerdir. Ziyaretçileriniz ne kadar çok bağlantı arasından seçim yapabilirse, kullanıcılarınız web sitenize olan ilgilerini o kadar kaybeder.
Gezinme çubuğunun yanı sıra, ziyaretçilerin sitenizdeyken karar vermesi gereken web sitenizdeki diğer öğelere de bakmalısınız. Bunlar, okuyucuların sayfayı daha fazla aşağı kaydırmasına veya gezinme çubuğunu kullanmasına izin verilip verilmeyeceğini belirlemeyi; e-Kitabınızı indirmeye veya yayınınızı sosyal medyada paylaşmaya karar vermek veya bir ürün incelemesini okumayı veya daha fazla ürüne göz atmayı seçmek.
Web sitenizde seçenek sayısını azaltabileceğiniz çeşitli yerler olabileceğinden, ana sayfanıza bir karşılama kapısı kurmak isteyebilirsiniz. Burada ziyaretçileriniz tüm ekranı kapsayan bir karşılama mesajı görecek ve tek bir harekete geçirici mesajla birlikte gelecek. Bunu akılda tutarak, ziyaretçilerin sitenizi ziyaret ettiklerinde yalnızca bir seçeneği olacaktır. Daha fazla seçenek görmek isterlerse, aşağı kaydırarak ana sayfanızdaki dikkat dağıtıcı unsurları en aza indirebilirler.
Ancak bu yasayı uyguladığınızda, kârlılığınız için çok önemli olan eylemleri göz önünde bulundurmanız çok önemlidir. Sitenizdeki her sayfanın bir ana hedefe ulaşması gerektiğini unutmayın. Ayrıca, ziyaretçileriniz ne kadar az seçeneğe sahip olursa, web sitenizi kullanmaları o kadar kolay olur ve bu da sitenizin dönüşüm oranını artırabilir.
2. Web Sitenizi Hızlandırın
Ziyaretçileriniz internette gezinirken sabırsızlanıyor. İkinci bir gecikme, dönüşümde yüzde 7'lik bir azalmaya neden olabilir. Sayfa hızınızı kontrol etmek ve sorunları hakkında daha fazla bilgi edinmek için çeşitli araçlar vardır. Diğerlerinin yanı sıra Google PageSpeed Insights, SEO Chat ve Pingdom tarafından Sayfa Yükleme Hızı Analizörü kullanabilirsiniz.
Okuyucunuzun dikkatini çekmek için sekiz saniyeniz olduğunu unutmayın. Bu durumda, web sitenize geldikten sonra ziyaretçilerinizi çekmek için çok az fırsatınız olur. Web sitenizin yüklenmesi yavaşsa, ayrılırlar ve bir daha geri gelmezler.
Web sitenizi hızlandırmanın yanı sıra, sayfanızın amacını iletebilecek veya ziyaretçilerin gözlerini birincil harekete geçirici mesaja çekebilecek kısa bir başlık, göz alıcı bir görsele sahip olmayı düşünmelisiniz. Kaydolma düğmelerinizin büyük ve basit olduğundan emin olun. Ve kopyanızın çekici olduğundan emin olun.
3. Bu Fotoğrafçılık İlkesini Takip Edin
Üçte bir kuralı, web tasarımcılarının uygulayabileceği bir fotoğrafçılık ilkesidir. Bu kuralda, web sayfanızı üçe bölmeniz gerekir, böylece size eşit büyüklükte dokuz kare verir. Dört orta kare ilgi çekici yerlerdir. Bu noktalara yerleştirdiğiniz herhangi bir nesne, web siteniz üzerinde büyük bir etkiye sahip olabilir ve böylece dönüşümleri artırır.
En önemli harekete geçirme butonunuzu bu alanlara yerleştirebilirsiniz. Ancak gezinme çubuğunuzu bu yerlere yerleştirmeyin. Bu şekilde ziyaretçileriniz web sayfanızdaki birincil harekete geçirici mesaja odaklanacaktır.
Tüm web sitenizi yeniden tasarlamanıza gerek yoktur. Bunun yerine, sitenizin en önemli kısımlarını yerleştirmenin bir yolu olarak üçler kuralını kullanabilirsiniz. İlk olarak, sitenizin ekranın üst kısmından bir ekran görüntüsü almanız gerekir. Daha sonra dokuz eşit parçaya bölün. Oradan, web sitenizi değiştirmek isteyip istemediğinize karar verebilirsiniz.
Bu alanlara video, ses ve diğer interaktif içerikleri yerleştirebilirsiniz. Harekete geçirici mesaj düğmelerinizde fareyle üzerine gelme efektlerine sahip olmayı düşünün. Bu şekilde, ziyaretçileriniz tıklamaya daha istekli olacaktır. Ardından, bazı animasyonlu çıkış açılır pencereleri ekleyin. Ziyaretçilerinizle ilgilerini kaybettiklerinde yeniden etkileşimde bulunmak için hayati önem taşırlar.
4. Negatif Alandan Yararlanın
Negatif alan, web tasarımındaki boşluktur. Bu alan, sitenizi daha okunaklı ve kullanışlı hale getirdiği için olumlu bir şeydir. Bu boşluk sadece sayfanızdaki öğeler arasındaki boşluk değildir. Bunun yerine, paragraflar veya metin satırları arasındaki alan gibi sayfanızdaki küçük öğeler arasındaki boşluğu da ifade eder.
Sitenizdeki negatif boşluklara dikkat etmelisiniz çünkü sitenizi gözü yorar ve dönüşüm artışına neden olur. Web tasarımınıza bağlı olarak, ana sayfanızda bir ton negatif alan kullanabilirsiniz. Bu şekilde, ziyaretçileriniz birincil harekete geçirici mesaja odaklanacaktır.
Yeterli negatif alana sahip olmak için, harfler arasında daha fazla boşluk bırakmak için daha küçük bir yazı tipi kullanabilirsiniz. Ardından, satır yüksekliği 1.5 olmalıdır. Daha küçük yazı tiplerine sahip olmayı seçerseniz, daha fazla satır yüksekliğine sahip olmalısınız.
Ardından, paragraflar arasındaki negatif boşluğu artırmak için bu büyük metin bloklarını daha küçük paragraflara bölün, böylece yazıları daha okunabilir hale getirin. Sitenizdeki büyük öğeler arasına boşluk eklemek için kenar boşlukları ve dolgu kullanmayı unutmayın.
5. Kaydırıcılardan veya Karusellerden Kurtulun
Neden? Niye? Yalnızca dönüşüm oranlarınıza zarar verebilirler. Önceden heyecanlılardı. Ama şimdi, evcil hayvan kayaları haline geldiler. Ayrıca, kullanılan büyük resimler nedeniyle kaydırıcılar sitenizi yavaşlatır. Ziyaretçilerin içeriğinizi tüketmesine izin vermedikleri için de dikkat dağıtıcıdırlar.
Bu unsurlar, insan gözünün çevreye nasıl tepki verdiğinden dolayı kafa karıştırıcıdır. İnsan beyni, statik bir manzaradaki hareketi algılamak için tasarlanmıştır. Eskiden, bir tundra boyunca mamutları izlemek yardımcı oldu. Ancak bu yanıt, insanların kaydırıcıların hareketine daha fazla dikkat etmelerini ve odaklanmalarını istediğiniz dönüşüm noktalarını görmezden gelmelerini sağlar.
Ayrıca, kaydırıcılar, ziyaretçileriniz bir mobil cihaz üzerinden sitenizde gezinirken bir anlam ifade etmeyecektir. İşte bu yüzden insanlar kaydırmayı kaydırmaktan daha kolay buluyor. Ziyaretçilerinizin mobil cihazlarını kullanarak sitenizde daha kolay gezinmesinin size daha yüksek dönüşüm oranları sağlayacağını unutmayın.
Kaydırıcılar ayrıca sitenizde çok fazla H1 etiketine neden olur. Siteniz için harika olduklarını düşünebilirsiniz, ancak web tarayıcıları onları küçümser. Bunun nedeni, web sitenizdeki bilgi hiyerarşisini karıştırmalarıdır. Web tarayıcıları onlardan nefret ettiğinden, sayfa sıralamanızı önemli ölçüde etkileyebilirler. Bu nedenle, onlardan mümkün olduğunca kaçındığınızdan emin olun.
Kaydırıcıları kullanmak yerine, güçlü bir başlığa sahip statik bir görüntüye sahip olmayı tercih edin.
6. F Modelini Düşünün
Çeşitli araştırmalarda araştırmacılar, çoğu kullanıcının bir F düzeninde bir gönderiyi okumak için web'e göz attığını buldu. Yani ekranın üst kısmında soldan sağa doğru bakarlar. Bundan sonra, sayfayı aşağı doğru tararlar ve içerikle ilgili bazı okumalar yaparlar. Nadiren bir sayfanın sağ alt kısmına ulaşırlar.
Dönüşümlerinizi artırmak için F modelini nasıl kullanabilirsiniz? Bu kritik eylem çağrılarını ve nesneleri F şeklindeki çizgiler boyunca yerleştirin. Ardından, daha az öneme sahip nesneleri, görüşün düşük olduğu alanlara yerleştirin.
Sayfanın sol tarafı ziyaretçilerinizin ilk bakacağı yer olduğundan, birincil harekete geçirici mesajı bu alana yerleştirmeyi düşünün. Ardından, başlıkları sayfanın sol tarafına yerleştirin. Artık sponsorlu reklamlarınız için onları sayfanızın sağ tarafındaki kenar çubuğuna koyabilirsiniz. Görünür olması gerekmeyen ancak web tarayıcıları için gerekli olan her şey sayfanın sağ alt kısmına yerleştirilmelidir.
7. Doğru Renkleri Seçin
Renkler duyguları uyandırabileceğinden, markanızın kişiliğini yansıtan ve insanları harekete geçmeye zorlayan renk kombinasyonunu seçmelisiniz. İnsanların satın alma kararını duygusal bir yerden vereceğini unutmayın. Bununla birlikte, web siteniz için seçtiğiniz renk kombinasyonu, dönüşüm oranlarını optimize etmede önemli bir rol oynayacaktır.
Bir öneri, markanızın vizyonunu yansıtan bazı fotoğraflar içeren bir Pinterest panosu oluşturmaktır. Bu fotoğraflardaki renklere dayalı bir renk şeması oluşturmak için Adobe'nin Renk Çarkı'nı kullanın. Ancak seçimleri hareket ettirerek tek tek renkleri tweetleyebilirsiniz.
Bir renk şeması oluşturduktan sonra, kontrastı kullandığınızdan emin olun, çünkü bu aynı zamanda dönüşümlerinizi de yapabilir veya bozabilir. Başlıkları, metinleri ve harekete geçirici mesaj düğmelerini daha okunaklı ve fark edilir kılmak için kontrast kullanılabilir. Ön ve düğme renkleri, arka plan ve abone olma düğmeleri gibi vurgulamak istediğiniz diğer öğelerle zıt olmalıdır. Sayfanın geri kalanından gerçekten öne çıkan bir tonda olmalıdırlar.
Hubspot tarafından yapılan bir testte kırmızı düğmelerin yeşil düğmelerden daha iyi olduğu bulundu. Yine, kırmızı düğmeleri düşünmeden önce, sayfanızda kırmızının baskın renk olmadığından emin olun. Aksi takdirde, daha fazla kontrast oluşturmaz.
Daha önce de belirtildiği gibi, baskın renginizin tam tersi olan tamamlayıcı bir renk seçmek için renk tekerleğini kullanabilirsiniz.
Ancak doğru renk kombinasyonunu seçmeden önce insanların renklere farklı baktığını anlamalısınız. Renkler her zaman markanızla nasıl eşleştiklerine bağlıdır. Bu nedenle, ziyaretçilerinizin satın alma kararlarını etkilediği için markanızın kişiliğine uygun bir renk seçmelisiniz.
Örneğin, markanız sert veya erkeksiyse pembe bir harekete geçirici mesaj butonunu tercih etmemelisiniz. Bunun yerine, büyük bir turuncu düğmeyi tercih edin.
Renklerin dönüşümleri nasıl etkilediği bağlama bağlı olacaktır. Örneğin, mavi köprüler için web tasarımlarında yaygın olarak kullanılan bir renk olduğundan, insanlar onları her zaman köprülerle ilişkilendirir. Böylece metin mavi ise üzerine tıklayabileceklerini biliyorlar.
CTA düğmeleri için de geçerlidir. Maviyi seçmene gerek yok. Ancak, bir düğme için hangi rengi seçerseniz seçin, bunun bir eylemle ilişkilendirileceğini unutmayın. Sitenizdeki tüm CTA'lar için bu rengi tutarlı bir şekilde kullanın. Ancak tıklanabilir olmayan öğeler için aynı renkleri kullanmaktan kaçının. Ayrıca aynı sayfada farklı CTA renkleri kullanmayın.
8. Basit Tutun
Web tasarımında “bariz olan her zaman kazanır”. Bu nedenle düz, minimalist tasarım dönüşüm oranlarını artırır. Bunun nedeni ise en hayati unsurlara odaklanmış olmasıdır. Diğer dramatik görsel efektler üzerinde temiz bir tasarım ortaya çıkıyor. Bu yaklaşım, temel unsurlara odaklanarak ve bu süslemelerden kurtularak, dönüşüm oranlarını kesinlikle optimize edebilecek organize bir düzen oluşturmaya yardımcı olabilir.
Ayrıca, minimalist bir tasarım, ilgili CTA'lar için web sitenizde daha fazla alana sahip olmanızı sağlar ve böylece sayfanın gerekli olmayan öğelere sahip olmasını önler.
Minimalist tasarım harika olsa da, insanların ilgisini kaybedeceği için aşırıya kaçmamalısınız. Örneğin, CTA düğmelerinde, insanlar düğmeleri derinlik veya boyut ile görmeye alışkındır. Bu özellikler etkileşimin göstergeleridir.
Ancak düz bir düğmeniz varsa, ziyaretçileriniz sayfanızı taradıklarında bunu kolayca gözden kaçırabilirler. Bu nedenle, zıt bir düğme rengi kullandığınızdan emin olun. Ve düğmeleri görünür yapan bir konum seçin.
Bu nedenle, her sayfa oluşturduğunuzda, daha basit bir sürüme sahip olmanın bir yolu olup olmadığını kendinize sormalısınız. Basit tutarak, daha iyi dönüşümler ve estetik açıdan daha hoş bir tasarım bekleyebilirsiniz.
Basit bir tasarım, aynı anda daha az bilgiyi işleyebilen insanlara hitap eder. Ziyaretçileriniz bir sayfada çok fazla şey görürse bunalır ve ayrılırlar. Kullanıcınıza web sitenizde harika bir deneyim sunduğunuzda, gerekli olmayan unsurlardan kurtulduğunuzdan emin olun.
9. Gestalt Benzerlik İlkesini Takip Edin
Benzerlik yasasını ele alan bir tasarım ilkesidir. Burada yasa, insan beyninin aynı nesneleri gruplamayı sevdiğini belirtir. Bu mekanizma, insanların bir şeyleri anlamlandırmasına ve gürültülü ortamları düzenlemelerine yardımcı olur.
Bu ilkeyi uyguladığınızda, birbiriyle ilişkilendirilebilecek benzer öğeleri veya öğeleri gruplandırmanız gerekir. Bunlara dönüştürme düğmeleri, resimler ve referans kutuları dahildir.
Örneğin, dönüşümleri artırmak için katılım formunuz için harika bir referansınız olabilir. Referanslar kurşun mıknatıs için tasarlanmasa da, ziyaretçiler hala yakın oldukları için onları ilişkilendirebilir.
10. Yüz Ekle
İnsanlar başka bir insanın yüzünü gördüklerinde, o kişiyle empati kurmaya başlarlar. Bu nedenle, bir sorunu ilettiğinizde, ziyaretçileriniz onu anlayabilir veya onunla bir bağlantı hissedebilir. Bu nedenle uzmanlar, diğerlerinin yanı sıra makalelere, tercih edilen sayfalara ve vaka incelemelerine insan yüzlerinin dahil edilmesini önermektedir.
Markanızın bir destekçisi varsa veya markanızın yüzü iseniz, fotoğraf çekimi yaptırmanız gerekir. Fotoğrafçıdan, bir CTA veya metin yerleştirebileceğiniz, bir tarafında çok fazla negatif boşluk bulunan yatay çekimler yapmasını isteyin.
Bir emlak sitesi için, emlak fotoğrafının sırlarından biri, sadece bir evin veya mülkün bir bölümünün görüntüsünü değil, bir insan yüzü eklemektir. Model kiralayabilir veya sadece stok fotoğraflarını kullanabilirsiniz. Ancak seçtiğiniz yüzün markanızı doğru bir şekilde temsil ettiğinden emin olun. Hedef demografinizi yansıtan yüzler kullanmak, sitenizin dönüşüm oranını önemli ölçüde artırmanıza yardımcı olabilir.