internet pencereler Android
Genişletmek

Global markaların sayfalarını satmak için yüz düğme. Örnekler Harekete geçme çağrısı Yüz düğmesi nedir

Genellikle yüz öğelerin ihmalinin önemi. Tasarımcılar, aramanın eylem düğmesine tam olarak ne kadar verimli hale getirdiğini her zaman anlamıyor. Tam olarak bildiklerini, bu yüzden bu farkedilir ve sitenin genel tasarımına yaklaşması gerektiğidir. Bununla birlikte, verimliliğinin sırlarını anlamadan yüzün bir düğmesini geliştirmek imkansızdır. Bu maddenin önemi çok büyük.

Sonunda, yüz düğmelerinin ana amacı, ziyaretçileri bir şeyler yapmaya teşvik etmektir, yani ihtiyacınız olan eylemleri gerçekleştirmek için. Sepete mal eklenebilir, bazı malzemeleri indirebilir, bilgi isteyin, masa ve çok daha fazlası. Metin, boyutların, yerin ve diğer faktörlerin zımbalamaların dönüşümünü nasıl etkilediği en azından genel bir anlayışa sahip olmak önemlidir. Bununla başa çıkmak zor değil. Başarılı arama çağrısı düğmelerinin temel işaretlerini başlatalım ve düşünelim.

1. Onlar ikna edici

Metin, düğmenizin en önemli bileşenidir. Ziyaretçileri tıklamaya teşvik eden yetkili bir metin yazardır. Metin, faydaları vaat etmeli ve ziyaretçinin kişisel çıkarlarına erişmelidir. İlgili olması gerektiğine ek olarak, neler olacağını anlamak için açıkça ve kesin olarak vermelidir. Metin çizerken, ziyaretçinin yüz düğmesine tıklayarak ziyaretçinin tam olarak ne yazdığını alacağından emin olun.

2. Onlar doğru ve kısa

Düğmenizin metni kısa ve esasen olmalıdır. Uluslararası Pazarlama Ajansı Hubspot, yüz düğmelerinde 5 kelimeden fazla kullanılmasını önerir.

3. Eylemlere odaklanırlar

Yüz öğeniz, "get" veya "indir" gibi eylemin fiilleriyle başlamalıdır. İşte bazı örnekler:

  • Ücretsiz danışma alın
  • Şimdi İndirin
  • Özel erişim olsun
  • Ücretsiz Ders Kaydolun
  • Fiyatları karşılaştır

Ve ziyaretçilere "abone ol" ya da "gönder" ya da "Gönder" ya da "GET" ya da "deneyin" sunmak yerine. Onlara ver ayakta durmakBöylece onlardan beklediğiniz eylemi yaparlar.

4. İlk kişiden konuşurlar

Michael Aagaard tarafından yapılan test sırasında, bir gelişme şirketi uzmanı Açılış sayfası "Unfounters", ikinci kişi düğmesinin metninin (yani ücretsiz dersinizi alın) ilk kişiye (yani, ücretsiz ders al) CTR (tıklama)% 90 arttığını ortaya çıktı.

Birinci şahıs metin neden iyi çalışıyor? Çünkü kullanıcının bakış açısından bir eylemdir. Bu nedenle, ikinci kişiyi yüz öğenizde kullanmayı planlıyorsanız, her iki seçeneği de test etmeye çalışın ve izleyicilerinize hangi erişimin daha iyi çalıştığını görün.

5. Aciliyet hissi yaratırlar

İnsan doğasının özeti, sahip olamayacağımızı arzu etmeye meyilliyiz. Eksik olan şeylerin maliyetini arttırıyor ve fazlalığın maliyetini düşürüyoruz. Bu, arz ve talep dengesinin temelidir. Daha az ürün mevcuttur, o kadar değerli olur. Yüz öğelerinizde bu prensibi kullanın ve hoş bir sonuç göreceksiniz.

Böyle bir taktikleri her zaman kullanmanıza gerek yok. Aciliyet hissi, sadece bir kelime "şimdi" ekleyerek yaratabilirsiniz.

6. Ek bilgi içerirler (gerekirse)

Kullanıcıların kabiliyetini ve güvenini de arttırmak, aynı zamanda şüphelerinin önünde, sıklıkla sağlamak için gereklidir. ek Bilgiler. Örneğin, eylem için temyiz başvurunuz şunları içerebilir:

  • Para İade Garantisi (varsa)
  • İtirazın kapatılması (örneğin, "Başlangıç \u200b\u200biçin ödeme yapılması gerekmez", "20 saniye için kayıt")
  • Önemli avantajlar ("30 gün ücretsiz")

Bir eylem çağrısı geliştirirken, kullanıcı tarafından ortaya çıkabilecek olası sorunları ve şüpheleri düşünün ve zamanında onlara izin verdiğinizden emin olun.

Yüz düğmelerinizdeki ek bilgilerin her zaman gerekli olmadığı söylenmelidir, ancak bazen CTR'yi önemli ölçüde arttırır.

7. fark etmemek imkansızdırlar

Eylem için çağrınızın başarılı bir metni ne olursa olsun, kimse düğmesini görmezse, önemini kaybeder. Bu nedenle, atlamanın imkansız olduğundan emin olmalısınız. Bir mesafeden görülebilecek kadar büyük olmalı, ancak tüm tasarımlara zarar verecek kadar fazla olmamalıdır.

Düğmenizin yeterince büyük olduğundan emin değilseniz, test edin: Sitenize yerleştirin ve bilgisayardan 3-4 metre uzaklaştırın. İyi durdurmalısın. Yapamazsanız - düğme büyütülmelidir.

8. Tükenen renklerde boyanırlar.

Tasarımcılar ve pazarlamacılar en çok "dönüştürme" rengini aramaktan vazgeçmezler, ancak yüksek dönüşümü garanti eden evrensel rengin olmadığını kabul etme zamanıdır. İnsanlar, çevreden çıkan şeyleri bildirme eğilimindedir (ve ezberlemek). Bu nedenle, başarılı bir tek tuşun sırrı, sayfadaki çevre elementlerin diğer renkleriyle bir renk zıttır (yine de, sitenin toplam aralığından kaçmaz)

9. Bakmak zorunda değiller

Ziyaretçileriniz bir sonraki adıma hazırsa, düğmeyi aramada siteyi dolaşmamalılar. Tam olarak nerede görmeleri gerektiği ve bir sonraki anın gözlerini nereye sokacakları yerlerde bulunmaları gerektiğinde - en belirgin yerde. Ziyaretçilerinizi asla düğmeyi aramaya zorlamaya zorlamayın. İnsan düşüncesinin doğal hareketini takip edin. Formu doldurursa veya ürün bilgisini okursa, ST Box hemen derhal kullanıcının etkileşime girdiği içerik olmalıdır. Üzerinde uzun sayfalarBir çok bilgi, içerik boyunca daha sık harekete geçmek için çağrı yapmaya değer olduğu yerlerde.

Bu düşünce bariz görünebilir, ancak çok fazla site hata yapar. Apple bile yüzünü bariz bir yerde değil:

10. Başkalarıyla çatışmazlar

Büyük olasılıkla, bir seçeneğiniz varsa, kullanıcı herhangi bir işlem yapmaz. Karşılaştırma, analiz, seçeneklerin tahminleri bu tür zihinsel maliyetlerdir, bu da hiçbir şey seçmemesi ve devam etmemesi daha kolaydır. Yapılabilecek en kötü şey, yüz elemanlarınızı kullanıcının dikkatiyle başa çıkmak için zorlamaktır.

Bir sorunuz kendiniz sorun: Kullanıcıları sayfanızda yapmak için en önemli eylem nedir? Bu sorunun cevabı, bunun veya bu öngörülen sayfanın amacına bağlı olarak farklı olacaktır.

Açılış sayfasını tasarlarsanız

Sloganınız böyle gelmeli: "Bir sayfa bir amaçtır." Bir, en önemli, kullanıcı eylemine odaklanın.

Hala birkaç eylem sunmanız gerekiyorsa

Bazen sayfada birden fazla düğme yerleştirmeniz gerekir. Örneğin, "Giriş yap" ve "Kayıt Ol" kullanıcıları sunduğunuzda. Ancak, kullanıcılar birkaç eylem yapabileceklerse bile, seçimlerini yönlendirmelisiniz.

Görsel bir hiyerarşi oluşturun ve bu elementlere ağırlıklar ekleyin, dönüştürülmesi sizin için en önemli olanıdır. Ana Tek tuşunuz, kullanıcının dikkati için diğer yüzleriyle görsel olarak daha akılda kalıcı olmalı ve rekabette liderlik etmelidir.



11. Düzenli olarak test edilir ve ayarlanırlar

İnsanlar sık \u200b\u200bsık şudur: İyi bir dönüşümün göstergesi nedir?

İyi dönüşüm göstergesi, öncekinden daha iyi olanıdır.

Temyizelerinizin mümkün olduğu kadar verimli olduğundan emin olmanın tek yolu - düzenli olarak test etmek. Düğmelerinizin metni, boyutunu, rengi, yerini ve stilini değiştirin. Küçük değişiklikler bile büyük bir etkiye sahip olabilir. A / Test, daha iyi çalıştığını söyler, kullanıcı davranışını test etmek nedenini söyleyecektir.

"Gerçek çözüm, yeni bir eylem aldığınız gerçeğiyle ölçülür. Eğer eylem yoksa, gerçekten çözmediniz. "

Tony robbins

İkna edici sesler, değil mi?

İnternette bir şey aldığınızda son davayı unutmayın. Belki de bu satın alma, sosyal ağların katılımıyla işlendi. Bu yöntem bugün oldukça popülerdir ve pazarlamacılar sosyal ağlarda içeriği zenginleştirmek, vakıfları uygulamak ve farklı şekillerde "ikna edici derecede" güçlendirmek için mücadele ediyorlar.

Çevrimiçi satın alma kararınızın, postaya eşlik eden küçük bir düğme biçiminde sizi etkileyen eyleme yönelik harekete geçme temelinde yapıldığına dair bir şans var.

Sadece küçük bir düğme, ancak kararınızın nedeni olabilir ve ayrıca sizi alıcıya dönüştürmek isteyen şirket için mükemmel bir araç olabilir.

Sadece ikna edici bir şekilde yaratmak ve yargılamak için eylem çağrısı? Neden bazı aydınlık ve büyük düğmeler güvenilmez ve tıklamaları toplamaz ve sosyal ağlardaki temyiz başvurusunun ilk görüşünden tamamen ikna edilemezken, benzeri görülmemiş satış getirebilir mi?

Bu yazıda, bu sihirli pazarlama aracının gücünü ve faydalarını, daha fazla kullanıcıyı çekebilecek, satışları arttırabilen ve potansiyel müşterileri getirebileceklerini belirlemeye çalışıyoruz.

Ancak, çok temellerle başlayalım ...

Yüz ne var, bu konuda ne yapmalı?

"Şu anda hareket etme zamanı. Bir şey başlatmak için asla geç değildir. "

Antoine de Saint-Exupéry

Eylem ya da yüz (eylem çağrısı) çağrısı okuyucuları harekete geçirmek için motive eder. Böyle bir arama, bağlanmalarına, indirmelerine, satın almalarına, katılmalarına, kaydolmalarına, kaydetmelerine ve birçok eylemde bulunmalarına yardımcı olur. Bu, çok sık getiren inancın bir tür pazarlamasıdır. pozitif sonuçlar markalar.

Sosyal ağlarda yüz arasındaki yüz arasındaki fark nedir, diğer temyizlerden

. Veya pratik olarak hiçbir şey. En sık sosyal ağlarda, yalnızca "çağrınızı" belirli bir düzene "paketlemek için veya fantezinizi yeni bir tane geliştirmek için kullanmanız gerekir. CTA'nın sosyal ağlarda en popüler görünümü - düğme.

Tüm CTA'nın sosyal ağlarda en iyisi nerede?

Bu güzel bir tartışma sorusudur ve farklı faktörlere bağlıdır (örneğin, metnin uzunluğunda veya konusundaki). En sık, yazarlar, postaların sonunda veya sosyal ağlarda görüntülerin sonuna kadar ekler. Çağrı bir düğme, metin bağlantısı veya tamamen resim olarak görüntülenebilir.

Yüzde görevlerin analizini etkiledi

Mesajlarda eylem için bir arama eklemek neden önemlidir?

CTA, 3 ana iş hedefi elde etmeye yardımcı olur:

  • tıklatmalar
  • satış
  • katılım

Kuku.io analisti kullanarak yüzlerce mesajları kolayca takip edebilirsiniz.

Bir düğme formu ve renk çözümleri ile deneyebilirsiniz, dönüşümü artıracaktır. Gönderi, olumlu duygulara ve hoş yorumlara neden olabilir, ancak eylem çağrısı işin hedeflerine ulaşmasına yardımcı olacaktır.

Eylem için etkili bir çekicilik nasıl oluşturulur: Temel Bilgiler

Öncelikle, kiminle temyiz ettiğinizi ve ne aradığını açıkça anlamanız gerekir.

Tabii ki, ilk başta kafasında çok fazla yapılandırılmamış düşünce olacak: Arama nedir? Hangi eylem? Hedefler, motifler, kapsama ...

Sosyal ağlarda etkili bir CTA oluşturmak için 12 formüller

  1. Her bir sosyal ağ için CTA oluşturun veya uyarlayın

Sosyal ağların iş mekanizması, özellikle CTA'ya gelirse farklıdır. Facebook, Reklamları arama düğmeleri ile tıklanabilecek ve izleyebilecek eylemlere kullanmayı önerir. Instagram'da, sponsorluk içeriğinin sonunda kendi düğmenizi ekleyebilirsiniz.

  1. Gerçek değerler öner

Okuyucuların dikkatini çekmek ve belirli eylemleri almalarını sağlamak istiyorsanız, gerçekten değerli bir şey sunmalısınız. Ciddi teşvikleri ve gerçekte ne kadar faydalanabileceğini düşünün. Okuyucularınız, teklifinize neden ihtiyaç duyduklarını açıkça anlamalıdır.

  1. Ücretsiz bir seçenek sunar

Okuyucularınızı belirli bir şekilde hareket etmeye ikna etmek (kitabı indirin, abone olun e-postaÜrün satın alın, vb.), - Ücretsiz bir sürüm sunar.

"Abonelik formunu doldur ve al serbest erişim Webinar'a "

Düğme: "Ücretsiz Get"

  1. Kelime çağrısını kullanın

Asıl hedefinizin, net bir eylem yapmaları için okuyucuları motive etmek olduğunu unutmayın. Onları yararlı eylem fiilleri ile buna zorlayabilirsiniz. Kendi araştırmanızı harcayın ve bu fiillerin bir listesini oluşturun. Tanımsız veya müstehcen kelimeler, jargon veya ferahlardan kaçının.

  1. Dokunmatik Duygular

Çağrılarınızda, okuyucuların duygularına ve duygularına yaklaşmaya çalışın. Kayıtsız kalmamalılar. Parlak kelimeler ve çekiciler kullanın, çeşitli seçenekleri test edin. Küçük bir düğme bile, Instagram, Facebook, Twitter ve diğer sosyal ağlarda birçok aboneyi almaya yardımcı olacaktır.

  1. Yorgunluğunu hatırlatmak

İnsanlar tipik olarak birçok konuda hayal kırıklığına uğradılar ve sorunlarının çözümünü kesinlikle takdir edeceklerdir, bu da başarısını zorlaştırır.

"Etkin olmayan diyetlerden bıktınız mı?" Yeni protein kompleksimizi satın al ve 3 ay boyunca rüyanın cesedini yarat! "

Düğme: "Şimdi Satın Alın"

  1. Geçici sınırlamaları ayarla

Bu, aramanızı somut ve anlaşılabilir hale getirecektir. Örneğin, "Şimdi Deneyin", sadece "Lütfen deneyin" den daha ikna edici görünüyor.

  1. Basitleştirmek

Daha basit ve daha net, CTA metniniz, daha hızlı alıcılara ulaşacaktır. Okuyucu, teklifinizi anlamak için çok fazla düşünce süreç ve mantıksal görev yapmamalıdır. Metni bir kez okuduktan sonra, mesajın alıcıları ne yapmaları ve yapmaları gerektiğini anlamalıdır.

  1. Belirli bir mesaj alıcısına başvurun.

Doğrudan belirli bir okuyucuya dönüşen, güvenselsiniz ve harekete eğilimlidir. Okuyucular, onları önemsemenizi hissetmek önemlidir.

"Siz", "sizin", "siz", vb. Sözcükleri kullanın. Örneğin, "Ücretsiz setinizi deneyin".

  1. Dahil etmek

İletişime devam etmek ve daha fazla bilgi edinmek için teklif.

  1. Ünlü deneyimini hatırlat

"Madonna neden kozmetik ürünlerimizi kullanıyor"

"Denemek istiyorum" düğmesi.

  1. Çeşitli CTA'yı test edin.

Yüzün sonuçlarını izlemeyi unutmayın. Motivasyonlu hangi yazıların daha iyi çalıştığını ve hangi düğmelerin veya bağlantıların dikkatini çekmeyeceğini belirleyebilirsiniz. Adapte, hareket ettirin ve onlara "Lehçe" mükemmel durum. Bu analiz, seçenekleri aramanıza ve inme düğmelerini optimize etmenizi sağlar. Yararlı ölçümler kullanarak yayın sonuçlarını izlemek için tampon veya Kuku.io gibi analitik hizmet araçlarını kolayca kullanabileceğinizi unutmayın.

Artık, etkinlik için etkili temyiz oluşturma konusunda sorun yaşamanız gerekir.

Yukarıdaki formülleri ve önerilerinizin avantajlarını kullanın. Ve elbette, arzularını dikkate alarak ve kendinizi kendi yerlerinde sunarken, müşterilerin prizması boyunca her şeyi atladığınızdan emin olun. Düğmelerin tasarımına, renk çözümlerinin ve yazı tipi boyutuna dikkat edin. Size başarılı eylem için arama!

Bugün, "Eylem çağrısı" düğmeleri hakkında daha fazla CTA konuşacağız. CTA elemanları, başlıktan açık olarak, kullanıcıyı sitede herhangi bir işlem yapmaya çağırır. Ancak, tasarımcılar genellikle onlara dikkate almayın. Bu konudaki ilkelerin anlayışı, bitmiş ürünün verimliliğini artırırken. Bu malzemeden CTA düğmesini doğru şekilde nasıl oluşturacağınızı öğreneceksiniz.

Renk, boyut, içeriğin ve diğer faktörlerin CTA düğmesinin dönüşümünü nasıl etkilediği konusunda en azından genel bir fikre sahip olmak önemlidir. İlkelerin kendileri oldukça basittir, ancak site tasarımının planlama aşamasında kullanılmaları gerekir.

"Eylem çağrısı" düğmelerinin amacı

CTA düğmeleri çeşitli işlevleri taşıyabilir. Sonunda, "eylem çağrısı" hiçbir şey ifade edebilir. Ancak, sitenize gelen kullanıcıyı bir eylemde bulunmaya zorlamak için düğmelerin ana prensibi. Örneğin, ürünleri sepete ekleyin, bir şeyi indirin, bilgi verin vb.

Çağrı herhangi bir işlem yapabildiğinden, bir düğme oluştururken, hem eylemi hem de sitenin türünü hem de hedef kitleyi dikkate almanız gerekir.

"Eylem çağrısı" düğmeleri türleri

Var olmak Çeşitli tipler CTA düğmeleri. Aşağıda, kullanıcıyı aradıkları eylem türüne göre sıralanan en yaygın türleri bulacaksınız.

1. Sepete Ekle

Çevrimiçi mağazalar, bir kural olarak, bir dizi CTA düğmesi kullanın, ancak bunların en popülerleri "Sepete Ekle" düğmeleridir. Bu düğmeler genellikle sayfalara ürünle birlikte yayınlanır ve kullanıcıyı bir veya başka bir ürün satın almaya çağırır. Genellikle "satın al" veya "sepete ekle" veya bir banka kartı simgesine veya sepetiyle kısa bir metinle yayınlanırlar.

2. İndir

Düğmeler "Download" Lütfen, kullanıcıya sunulan konuyu ele geçirmesini sağlayacak, yani, indirin, indirin. Bu tür düğmelerde, tasarımcılar ayrıca kullanıcıya, örneğin ürün sürümünü ve dosya boyutunu ekleyerek daha fazla bilgi vermeyi tercih eder.

3. Deneme sürümü

Müşterinin bazı bölgelerinde, ona ürünün deneme sürümünü sunarak ilgilenmeye çalışıyorlar. Olabilir Ücretsiz indirin Veya sunulan veya ürün türüne bağlı olarak ücretsiz bir hesap. Bazı tasarımcılar, bu türün yüz düğmesinin tasarımında özlü olmaya çalışırlar, aksine birileri cömertçe cömertçe ek bilgi verir.

4. Daha fazla bilgi edinin

"Daha fazla bilgi edinin" düğmeleri genellikle teaser bilgi bloğunun sonunda bulunur. Genellikle bunlar basit düğmelerdir, ancak büyük bedenKullanıcının dikkatini çekmek için.

5. Kayıt

Kayıt düğmeleri en sık iki versiyonda bulunur. İlk durumda, düğme kayıt formuna yol açar, ikincisinde "Sepete Ekle" düğmesinin rolünü yürütür, hesaba ödeme yapmayı ve bundan sonra kullanmayı teklif eder.

Aynı zamanda yüz düğmeleri de var, ancak çoğu listelenenlere benzer. Ve yukarıda açıklanan düğmelere uygulanan ilkeler, muhtemel uygundur ve diğerlerinin çoğu.

Negatif alanla çalışmak

Muhtemelen sitenizdeki inme düğmelerinin içeriğin geri kalanının arka planına karşı tahsis edilmesini ve kullanıcının dikkatini çekti. Bunu yapmak için düğmelerin etrafındaki negatif boşluğu kullanın. İçerik ve STA-Düğmeler arasında hava oluşturun. Bazı durumlarda ("Sepete Ekle" düğmelerinde olduğu gibi), bu kural ihmal edilebilir, ancak çoğu zaman tasarımınıza verimlilik ekleyecektir.

Dengeyi unutmamak önemlidir. Negatif alanı hesaplamak için gereklidir, böylece düğmelerin boyutuyla orantılı görünmesi gerekir. Onları birbirimizden ayırmamız rağmen, düğmeler ve içerik tek bir kompozisyona benzemekte istiyoruz. Bu yüzden bazen mesafe ile deneme, tinker yapmanız gerekebilir.

  • Düğmenin yeterli olduğundan emin olun boş alan Ve tasarımda katılacak yer yok.
  • Negatif alanın boyutunu belirleyen, üçüncü veya altın bölümün bir kuralını kullanmaya çalışın.
  • Negatif alanın, düğmenin içeriğin geri kalanının arka planına karşı çıkmasını ve ondan ayrılmasını sağladığını izleyin.

Boyut ve renk

Düğmenin boyutu çok önemlidir. Çok büyük bir düğme İçeriğin geri kalanını istekli, çevresindeki içerik arasında işaretleniyor. Düğmemizin diğer unsurların arka planına karşı çıkması için de gereklidir, ancak aynı zamanda onları görsel olarak bastırmadı.

Renk, bir çift boyutta kullanılmalıdır. Büyük düğmeler için, tasarımınızın ana renginden daha az farklı olan bir renk seçin, ancak yine de arka plandan farklı olması gerekir. Küçük düğmeler için, ana rengin ile zıt parlak tonları kullanın. Ancak, herhangi bir durumda, düğmenin renginin genel tasarıma uyduğundan ve elemanların geri kalanını birleştirdiğinden emin olun.

  • İnme düğmeleri ideal olarak sayfadaki en büyük düğmeler olmalıdır.
  • Küçük düğmeyi vurgulamak için kontrast renkleri kullanın.
  • Büyük düğmeyi görsel olarak doldurmak için ana rengiyle renkleri daha az zıtlık kullanın.
  • Düğmeler yüzün dikkatini çekmesi gerekir, ancak tasarımı aşırı yüklemez.

Metin

Metin metninde kullandığınız tam ifadeler önemli bir rol oynayabilir. "Şimdi Satın Alma" aramasını karşılaştırın "Sepete Ekle". İlk seçenek çok daha acil ve eşit müdahaleci görünüyor. Metnin boyutu da önemlidir. Örneğin, gerekirse, "ücretsiz bir hizmeti deneyin", daha kısa bir seçenek tarafından değiştirilebilir " Deneme sürümü».

Düğmeleri tasarlamak için kullandığınız metin mümkün olduğu kadar basit olmalıdır. İlk bakışta kullanıcının düğmesine bastıktan sonra beklediğini anladığı gereklidir. Belirsizlikten dolayı şüpheleri varsa, dönüşümde kolayca kaybedebilirsiniz.

Metnin boyutunu unutma. Yazı tipi büyük ve gözle görülür, ancak elbette düğmenin kendisinin boyutuyla birleştirilmelidir. Metnin oldukça kontrast olduğundan ve kolayca okuduğundan emin olun.

  • Basit, anlaşılabilir bir dil kullanın.
  • Büyük, gözle görülür bir yazı tipi kullanın.
  • Metnin gerçekten eylem çağırdığından emin olun.

Aciliyet yaratma

Ziyaretçilerimizi mümkün olan en kısa sürede bizim için arzularını yapmak istiyoruz. Ve kimse ziyaretçiyi kandırmayacak olmasa da, düşünmek ve karşılaştırma için daha fazla fırsat sağlar, negatif bir cevap alma olasılığı o kadar yüksek olur.

Görevimiz, kullanıcının şu anda hareket etmeniz gereken izlenimini gerçekleştirmektir. Onları hemen harekete geçirmeleri için teşvik etmeniz gerekir. Ve yüz düğmelerinin tümü böyle çalışacağına (özellikle pahalı mallar satın almaya gelince), kullanıcının düşünmeden, ucuz veya özgür eylemler yapılmalıdır.

  • Hemen harekete geçmek için kullanıcıyı kaydolun
  • Kullanıcıya düşünce için bir sebep vermeyin.
  • Acillık etkisinin önemli olduğu gerçeğine rağmen, hiçbir durumda kullanıcıyı yanlış yönlendirmeyin.

Ek Bilgiler

Gerekirse, kullanıcıya sahne düğmesine tıklayarak ne alacağı hakkında daha fazla bilgi verin. Çoğu zaman "Deneme Sürümü" veya "İndirme" düğmelerine aittir. Tipik olarak, bu durumlarda, test sürümünün ne kadar süre çalıştığına, indireceğiniz dosyanın ne kadar veya programın hangi sürümünü indirileceğine dair bilgi verilir.

Düğmeye ek bilgi verdiğinizde, dikkatin noktasının hala eylem çağrısının kaldığından emin olun. Arama metnini daha fazla yapın ve ek bilgi daha az belirgindir.

  • Bilgileri yalnızca açıkça faydalı olacak düğmelere ekleyin.
  • Ek bilgi yalnızca bazı ST düğmelerinin (örneğin, "Deneme Sürümü" ve "İndirme" tiplerinde uygundur.
  • Eylem çağrısının kendisi hala düğmenizdeki en önemli metin olduğundan emin olun.

Öncelik

Sayfada birden fazla şey olduğunda düğmelerin önceliğini yerleştirmek gerekir. Elemanın önemini vurgulayın farklı yollarAncak çoğu zaman renk ve boyut yardımı ile yapılır.

Düğmenin önemini vurgulamak için tasarımın temel rengiyle kontrastını kullanın. Daha az kontrast renkleri, düğmenin önemini görsel olarak azaltmak için kullanır. Boyutu ile aynı hikaye. Düğmenin önemini seçin, daha fazlasını yapın ve önceliğe azaltın.

Simgeler ve görüntüler

Düğmelerin tasarımı Yüz simgeler de dönüşümde bir artış oynayabilir. Bir örnek "satın al" veya "İndir" düğmesindeki okundaki sepet simgesidir. Ayrıca ve benzersiz simgeler ve görüntüleri de kullanabilirsiniz, ancak düğmenin amacını tam olarak ilettiğinden ve kullanıcıyı yanılmadıklarından emin olun.

  • Düğmeye yerleştirilen düğmenin amacını anlamaya yardımcı olduğundan ve kullanıcıyı karıştırmadığından emin olun.
  • Kolay tanınabilir simgeler, kullanıcıya düğmenin değerini anında iletebilir.
  • Daha az popüler simgeler kullanmaktan korkmayın, ancak anlamlarının son derece net olduğundan emin olun.

Örnek

Aşağıda yüz düğmesinin başarılı bir tasarımının örneklerini bulacaksınız. Ve bazılarının yukarıda belirtilen ilkeler için değil, kuralların çoğu hala gözleniyor ve düğmeleri verimli çalışıyor.

Kayıt defteri.
"İndir" ve "satın al" düğmeleri için farklı renklerin kullanımı onları birbirinden ayırır ve satın alma düğmesinin önemini vurgulamaktadır.

Düğme tasarımı etrafında birçok anlaşmazlık var, çalışmalar yapılır. Ancak bir sonraki siteye gidiyoruz, bazen pazarlamanın tasarımdan ayrı olarak çalıştığını ve eylem çağrısının tamamen karşıt bir işlevi yerine getirmesiyiz. Ziyaretçiye "başarma!" Diye bağırıyor gibi görünüyor. Başarılı bir CTA'nın sırrı kimin bilmiyor (muhtemelen henüz ürünün ihtiyacına göre). Ancak bu sorunu incelemek için çok uzun zamandır adadık ve eylemlere başarılı bir çekicilikle ilgili ilginç yerler seçtik.

Mailchimp.

Sitede birçok düğme var, ancak "lansman için hazırlanın" penceresi oluşturun. posta şirketiBelki de en etkileyici. Mizah ile yapılır, süreci gösterir ve olağandışı olmayı çeker.

Metin olmasa bile, kırmızı düğmenin üzerinde bulunan şempanzelerin meşgul eli, ziyaretçinin yapması gerektiğini bildirir.

Yönetmek.

CTA düğmesi tüm hacmi doldurur ana sayfa. Başlık ve Kısa Metin Açıklamaları Sadece servisin yaptığını bildirir. Adres isteği, girdikten sonra hizmetleri kullanmaya başlamayı engelledi. Görsel satır ilginçtir ve içerik, yetkin bir şekilde istenen eyleme kadar aşağı iner.

Mavi önlük.

Ana sayfalar gerçekten bir dizi CTA'dır. Bu bölüm, okunmamış formatta ziyaretçiye bilgi iletir. Küçük bir ücretsiz teslimat simgesi bile güzel bir özelliktir. Mükemmel bir taze gıdaların bir arka planını ikna edici bir şekilde kanıtlamak için kullandılar. Ona baktığımda açlık deneyimlemeye başladın.

Spotify.

Mavi önlük olarak, Spotify, CTA'daki ana ticari argümanını gösterir. Ancak bir ziyaretçi için daha kolay ve daha uygun. Kaydırıcı vurgular Önemli bilgi Hizmet yayın müziği hakkında, ancak çoğunlukla daha fazla ayrıntı için tıklamayı teşvik eder. Sunmaya çalışmıyorlar, ancak abonelik veya bilginin yolunu kolaylaştırıyorlar.

Zillow.

Zillow - Gayrimenkul arayışı ile ilgili. Ve en başından beri, ziyaretçi CTA bölgesini bulacak, bu da gerekli eylemleri yapmasına izin verecek. Her şey, aramanıza gerek kalmayacak şekilde bulunur. Kolay ve minimalizm.

B & O oyna

Büyük bir doz güzel endüstriyel tasarım, toplanmayı görmek veya bu kulaklıkları satın alma sürecini başlatmak için bir teklifle birlikte. Ekstra bilgi yok ve muhteşem tasarım çekici bir eylemde bulunma.

Mercy Corcs.

Zorlu yaşam durumları yaptığınızda, harcayacağı zaman yoktur. Mercy gövdesi bir aciliyet duygusu yaratır. Fotoğraflar, cesur, ciddi bir başlık ile birlikte ziyaretçilerin durumun ciddiyetini anlayacağını garanti eder. Bize talihsizlikten etkilenen insanları görmemize yardımcı olurlar ve bir eylem yapmanın bir yolunu sağlayın.

Yuva

Tanınmış termostatların üretimi ve satışı için şirketin ana sayfası, enerji tasarrufu sağlayan ürünleri ile tutarlı olan "Dünyanın DNA'sı" hakkında raporlar. Parıldayan Yıldızlar B. arka plan modu Ürünün fotoğrafı ile birlikte uzayda yüzen bir gezegenin izlenimini gerçekten etkiler). Aynı zamanda, sayfa gereksiz unsurlar tarafından tırmanmaz ve alan yaratmaz.

Skagen.

Bu, diğer moda aksesuarlarla birlikte minimalist saati satan bir Danimarkalı şirketidir. CTA, renk kullanımı ve ilgili sadelik markanın olağanüstü olduğunu gösterir. Söylüyorlar - benzersiz bir ürününüz olduğunda, kendim hakkında kendimden bahsetmesine izin ver.

Patagonya

Bu spor ve yürüyüş kıyafetleri konusunda uzmanlaşmış bir şirkettir. Ana sayfalarının kaydırıcısı - Ürünlerin ve nedenlerin bağlantısı, ekolojik filmi destekleyen güzelce işlenmiş bir görüntüdür. Görüntü büyük, net. Ekranda bazı vahşi arazi getirmeyi istiyor. Onların anlamı hakları hedef kitle.

Eylem çağrısı

İyi bir CTA, izleyiciyi ve kullanıcı ile etkileşimin istenen sonucunu tanımlamalıdır. Renk ve görüntü oluşumu, markanın bir yansıması olmalı ve mesajı aktarmaya yardımcı olmalıdır. Metin kısa ve doğru olmalıdır.

Eylem çağrıları, her şeyden önce, kullanıcı yönünde doğru yönde mükemmel iş çıkarın basit yol. Bütün bu örnekler, karmaşıklığa karışmaya çalışmak için gerekli olmadığını göstermektedir. Yeterince basit ama anlaşılabilir kelimelerİnsanları harekete geçirmek için ikna etmek.

Speckyboy.com'a göre.

______________________________________________________________________

Malzeme, Metin Parti İçeriği Pazarlama Ajansı tarafından oluşturulmuştur.

İşinizde içerik pazarlamasını bağımsız olarak uygulamak ister misiniz? Topluluğumuza abone olun

Dönüştürme ile ilgilenmiyorsanız, bu makaleyi okuyamazsınız. Site için verimli bir düğme oluşturma önerileri, yalnızca müşterinin yollarını oluşturmanın yollarını arayanlar için yararlı olacaktır ve site ziyaretçilerini gerçek müşterilere dönüştürmek için faydalı olacaktır. Ve eğer böyle bir ihtiyaç varsa, eyleme temyiz başvurusu yaratma nüanslarını ortaya çıkarmaktan memnuniyet duyarız.

CTA düğmesinin rengi ve kontrastı, boyutu, konumu kendisi, harekete geçme metni - bu konuda önemsiz şeyler yok: tüm bu kriterler sitenin kullanılabilirliğini etkileyecek ve doğal sonuçlar verecektir. CTA elemanlarının belirtilen parametrelerini en üst düzeye çıkarmak için konuyla ilgili birkaç malzeme sunar. Onları okuduktan sonra, takdir edeceksin gerçek örnekler Web uygulamasından, grafiksel bir arayüz oluştururken temel hataları öğrenin ve en önemli şeydir - kendi web kaynağınızda ne test edeceğiniz hakkında bir fikir edin. Hadi devam edelim.

Dönüşümlü renk

Çeşitli kaynaklara göre, kayıt formu gmail için bir CTA düğmesi oluştururken, geliştiriciler 41 ila 50 mavi tondan test edildi. Deneye 425 bin'den fazla gönüllü test cihazı katıldı, bu da neredeyse ideal bir dönüştürme gölgesini tanımlamayı mümkün kıldı. Ancak bu, geliştiricilerin Google kullandıkları anlamına mı geliyor, tüm sitelerin geliştiricileri örnek için alabilir mi? Tabii ki hayır.

Mavi Google uzmanlarının aynı tonu, başka bir ürünün sayfasında - Picasa, ancak Chrome Web Tarayıcı sitesini açın - ve tamamen farklı bir ton göreceksiniz. Bu onaylar: Arama düğmelerinin harekete geçirilmesi, sitenin konusu, aktivite alanı, faaliyet alanı, hedef kitlenizin tercihleri, bir bütün olarak tasarımı, tonların fizyolojik üzerindeki etkileri gibi faktörler kümesiyle belirlenir. vücutta ve diğerlerinde süreçler.

Soğuk tonlar - Mavi veya mavi olsun - güvenilirlik, kararlılık, huzur ve buna göre, güven. Benzer bir etki, site için yeşil düğmelerdir: bir indelinasyon, doğallık, güvenlik - hangi bilgileri taşırlar. İndirmeler için yeşil kullanın (antivirüs programları dahil), ücretli servis paketlerinin etkinleştirilmesi, mevduat.

Yeşil, toplu indirim sitelerinde eylem çağırmak için kullanılan aynı renktedir. Bu tür lider hizmetleri "bir kupon satın al", Kupibonus, Groupon, "faydası", CityCoupon, Boombate, Bigbuzzy ve diğerleri gibi bulacaksınız. Etkileyici bir liste - ve bu, varsayılan paylar ve indirimler, tamamen farklı renklerle ilişkili olmasına rağmen.

Mağazanın dönüşümünü arttırmak için ideal, çoğu tasarımcının portakalını tanır, sonuç olarak, profesyonel medya topluluklarına ve forumlara göre, büyük bir turuncu düğmesinin mitini daha iyi bir şekilde işgalci olarak yaydığı sonucudur. Turuncu bir kaide üzerinde sulama, tasarımcılar etrafında dans edecekler ve değerlendirme için tüm yeni perspektifleri bulacaklar. Nitekim, turuncu enerji ve yaratıcılıkla ilişkilidir - bir yandan direnç ve kararlılık - diğer tarafın yanı sıra arkadaşlık - üçüncü ile. Buna ek olarak, bu renk agresif kırmızı ve temkinli sarı renkler arasında ara pozisyonu kaplar. Sitenizdeki turuncu çağrıyı denemek için argüman değil mi?

Sarı, liderin başına gelir ve elbette, aynı etkiyi üretir - harekete geçmeyi teşvik eder. Bu renk zeka, eğlence, canlılık ile ilişkilidir; Anksiyete neden olmadan, genel bir arka plan üzerinde durur ve mutluluk hissi verir. E-postaya form ve abonelik göndermek için harika renk.

Ancak, tüm renklerin en tartışmalı olduğu, kırmızı var. Onaylamak için birkaç örnek veriyoruz. Canlı Casino web sitesinde CTA unsurlarını takdir etmek için, test cihazları renklerini değiştirdi: Kırmızı, Gri, Siyah, Mavi, Mor, Sarı, Yeşil ... Liderlere yol açan, Cliquaty'yi artıran ikincisiydi. % 43.

Aynı zamanda, kırmızı düğmeler en kötü sonucu gösterdi -% 29:

Ve bu tür bölünmüş test sonuçları bulacaksınız. Bu yüzden haşhaş rengi uzun zamandır "Adam" gölgesinde idi ve bir CTA oluşturmak için kullanılmadı. Dahası, kaygı, tehlike, virüsler ve yasaklayan trafik sinyaliyle ilişkili olan, birçok tasarımcı ve web arayüzü tasarımcıları tarafından yapılan kırmızı renk çağrısı, bu şekilde reddetti.

Daha büyük, test cihazlarının sürpriziydi, şirketin kırmızı performans gösterebileceğini buldu - en verimli renk. İlham verici bir yeşilden% 21 dönüşüm verdi.

Bölünme testi neden bu sonuçları gösterdi, haklı çıkarmak zordur ve bu puandaki anlaşmazlıklar hala devam ediyor ... ama emsal kalıyor.

Ek olarak, CTA elementinin renginin, hedef kitlenizin tercihlerine göre seçilmesi gerektiğini unutmayacağız. Duyusal pazarlamaya göre, kırmızı liderliğin rengidir. İnsanların aktif ve aktif olanları tercih eder: sporcular ve politikacılar, kumar oynatıcıları, herhangi bir alandaki kariyerciler ve ergenlik sırasında gençler.

Çirkin yok, - mütevazi hizmetçinin büyük bir fedakarlık olduğunu düşünmeyin, sadece renkler hakkında monologu devam ediyor. grafik Tasarım. Böylece, özellikle göreviniz için uygun olmayan tonlar vardır. Bu nedenle, CTA düğmesini boyamadan önce, unutmayın: mor, servet, lüks ve sihirle ilişkilidir, ancak depresif durumlara sokulabilir. Pembe menzilde yapılan çağrı, kadın ve çocuk konularının bölgeleri için uygundur, ancak seçimi genel bir arka planda sağladı. Zarif siyah, elit butiklerin sepet sahiplerine mal göndermek için kullanılır ve gri bir ciddiyet ve titizlik duygusuna neden olur ve bu nedenle muhafazakar bir alıcı için tasarlanan malları veya hizmetleri teşvik eden sitelerde vazgeçilmezdir.

Yukarıdakilerin tümü, birkaç sonuç çıkarabilirsiniz:

  1. Etkili CTA elemanları herhangi bir renkte olabilir, ancak hepsi sitenizde eşit olarak çalışmaz.
  2. Site için sadece empirially için renk düğmesini seçebilirsiniz, bunun için şiddetle A / B testi öneririz.
  3. En önemli şey bir renk değildir, ancak aşağıda ne konuşacağımız hakkında arka plan ile iyi bir kontrast.

CTA-element ile arka plan ile kontrast

Kontrast renkler hakkında konuşan, aslında bir renk çemberindeki triamların yanı sıra tamamlayıcı çiftler. Renk teorisine aşina olmayanlar için, "Mikserler" rengini görmenizi öneririz - yani, parazitleri almanıza ve birleştirmenize izin veren programlar. Tacınız Adobe Kuler veya Renk Schemer olabilir - rengin tüm incestlerini bulmak için burada iş yoktur ve daha uygun bir şey biliyorsanız, lütfen yorumlarda bildirin.

Renk çemberinde, tamamlayıcılar birbirinin karşısında bulunur (yukarıdaki görüntüye bakın); Ve bu tür renkleri yakında yerleştirirseniz, her biri daha parlak görünecektir. Benzer etkisi mavi ve turuncu, kırmızı ve yeşil, sarı ve mor ve diğer renk çiftleri oluşturur.

Aşağıda mükemmel bir tamamlayıcı takviye örneğidir. Hem CTA elemanları mükemmel bir şekilde yeşil bir arka plana sahip, görsel olarak adanmış temyiz başvurusunu atlamak zor olacak.

Benzer bir grafik izolasyon yöntemi kullanılır sosyal platform Tıbbi tavsiye için. Bu, yalnızca üç renk bir yana kontrast yapmanın bir istisnasıdır. Önemli olan, eylem çağrısının ılık tonları olmalı ve arka planın soğuk tonuyla kontrast yapılması ve bunun aksine bu kuralın gözlenmesidir. Termal kontrast o kadar güçlüdür, turuncu CTA düğmesinin tam anlamıyla arka planın arkasında oldukça aktif ve alapotik bir görüntünün arka planında bile göze çarpıyor.

Bir açıklamada kırmızı-yeşil tamamlayıcı bir çift gerektirir.

Bildiğiniz gibi, en yaygın Daltonizm şekli dezenfektedir. Ve bu görsel kusur, birlikte birleştirilen kırmızı, sarı ve yeşil renklerin çözülmemesidir. Sonuç olarak, rahatsız edici rengli ziyaretçi alanı yaklaşık aşağıdakileri görüyor:

Bu nedenle yeşil bir arka plan üzerinde kırmızı düğmeleri veya kırmızı ve yeşil renklerin hareketine alternatif arama elemanları kullanmanız önerilmez. İlk durumda, kullanıcının eylem çağrınızı harekete geçirmediğini ve ikincisinde, öncelikleri anlamadığı ve daha az istenen bir geçiş veya eylemde bulunmadığı gerçeğini tehlikeye atarsınız.

CTA ve beyaz boşluk (boşluk)

Arama düğmesini harekete geçirmek için en kolay tekniği - Görünüm alanından diğer tüm nesneleri ortadan kaldırmak için. Çevresindeki boş alan, CTA elemanına odaklanır ve özel durumunu vurgular.

Bu konuda ideal, Dropbox Hizmeti'nin Hedef Sayfasıdır: Kontrast düğmesi Serbestçe "nefes alır" beyaz bir arka plan üzerinde, soldaki boğulmuş görüntü özel dikkat için rekabet etmemektedir ve bu işlemin ne yapılması gerektiğini hemen temizlemektedir. Yapmak. Buna ek olarak, özlü tasarım, hizmetin kendisinin basitliği ve kullanım kolaylığı ile ilişkilidir - ve bu harika bir hamle.

Serbest alan kullanmanın bir başka avantajı içeriğinizi yapılandırmaktır. Tüm bilgilerin altındaki site, ana CTA öğesinden silinen küçük görsel bloklarda toplanır.

Tamamlayıcı mavi ve turuncu mükemmel uyumlaştırılır ve aynı zamanda birbirlerini kesmeyin, boş alan içeriğin anlaşılmasına katkıda bulunur. Örnek basitlik ve netlik.

Beyaz arka plan - yüzey arka plan çözümü üzerinde yalan. Bununla birlikte, CTA-buton izolasyon etkisi neredeyse herhangi bir arka planda elde edilebilir. Daha önce de belirtildiği gibi, "sıcak" grafik öğelerinin soğuk tonlarının arka planını iyice vurur. Ve derin siyah bile harika bir bakış açısı verebilir, bakınız:

Yeterince ağır renk gamına rağmen, kullanıcının dikkatini üç görsel merkeze yüklenmemiş ve odaklanmamıştır: logo, portföyün kendisi, harekete geçme çağrısı düğmesi. Markalaşma ajansının sayfasındaki klasik siyah ve kırmızı kombinasyonu, kısıtlanmış ve şık görünüyor. Bu sayfada ne yapardın? Sunumu indirdik.

Böylece, tek renkli çözüm, web tasarımında aksanları düzgün şekilde düzenlemeye yardımcı olur. Bununla birlikte, geçmişin renk değişikliği değil, dönüşümü ve homojenliğini arttırır. Bu ifadenin birkaç örnek daha göz önünde bulunduracağından emin olmak için. Aşağıda gençlik tişörtlerini satan benzer yerlerdir.

İlk iki slayt - Rus tasarımcısı Tandem Svetlana Sviridova ve Dmitry Black.

Entelektüel gençlik için örme bir ürün satın almak için, birinin simgesine tıklamanız gerekir. sosyal ağlarNerede, sırayla, alışveriş merkeziyle ilgili bilgilerle tanışın. Böyle bir yol, okuyucuya "gidiş" - ya da daha doğrusu, hasta ve ağrıyor.

Bu durumda, sitenin sosyal düğmeleri - kullanılan tek CTA öğesi. Bir rengarenk gri arka plan üzerinde sol alt köşedeki konaklamaları, algıyı önemli ölçüde karmaşıklaştırır. Dönüşümü artırmak için, yeniden tasarlanmayı düşünmeye değer. Bir seçenek olarak - Parlak homojen bir blokla VKontakte ve Facebook'u değiştirin veya "vurgulayın" simgelerini değiştirin.

Benzer hata gör ve Amerikan giyim mağazalarının sayfalarında. CTA elemanı, mallardan en uygun mesafededir, ancak rengarenk arka plan aramayı keser. Kullanıcının dikkati dağılır - böyle ormanda, düğmeyi görmek kolay değildir.

Açıkçası, "Bisiklet" agresif kaplan arka planına, erkekler hala bir çıkış yolu buldu. Yoğun bir yeşil konturlu bir CTA düğmesini vurgulayarak, gerekli kontrast elde ettiler, bu da dönüştürülmesinde% 6,3 artışla sonuçlandı.
Bu istatistik oldukça açıklanmıştır. İlk durumda ise, siyah düğme, tasarımın diğer unsurlarıyla birleştirildi, sonra ikincisinde - organik görünüyor, ancak akılda kalıcı görünüyor. Ek olarak, metnin kullanıcı üzerindeki basınç daha nötr ile değiştirildi. Ve bu konuda.

Ve bu makalenin sonunda, bir kez daha Steve işlerinden önce şapkayı çıkarın. "Tasarım, öğenin nasıl göründüğü gibi değil, işlediği gibi," tasarımcı, bu Genius'u iddia etti ve açıkça bu temel almıştı. Kendi web sitenizin grafik arayüzü üzerinde çalışırken sadece sözlerini hatırlayın.

Arama düğmesi sitenizde neye benziyor? Ve renk ve mekan ile manipülasyona bağlı olarak dönüşümü arttırma potansiyelini biliyor musunuz?