Uzmanlardan İpuçları ile Bir Açılış Sayfası Tel Çerçevesi Nasıl Oluşturulur

Yayınlanan: 2018-05-08

Tıklama sonrası bir açılış sayfası, genellikle insanların markanız hakkında gördüğü ilk izlenimlerden biridir, bu nedenle onu istisnai kılmak önemlidir. Tıklama sonrası bir açılış sayfası tel çerçevesi, sayfayı gerçekten oluşturmadan önce sayfa öğelerinin düzenini görselleştirmenize izin vererek bu konuda yardımcı olabilir.

Tıklama sonrası açılış sayfası tel çerçevesi nedir?

Tel kafes, paydaşlara sayfanın nasıl yapılandırılacağı ve onu oluşturmak için hangi varlıkların gerekli olduğu hakkında bir fikir vermek için tıklama sonrası açılış sayfasının temel tasarım düzeni veya iskeletidir.

Instapage için Görsel Tasarımcı olan Rares Cimpean şöyle açıklıyor:

Tıklama sonrası bir açılış sayfası tel çerçevesi oluştururken sayfanın akışına, kullanılabilirliğine ve erişilebilirliğine, insanların ihtiyaç duydukları bilgilere ne kadar hızlı ulaşabileceklerine, CTA'nın ne kadar erişilebilir ve tanınabilir olduğuna vb. odaklanmalısınız. Tüm bu faktörler tel çerçeveleme aşamasında dikkate alınır.

Hem uzun hem de kısa bazı tel kafes tıklama sonrası açılış sayfası örnekleri:

Tıklama sonrası açılış sayfası tel kafes şablonu birkaç ana amaca hizmet eder:

Kalem ve kağıt eskiziniz ve ilk prototipiniz arasında bir orta yol olarak hareket etmek için
Sayfada görüntülenecek içeriğe genel bir bakış sunmak için
Sayfa yapısının bir planını sağlamak için
Kullanıcı arayüzünün genel yönünü iletmek için

Not: Tüm kampanyalara uyan tek bir tıklama sonrası açılış sayfası tel kafes tasarımı yoktur. Bazı tıklama sonrası açılış sayfaları, yalnızca bir başlık, madde işaretli kopya, form ve CTA düğmesi gerektirebilirken, diğerlerinin ek faydaları vurgulaması ve sosyal kanıt göstermesi gerekebilir. Örneğin, satış sayfaları genellikle daha ayrıntılı ürün açıklamaları gerektirir ve daha uzun olması gerekebilir. (Hangisinin daha iyi sonuçlar verdiğini görmek için her zaman kısa bir sayfa ile uzun bir sayfa arasında A/B testi yapabileceğinizi unutmayın.)

Ne tür bir sayfa çerçeveliyor olursanız olun, Grafik Tasarım Müdürümüz Rafal Bogdan, ilgili paydaşları bunaltmamak için ilk başta tel çerçevenizi çok basit tutmanın önemini ifade ediyor:

Bir sonraki aşamada paydaşlar tarafından reddedilebilecek unsurlara çok fazla odaklanmak istemiyorum. Tel çerçevenin ana fikri, belirli proje özelliklerini tıklama sonrası açılış sayfasında göstermek ve bu özelliklerin gerçek sayfada nasıl davranacağını anlamalarına yardımcı olmaktır.

Tel çerçevenizi aldıktan sonra, tasarımın onu parlatma zamanı. Aşağıda, genellikle yüksek dönüşüm sağlayan tıklama sonrası açılış sayfalarında bulunan öğeler yer almaktadır.

Tıklama sonrası açılış sayfası nasıl tel çerçevelenir

Navigasyon yok

Tıklama sonrası açılış sayfaları dönüşüm için ve tek bir amaç için tasarlandığından, kullanıcıları dönüşüm hedefinizden uzaklaştırabilecek gezinme bağlantıları olmamalıdır. Ya dönüştürün ya da bırakın - başka seçenek yok.

Birçok şirket, gezinme çubuklarını kaldırdıktan sonra dönüşüm oranlarında önemli değişiklikler gördü:

Career Point College, üst gezinme çubuğunu kaldırdıktan ve form düzenini değiştirdikten sonra dönüşüm oranında %336'lık bir artış elde etti.
Yuppiechef, gezinme çubuğunu kaldırarak dönüşüm oranlarında %100'lük bir artışa (%3'ten %6'ya) tanık oldu.
SparkPage, A/B testi yaptıkları ay boyunca, en üstteki gezinmelerini kaldırarak dönüşüm oranında %9,2'den %17,6'ya yükseldi.

Comporium Medya Hizmetleri, dönüşümleri en üst düzeye çıkarmak için gezinmeyi kaldırma gereğini anlayan başka bir markadır. Ziyaretçileri sayfada tutan ve danışma talep etmeye odaklanan logoları bile bağlantılı değil:

En iyi uygulamaları takip ederken, yalnızca güvenilirliği artıran bağlantılar (örn. Kullanım Koşulları ve/veya Gizlilik Politikası) ve kullanıcı deneyimini geliştiren bağlantılar (bağlantı etiketleri ve tıkla ve ara telefonu gibi) kullanılmalıdır. sayı).

Başlık ve alt başlık

Başlığınız en önemli unsurlardan biridir çünkü zorlayıcı bir başlık olmadan ziyaretçiler teklifinizi değerlendirmeye devam edecek kadar ikna edilemez. Bu, mesajınızı iletmenin birincil yolu olduğundan, dikkat çekmeli, kullanıcılar sayfaya ve ekranın üst kısmına gelir gelmez açıkça görünür olmalıdır.

Alt başlığınız, özellikle birincil başlık uzunsa veya ek bağlam gerektiriyorsa (örneğin bir istatistik gibi) birincil başlığınızı tamamlamak için kullanılır.

İyi bir başlık yazmanın anahtarı, benzersiz değer teklifinizi (UVP) veya ürününüzü veya hizmetinizi rakiplerinizden ayıran şeyi iletmesini sağlamaktır.

Bu Autopilot tıklama sonrası açılış sayfası başlığı, şirketlerin diğer pazarlama otomasyon yazılımlarına kıyasla Autopilot üzerinde "Daha hızlı büyüyebileceklerini" bilmelerini sağlar. Alt başlık daha sonra nasıl daha hızlı büyüyebileceklerini açıklayarak bu fikri tamamlar:

UVP'nizi eklemeye ek olarak, dört ana ilgi çekici başlık türü vardır:

Haberler: Beklentilere yeni bir çözüm getirin
Kişisel çıkar: Potansiyel müşterilerin doğal çıkarlarına hitap etmek<
Hızlı ve kolay çözüm: Potansiyel müşterilerin hızlı düzeltme isteklerine hitap edin
Merak: Ziyaretçilerin ilgisini ve merakını artırarak onları daha fazlasını okumaya teşvik eder

Daha da güçlü bir başlık için birini kullanabilir veya birkaçını birleştirebilirsiniz. En ilgi çekici başlıklar iki veya daha fazlasını kullanır.

medya

İnsanların görselleri işlemesi metinden daha kolay olduğu için, ilgi çekici medya (resimler, gifler ve video) bir teklifin değerini kelimelerden bile daha fazla iletmeye yardımcı olur. Ancak, görseller tek boyutlu bir çözüm değildir. Tıklama sonrası açılış sayfanız için seçtiğiniz medya türü, sunduğunuz ürüne bağlıdır.

Tıklama sonrası açılış sayfası resimlerinin türleri şunları içerir:

Kahraman çekimleri: Ziyaretçilere ürün veya hizmetinizin hayatlarını nasıl daha iyiye doğru değiştireceğine dair bir fikir verin
Ürün resimleri: Ziyaretçilerin, ana özellikleri de dahil olmak üzere teklifinizin ayrıntılarını görmelerini sağlayın
Infographics: Ziyaretçilerin verileri ve istatistikleri (tablolar, grafikler vb.) daha kolay kavramsallaştırmasına izin verin

iContact'ın potansiyel müşterilere oluşturmaya yardımcı oldukları iş e-postalarının birkaç örneğini göstermek için kullandığı resimlere bir göz atın:

Resimlere ek olarak, birkaç tür tıklama sonrası açılış sayfası videosu vardır:

Açıklayıcı videolar: Ürününüzün nasıl çalıştığını açıklayın - özellikle yeni veya karmaşıksa - potansiyel müşterilerinize nasıl fayda sağlayacağına odaklanarak
Tanıtım videoları: Yeni şirketleri tanıtın , yeni ürünleri duyurun veya yeni ürün özelliklerini vurgulayın
Video referansları ve vaka çalışmaları: Gerçek, memnun müşterilere ürün veya hizmetinizle ilgili memnuniyetlerini ve başarılarını açıklayarak göstererek sosyal kanıt olarak hizmet edin

Görsel kullanıyorsanız, teklifinizin gerçekçi bir durumunu yansıtmadığı ve konuyla alakalı olmadığı sürece stok fotoğraflardan uzak durun. Daha azını alırsanız marka algınızı ve değerinizi düşürme riskiyle karşı karşıya kalırsınız.

kopyala

Ziyaretçilere teklifiniz hakkında her şeyi söylemeye ne kadar istekli olursanız olun, yapmayın. Dikkat süresi en fazla birkaç saniyedir, bu nedenle metniniz kısa ve öz olmalı ve insanların dikkatini hemen çekmelidir.

Örneğin, madde işaretleri (ikonografi, onay işaretleri, oklar vb. ile işaretlenmiştir) önemli bilgileri aktarmanın yaygın bir yoludur, ziyaretçilerin sayfayı hızlı bir şekilde taramasına ve teklifin önemli çıkarımlarını belirlemesine olanak tanır.

Beklentiler, kalın bölüm başlıkları, minimum kopya ve madde işaretleri yardımıyla Highfive'ın video konferans çözümü hakkında hızlı bir şekilde bilgi edinebilir:

Sosyal kanıt

Dönüştürmeden önce, insanların şirketinizin güvenilir bir hizmet sunduğuna güvenmeleri gerekir. Sosyal kanıtın onları çeşitli şekillerde ikna edebileceği yer burasıdır:

Müşteri referansları: Doğrudan müşterilerinizden doğrulandığı için (belirli bilgiler, istatistikler, tam adlar, profesyonel bağlantı ve unvanlar ve vesikalık görüntülerle) sözünüzü yerine getirdiğinizi potansiyel müşterilere gösterin.
Müşteri logoları (ve sayıları): Halihazırda birlikte çalıştığınız tanınmış şirketleri (ve kaç tane) görüntüleyin ve ziyaretçilere "Ürünümüz veya hizmetimiz onlar için yeterince iyi olduğu için sizin için de olacaktır."
Sektör ödülleri: Sektör liderleri, muhabirler, haber istasyonları, web siteleri vb. tarafından herkese açık olarak tanındığınızı gösterin.
Güven mühürleri: Beklentilerin ödeme bilgilerinin güvenli ve dış taraflardan güvende olmasını sağlayın.
Gizlilik Politikası: Beklentilere e-posta adreslerinin uygun şekilde kullanılacağını ve başkalarıyla paylaşılmayacağına dair güvence verir.

Daha önce aynı Highfive tıklama sonrası açılış sayfasına bakıldığında, ziyaretçileri dönüşüme ikna etmek için kullandıkları tüm sosyal kanıtları inceleyin - marka logoları, alıntı bir referans ve sektör yıldız derecelendirmeleri:

İşte bu sefer Splash Omnimedia'dan her türlü sosyal kanıtı içeren başka bir örnek - bir müşteri sayısı, marka logoları, vaka çalışması videosu ve alıntılanan referans:

Tüm bu kanıtları birleştirerek, potansiyel müşterileri CTA düğmesine tıklayarak dönüştürmeye ikna edersiniz.

Potansiyel müşteri yakalama formu

Mükemmel formu yaratmak o kadar kolay değil. Yeterli form alanı yok ve ihtiyacınız olan tüm bilgileri toplamayacaksınız; çok fazla alan ve potansiyel müşterileri korkutma riskiniz var. Formunuzun uzunluğu, teklifinizin pazarlama dönüşüm hunisinin neresinde olduğuna bağlıdır. Genel bir kural olarak, ne kadar yüksek olursa, form o kadar kısa olur ve bunun tersi de geçerlidir.

Justworks, bu tıklama sonrası açılış sayfasını fiyatlandırma bilgisi sağlamak için tasarladı. Bu, dönüşüm hunisinin en üstünde bir teklif olduğundan, yalnızca üç alandan oluşması ve çok temel bilgiler talep etmesi mantıklıdır:

Buna karşılık, Autopilot'un ücretsiz denemesi, dönüşüm hunisinin daha aşağısındadır, bu nedenle daha fazla bilgi istemek kabul edilebilir:

Eylem çağrısı

CTA düğmeniz, tıklama sonrası açılış sayfası dönüşümünün gerçekleştiği yerdir, bu nedenle öne çıkmalı ve tıklanmak için yalvarmalıdır. CTA düğmenizi optimize etmenin başlıca yönleri şunlardır:

Renk: İyi bir kontrast oluşturan ve sayfanızın geri kalanından ayrılan bir ton, ton, renk tonu veya gölge bulmak için renk teorisini kullanın.
Kopyala: “Gönder” ve “İndir” geneldir ve ilham vermez. Bunun yerine, özel, kişiselleştirilmiş kopya oluşturun ve daha fazla CTA düğmesi tıklaması oluşturmak için "siz", "sizin", "ben" ve "benim" kelimelerini birleştirin.
Boyut: İnsanları düğmeyi aramaya zorlamayın - dikkat çekici hale getirin . Volusion tıklama sonrası açılış sayfasındaki zıplayan oklar gibi görsel ipuçları da içerebilir.
aşağıda - daha da fazla dikkat çekmek için:

Minimum altbilgi

tıklama sonrası açılış sayfası ve web sitesi altbilgileri aynı değildir. tıklama sonrası açılış sayfası altbilgileri site haritaları, ürün sayfası bağlantıları veya sosyal medya hesapları içermemelidir. Eklediğiniz her bağlantı, başka bir dikkat dağıtıcı ve dönüşüm yapmadan sayfanızdan ayrılmaları için ek bir yol oluşturur.

Infegy'nin ziyaretçilerine sunduğu tüm bu kaçış yollarına bakın:

Tıklama sonrası bir açılış sayfası altbilgisi eklemeyi seçerseniz, Tapstone'un yaptığı gibi yalnızca güncel telif hakkı bilgilerini, hizmet şartlarını ve bir gizlilik politikasını görüntülediğinden emin olun:

Beyaz boşluk

Beyaz boşluk, sayfanızın nefes almasını sağlar, böylece tüm öğeler dikkat çeker ve ziyaretçiler sayfanızda daha kolay gezinebilir. Ayrıca beyaz boşluk eklemek:

Dağınıklığı azaltır
Okunabilirliği artırır
Görsel hiyerarşi kurar
Tıklama sonrası açılış sayfanızın daha profesyonel görünmesini sağlar

Aşağıdaki tıklama sonrası açılış sayfalarını NASM ve Acquisio'dan karşılaştırın:

NASM'nin sayfası kalabalık ve ilk olarak nereye bakılacağına ve sayfada nasıl gezinileceğine karar vermek zor olduğu için bazı insanlar için bunaltıcı olabilir. Acquisio'nun sayfası yeterli beyaz alana sahiptir, bu nedenle yukarıdan aşağıya gezinmek daha kolaydır ve genel olarak daha iyi bir deneyim sunar.

Her şey bir tıklama sonrası açılış sayfası tel çerçevesiyle başlar

Bir tel kafes oluşturmak, ekibinizin genel sayfa hikayesini belirlemesine, hangi varlıklara ihtiyaç duyulacağını ve ne kadar kopya gerektiğini görmesine olanak tanır. Buradan, yukarıdaki önerilerle optimize edilmiş bir tıklama sonrası açılış sayfası tasarlayabilirsiniz. Ancak kişiselleştirilmiş, %100 özelleştirilebilir bir tıklama sonrası açılış sayfası oluşturmak için iş için yeterince güçlü bir çözüme ihtiyacınız var.

Instapage ile pazarlamacılar, tasarımcı dostu oluşturucumuz, CSS düzenleyicimiz, hizalama ve gruplama, kısayol tuşları ve daha fazlasıyla piksel mükemmelliğinde sayfalar oluşturabilir. Ardından, daha da yüksek dönüşümler için A/B testi için yerleşik ısı haritalarını kullanın ve üretiminizi Instablocks™ ile ölçeklendirin. Başka hiçbir çözüm karşılaştırılamaz. Bugün bir Instapage Enterprise demosu için kaydolun.