Bir açılış sayfasının ne olduğunu, neden iyi olduklarını ve ne olduklarını zaten tartıştık. temel prensipler yağsız - Yağsız. Ancak sitenizin başarısını sağlayacak bir takım kurallar ve teknikler olmasına rağmen, açılış sayfası geliştirmenin bir şablon işi olduğunu ve 5 dakika içinde iyi işleyen bir sayfa yapılabileceğini düşünmek yanlış, sadece bilin. resimleri kendiniz değiştirin ve metinleri değiştirin. Tabii ki, bu yaratıcı bir süreçtir ve hedef kitlenizin davranışını anlayarak desteklenen hayal gücü yalnızca teşvik edilir. Aşağıda, banal olmayan açılışların bir düzine örneğinin yanı sıra aşağıdakileri sağlayan sayfalar sunacağız: yüksek dönüşüm.
1. Yuva Termostatı
Bir oda termostatının satışına adanmış çok ilginç bir şekilde tasarlanmış iniş. Her türlü teknik verinin ve uygun işlevsellik açıklamalarının bulunmasına rağmen, açılış sayfası görsel bileşene odaklanır - iç mekanın birkaç fotoğrafı ve sayfanın ortasında bir animasyon, konsept ve uygulamada mükemmel, yapmak Bu cihazı satın aldıktan sonra evinizin internetteki resimlerden daha kötü olmayacağını hissediyorsunuz. Böylece iniş termostatı değil, müşterinin nihai ihtiyacı olan evdeki konforu satar.
2. Çocuk Utangaç
Bir tasarım stüdyosunun web sitesi, bundan sonra rakiplerden teklif aramak bile istemeyeceksiniz. Dört ekranlı bir açılış, stüdyonun işbirliği yaptığı şirketlerin herhangi bir incelemesini veya listesini okumasanız bile, sizi bu adamlara dönmeye ikna edebilir. Büyük olasılıkla, verilerinizi güzel bir geri bildirim formuna girmeye başladığınızda, paralaks etkisine hayran kalacaksınız ve kendiniz fark etmeyeceksiniz.
http://boy-coy.com
3. Votka "Valenki"
Bir örnek daha güzel iniş paralaks etkisi ile sayfa. Sizi hemen satın almaya zorlamayan, ancak hedef kitle için olumlu bir imaj yaratan tamamen görsel bir sayfa. Ürünün kalitesiyle ilgili bilgilerin yeterli hacimde sunulduğunu unutmayın, ancak buz küplerinin ne kadar güzel yüzdüğünü izleyerek gözden kaçabilir. Ancak, istenen etki zaten elde edilmiştir. Bu site kalitesiz bir şey sunmak için çok güzel - herhangi bir zevkli siteye gelen her ziyaretçide böyle bilinçaltı bir sonuç ortaya çıkacaktır.
http://www.valenkivodka.com
4. Oyuncak ayıların çevrimiçi mağazası
gerçek için ilginç inişler hedef kitleden uzaktaki insanların bile dikkatini çekebilir. Büyük oyuncak ayılar satan bir mağaza örneğine göz atın. Site kelimenin tam anlamıyla ilginç fikirlerle dolu ve ziyaretçiyle diyalog halinde görünüyor ve sonuçta yüksek olasılıkla bir satın alma anlamına geliyor.
http://medvedy.com
5. Akıllı İlerleme
Hedef belirlemek ve ulaşmak için popüler bir hizmetin güzel açılış sayfası. İlk önce gidip nasıl çalıştığını görün ve ikinci olarak hedefe yönelik hareketi somutlaştıran tasarımı değerlendirin. Çok yetkin bir blok doldurma ile birlikte, sizi gerçekten planlanmış, ancak süresiz olarak ertelenmiş her şeyi yapmaya motive eder.
https://smartprogress.do
Yüksek dönüşüm sağlayan açılış sayfaları satma örnekleri
1. Ahşap pencere üretimi ve montajı
Bildiğiniz gibi, bir açılış sayfası ziyaretçiyi aşırı yüklememeli, ona hemen bağlanıp bir başvuru doldurması için bir şeyler vermelidir. Tartışmayacağız, ancak bazı ürünler dikkatli seçim gerektirir ve bir veya iki blokla inemezsiniz. Bu pencere üreticisinin açılış sayfası, programa göre maksimuma gitti ve pencereleri seçerken aklımıza bile getirmediğimiz ayrıntılara değindi. Ve birkaç blokta, bize göründüğü gibi, aşırı bilgi yüklenmesine rağmen, bu sayfa hala iyi örnek büyük iniş.
http://goodwin-nnov.ru/
2. CASCO sigortası
Başka bir yüksek dönüşüm sağlayan açılış sayfası. Bir ziyaretçiyi potansiyel müşteriye dönüştürme ilkesi, burada önceki örneğe benzer şekilde kullanılır - bir hesap makinesi. Politika seçimi için kaç parametrenin yapılabileceğini ve bunun ne kadar zahmetsizce yapıldığını değerlendirmeyi öneriyoruz. Aynı şey, inişin geri kalanı için de söylenebilir - son derece basit ve açık, bir araba sahibinin arabasını sigortalayarak elde etmek istediği tüm avantajlar açıklanıyor.
http://prostokasko.rf
3. Otomatik eğlence akvaryumu imtiyazı
Potansiyel bir müşteriye faydalarını açıkça anlatması nedeniyle yüksek dönüşüm sağlayan, ancak aynı zamanda entrika, vaat eden bir iş planının ayrıntılarını öğrenme arzusu da bırakan, satış yapan bir açılış sayfasına güzel bir örnek. pasif gelir. Tasarımcı bizim özel övgümüzdür.
http://morewishes.ru
4. Dizüstü bilgisayar tamiri
Göreceli olarak bir açılış sayfasına iyi bir örnek çok sayıda metin (ana ekranda kapladığı alan dahil) ziyaretçi için herhangi bir zorluk yaratmaz, aksine organik görünür ve onarım organizasyonunun tüm avantajlarını başarıyla boyar. Dizüstü bilgisayar onarım hizmetleri acildir, bu yüzden yapmayın potansiyel müşterilerölçünün ötesinde bilgi verin: birkaç blok yeterlidir, ancak mümkün olduğunca güzel ve bilgilendirici bir şekilde çalıştı, bu da güven uyandırıyor.
Satış siteleri. Ne olduğunu? Her iki kişiden biri "Tabii ki bunlar açılış sayfaları!" diyecektir. Tek sayfalıktırlar, aynı zamanda açılış sayfalarıdırlar, ayrıca sayfa satarlar.
Sizi tam tersine ikna etmeyeceğim, çünkü bu sözlerde büyük bir doğruluk payı var. Bu nedenle, bu makalede hangi açılış sayfalarının en iyi olarak adlandırılabileceğini ve nedenini analiz edeceğiz.
Bu yüzden en çok satan siteleri aramaya başladım. Örneklerini, derecelendirmelerini nerede görebilir ve prensipte nasıl değerlendirebiliriz. Sonuçta, şirketin satışlarını artırmak için başlangıçta tek sayfalık bir site icat edildi.
Son zamanlarda, çok şey değişti. Daha önce alakalı olanlar gitti, siteler daha iyi, daha güzel hale getirilmeye başlandı. büyük miktar animasyonlar, resimler ve çeşitli cazip cipsler.
Değerlendirme kriterleri şüpheli
Neye dayanarak değerlendirmeli? Neyi temel almalı? TOP-10 siteleri nasıl sıralanır?
Yarışma için siteler nereye götürülür? Bütün bunlar, en iyi sitelerin gerçek ve dürüst bir sıralamasını oluşturmadaki durumu karmaşıklaştırıyor.
Ayrıca bu tür siteler üzerinden kaç satış yapan firma olduğunu da bilmiyoruz. Onları arayıp "Seninki ne?" diye soramazsın. veya “Kaç uygulamadan alıyorsunuz?”.
Eminim kimse böyle bir soruya cevap vermeyecek çünkü ya kimse düşünmüyor ya da bunun gizli bilgi olduğunu söyleyecekler.
Evet, hayal!
Bu yüzden daha kolay hale getirdim. En iyi inişlerin derecelendirmelerini ve seçimlerini aramaya ve görüntülemeye başladım. Ve biliyor musun?
Sitenin yüklenmesi uzun zaman alır ve bu, hemen çıkma oranını büyük ölçüde etkileyebilir. Yani, insanlar teklifi gördüklerinden daha hızlı terk edecekler.
2. "Dinero" Atölyesi
Bu bir web sitesi değil, bu bir "karakter" hakkında bir film - tahta bir cüzdan. 1.000-2.000 rubleye mal olsaydı, site başarısız olurdu.
6. “Büyük Kurutma” Projesi
Kadınların çoğu (kendi hedef seyirci kitlesi) Crazy Drying projesini duymuşsunuzdur. Lansman reklamları internetin her yerinde. Ve bu, trafiğe milyonlarca yatırım yapıldığında şaşırtıcı değildir.
Ancak iyi bir site olmadan on milyonlarca gelir elde edemezsiniz, bu nedenle siteleri de TOP listemize dahildir.
“Büyük Kurutma” Projesi
Yaratılışa iyice yaklaşıldığı görülmektedir ki bu sadece bazı metinler değerindedir. Ama sadece bir tane yaptılar Büyük hata- en sonunda arama butonunu yapmadı.
Ve bu, tüm hikayenin mantıksal kapanışını görmedikleri için ziyaretçilerin çıkışını etkiler.
7.
Bitrix24 müşteri ilişkileri sistemini kendimiz kullanıyoruz. Ancak konumuz “ ” olmadığı için Megaplan sistem web sitesi tüm beklentileri aştı.
Sisteminin tüm ana noktalarını bunun üzerinden aktardılar, bundan sonra bunun iş için en iyi şey olduğunu anlıyorsunuz.
CRM "Megaplan"
İyileştirme dileklerimizden - tüm doğrudan rakiplerin sahip olduğundan, sistemin bir video incelemesini eklemek için. Ayrıca daha anlaşılır aramalar yapın, yani başlıkları (düğmeler değil) “Ücretsiz başla” veya bunun gibi bir şeyle değiştirin.
Bu arada! CRM sisteminiz olarak kullanmak istiyorsanız "Megastart" promosyon kodunu unutmamanızı tavsiye ederim. Böylece ilk alışverişinizde %10 indirim ve 14 günlük ücretsiz kullanım hakkı kazanacaksınız.
8. Girişimciler Bankası “Tochka”
Bankadan bir iniş daha. Özgünlüğü için bir ödül alır. Bu sayfa arkadaşlarınıza referans linki olarak gönderilir.
Etkiyi arttırmak için, mantığa baskı yapan birkaç blok daha eklerdik. Şu andan itibaren site daha çok duygulara odaklanıyor. Bazı durumlarda bu doğru bir karar olabilir, ancak bir banka seçeneğimiz olduğu için burada duygular tek başına yapamaz.
Girişimciler Bankası "Tochka"
9. İyi Uyum Spor Salonu Ekipmanları
Sitenin mavi ile siyahtan beyaza ilginç bir geçişi. Ancak ilginç bir tasarım çözümüne ek olarak, bu iniş mükemmel bir başlık oyunu kullanıyor.
Bu versiyonda, bloğa bir bağlantı değiller, ancak bağımsız elemanlar, hangisini okuduktan sonra tam bir resim oluşturabilirsiniz.
Eksiksiz bir paket için, yüzünden yeterli video sunumu yok CEO. Mükemmel bir fiziksel formda olmalı.
Ayrıca vakalara sayılar eklemek de harika olurdu. Yani, müşterinin aldığı salon ne kadar. Ancak bu kritik değil, arzu edilir.
Teçhizat Spor salonları"iyi form"
10. Alışveriş merkezi "METROPOLIS"
Kesinlikle şimdiye kadar gördüğüm en iyi alışveriş merkezi açılış sayfası. Renkler güzel seçilmiş, ana anlamlar aktarılmış, mükemmel kullanılabilirlik. Bu açılış sayfasına gittiğinizde bunların hepsi hemen görünür. Öyleyse tıklayın ve keşfedin.
Yine de 5 sentimi koyacağım. Elbette bu merkeze aşina olan kişilerin bu siteye ulaşması gerektiğini anlıyorum. Ama aynı zamanda onu ilk kez görecek olan insanlar da üzerine düşecekler.
Bu nedenle, ziyaretçinin nereye gittiğini ve onu orada neyin beklediğini hemen bilmesi için küçük bir açıklama (şirket hakkında birkaç kelimelik bir açıklama) yapmak mantıklıydı.
Alışveriş merkezi “METROPOLİS”
Sadece Rusya!?
Evet, incelememde, dünyada pek çok iyi ve iyi seçenek olmasına rağmen, esas olarak Rus İnternet'teki en iyi tek sayfalık sitelere odaklandım.
Ve en önemlisi (ve en şaşırtıcısı), burjuvazideki açılış sayfası sadece küçük işletmeler tarafından değil, büyük işletmeler tarafından bile kullanılıyor.
Örneğin, dünyanın en ünlü taksi hizmetlerinden biri olan Uber, ana sitesi olarak aldı. sonraki seçenek- çok işlevli bir açılış sayfası veya dedikleri gibi çok sayfalı bir açılış sayfası.
Bu, birçok açılış sayfası olan bir web sitesidir. Neredeyse çok sayfalı bir site. Ama yine de bir açılış sayfası.
https://youtu.be/ClF-txTHGnc
Ancak, farklı oldukları için özellikle açılış sayfalarını burada yayınlamıyorum. Herkes Batı'dan sonra her şeyi tekrarladığımızı söylesin, ama bu durum Aksini düşünüyorum.
Biz Ruslar farklıyız. Farklı bir ülkede yaşadığımız için farklı bir düşünce tarzımız var.
Örneğin bir Amerikalının kafasında şirketin parayı alıp dağılacağından neredeyse hiç korkmaz. On satırla korunan her şeye sahip olduklarından, yalnızca bir PayPal maliyeti.
Burada, Rusya'da bu korku ön planda. Bu nedenle, web sitelerinde şirkete güvenmeleri için birkaç ikna edici blok var ve bizde birçoğu var.
Onlarla farklı en iyi açılış sayfalarına sahip olacağımıza dair onlarca argüman daha verebilirim. Bu nedenle özür dilerim ama seçenekleri burada olmayacak.
Rus çözümlerimizin keyfini çıkarın. Metinlerimizi ve bloklarımızı modelleyin. Ve yabancı sitelerde sadece al iyi fikirler tasarım için.
Kısaca ana hakkında
Artık tüm başvuranları gözden geçirdiğinize göre, körü körüne onlara odaklanmanızı önermiyorum, ama bakın en iyi inişörnek için sayfa kesinlikle buna değer.
En azından ilginç bir şekilde yapılmış bir animasyon fikrini birinden alabilirsiniz. Veya, örneğin, yaratıcılardan biri, kendisininkini mükemmel bir şekilde bilir ve tüm iniş boyunca kullanır. Genel olarak, çalışmaya, sonuç çıkarmaya ve benimsemeye değer.
Bu arada, ilk açılış sayfanız için fikir arıyorsanız, onu kendiniz yaratmayı deneyebilirsiniz. Böylece neye ihtiyacınız olduğunu ve ilk bakışta göründüğü kadar basit olmadığını anlayacaksınız.
Bunun için kullanın, örneğin Platform LP. Ve ancak o zaman ortak gelişim için bizi ziyaret etmenizi bekliyoruz.
Selamlar sevgili okurlarım. Bugün hakkında konuşacağız teknik noktalar ile artırabileceğimiz satış dönüşümü onların mal veya hizmetleri. Biri önemli noktalar iyi düşünülmüş Açılış sayfası mal ile. Oluşturulması hakkında daha fazla konuşacağımız ve alacağımız sözde açılış sayfası hazır kodlar sayfalar.
Açılış Sayfası nedir? Bu, insanların genellikle bir reklamı tıkladıktan sonra geldikleri sayfadır. Tek bir teklif için yaratılmıştır: ürün, hizmet veya abonelik. Etkili bir açılış sayfası, başarılı çevrimiçi pazarlamanın temel taşıdır. Ürün piyasadaki en iyisi olabilir, reklamlar mükemmele getirilir, ancak iyi bir açılış sayfası olmadan çabalar %100 sonuç vermez. Ziyaretçilere neyin teklif edildiğini ve neden istemeleri gerektiğini söyler. Aciliyet duygusu, hızlı karar vermeye ve kullanıcının müşteri kategorisine geçişine katkıda bulunur.
Bir İniş nasıl oluşturulur? Cevabın dizgi yeteneğinde yattığına inanmak yanlış. Sonuç, iyi bir açılış sayfasıdır iyi koordine edilmiş çalışma hedefler, metin, tasarım ve kod üzerinde. Aşağıda örnekleri olacak olan açılış sayfası, yeni başlayanların mizanpajla çalışmanın temellerini öğrenmelerine yardımcı olacak, ancak dönüşüm metinlerinin ve hedef kitlenin anlaşılmasının yerini almayacak. Bunları çeşitli şekillerde de oluşturabilirsiniz. açılış sayfası tasarımcıları.
Bu nedenle, oluşturmadan önce Açılış sayfası, kendine sor:
- Bir kişi açılış sayfasına ulaştıktan sonra ne yapacak? Bir şey alacak mı? Formu doldurun? Bültene abone misiniz? Dönüşüm oranınızı izlemeden önce net hedefler belirleyin.
- Rakiplerim kimler? Aslında bunlar üç soru: kim, ne kadar başarılılar ve başarıları nasıl uygulanabilir? Taklit, iltifatın en içten şeklidir. Rakipler işe yarayan şeyi yapıyorsa, sitenizde tekrarlayın.
- Seyircim kim? Nişinizi ve hedef kitlenizi ne kadar iyi anlarsanız, çabalarınızın karşılığını alma olasılığınız o kadar artar.
Hepsi teklif edilmelidir gerekli bilgi, ancak potansiyel bir müşteriyi bunaltmak ve uzaklaştırmak için yeterli değil.
Açılış sayfası oluşturma örnekleri + aptallar için kodlama
İşe başlamadan önce, HTML ve CSS'ye hızlıca bir göz atalım. Nasıl çalıştıklarını anlamak, bir iniş oluşturmaya yardımcı olacaktır.
HTML- sitelerin görselleştirilmesi için tarayıcı biçimlendirme dili. İçeriği tanımlayan köşeli parantez içine alınmış etiketler kullanılarak yazılır.
Etiket açılır (<>) ve doldurmanın çevresini () kapatır:
<тег>içerikтег>
Nokta özelleştirmesi için, isimden sonra nitelikler eklenir:
<тег атрибут="значение">içerikтег>
CSS - HTML öğelerinin nasıl düzenleneceğini tanımlar. Seçiciler, özellikler ve değerlerden oluşur:
#selector (özellik: değer;)
Seçici, html'deki belirli bir etiketin adıyla eşleşir. Değerleri değiştirerek ve özellikler ekleyerek düzenlenir dış görünüş. Aynı HTML'ye farklı CSS stilleri uygulayarak farklı sayfalar oluşturabilirsiniz.
5 ilk adım
Hızlı yerleşim için, önyükleme tabanlı minimal tasarıma sahip bir şablon kullanacağız. Bu, düzeni hızlandırmak için tüm dünyada kullanılan kendi seçicileri olan bir sistemdir.
Mütevazı görünüyor.
Bu balıktan birkaç aşamada her zevke uygun bir site oluşturulur.
Bir klasördeki dizin yapısı:
- index.html: Bu, düzenleyeceğimiz ana dosyadır.
- /varlıklar: işte yardımcı dosyalar:
- /css: dizin, önyükleme ve simge stillerini içerir. Düzenlenecek dosya main.css'dir.
- /img: web sitesi resimleri için klasör.
- /yazı tipleri: simge yazı tipleri.
- /js: önyükleme javascript dosyaları.
Adım 1: Başlığı Kullanma
Başlık ve alt başlıklar, teklifin değerini net bir şekilde iletmeye yardımcı olacak kilit yerlerdir.
Sitenin başlığını ve adını değiştirin. Burada dizgi yeteneği gerekli değildir - metniniz ekranda sarı ile vurgulanan yerlere yazılır.
Adım 2. Kısalık, dönüşümün kız kardeşidir. Avantajlar ve Oranlar Ekleme
4 bölüme ihtiyacınız olacak:
- Faydalar;
- tarifeler;
- incelemeler;
- eylem çağrısı.
Gerekli bölümleri ekleyeceğimiz ana içeriğin “ana” bölümünü tasarlayalım:
…..
…..
…..
…..
Noktalar yerine doldurma ile doldurun.
Faydalar bölümü bu kodu gerektirecektir:
Avantajlar
Hızlı
güvenilir
Sed diam mumyasız
karlı
Elit, sed diam nonmy
teknik olarak
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
güvenilir
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
karlı
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy
teknik olarak
Lorem ipsum dolor sit amet, conectetuer adipiscing
güvenilir
Lorem ipsum dolor sit amet, conectetuer adipiscing
karlı
Lorem ipsum dolor sit amet, conectetuer adipiscing
Görsel içerik:
Buraya kadar özensiz görünüyor ama paniğe mahal yok, devam ediyoruz.
Oranları yazın. İçerik, ilk adıma benzer şekilde değişir. Genel açıklama“tarifeler” sınıfı ve üç tarife ile.
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
tarife planları
1 numaralı tarife
$10
aylık/kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Tarife №2
$20
aylık/kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
3 numaralı tarife
$30
aylık/kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Öyle görünüyor.
Gelecekteki açılış sayfasının görünümüyle ilgilenmiyor olsak da, aşağıda değişen stil örneklerini ele alacağız.
3. Adım: Sinyallere ve harekete geçirici mesaja güvenin
Hedef sinyallerin kullanılması, ziyaretçilere markanın güvenilir olduğunu gösterir. Sinyaller alınabilir Farklı çeşit, ancak klasikler müşteri yorumlarıdır.
Lorem ipsum dolor sit amet, consectetur adipisicing seçkin, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo:
Musteri degerlendirmeleri
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo."
“Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut emek ve dolore magna aliqua. Ut enim ad minim veniam, quis nostrud egzersiz ullamco Laboris nisi ut aliquip ex ea commodo."
Bir harekete geçirici mesaj ayarlayın.
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat:
Bugün sipariş verirken yararlanın
İncelemeler, potansiyel müşterilerin bir ürünü satın almaya karar vermelerine yardımcı olur. Anlaşılır olması için avatarlara ihtiyacımız var, bu yüzden onları hemen her alıntının altına yazacağız.
Müşteri Adı.
Adım 4: Şebeke Entegrasyonu ve Mobil Dostu
Izgarayı uygulamak için Bootstrap kapsayıcılarına ihtiyacımız var. Toplam izin verilen sütun segmenti sayısının 12 olduğunu hatırlamak önemlidir. Sınıf, içerik görüntüleme genişliğini tanımlar. Bu hazır ızgaranın avantajı, konteynerlerin uyarlanabilirlik göz önünde bulundurularak tasarlanması ve hemen uygulanabilir olmasıdır. mobil cihazlar. Resmi web sitesinde ayrıntılı açıklama. Ağ böyle görünüyor.
“Main” içeriği bir kap içine sarılacaktır. Bunu yapmak için üst kısmında şöyle yazılmıştır:
Bloğun ekranın tüm genişliğine sığmasını istiyorsanız, içine kap yerleştirilir. Burada bir jumbotron ve bir eylem çağrısı olacak.
Üst üste istiflenmesi gereken tüm elemanlar çizgi ayırıcılarla sarılacaktır.
Artık sütunların genişliğini, önyükleme ızgarasına odaklanarak ayarlayabiliriz. Sardıktan sonra, dolgu ekranın kenarlarına yapışmayı bıraktı, düzgün girintiler belirdi.
col-lg-4 sütun sınıfını kullanarak fiyatları arka arkaya ayarlayın. Satırların içinde artık sarmak için ayrı div'ler yazmanıza gerek yok, bunları bir boşlukla ayrılmış mevcut div'lerle birleştirebilirsiniz.
Benzetme yoluyla, incelemeler ve faydalar bölümü için sütunlar belirledik. Elemanı yana taşımak istiyorsanız, col-lg-offset-2 ofset sütun sınıfını kullanın. Sondaki sayı, kaç tane taban sütununun kaydırılacağını belirler.
Adım 5. Yazı Tipleri ve Simgeler
Google Font başlıkları için fontlar uyguluyoruz. Seçildiğinde, içe aktarma sekmesini açın ve buradaki verileri main.css dosyasına kopyalayın. Ayrıca yeni yazı tipinin uygulandığı dosyaya başlık seçicileri de ekleriz.
@import "https://fonts.googleapis.com/css?family=Roboto+Condensed" /* başlıklar için yazı tipini içe aktar */
.navbar-marka,
h1,
h2,
h3,
h4,
h5,
h6(
font ailesi: "Roboto Condensed", sans-serif; /* Googlefont çıktısı */
}
Anlaşılır olması açısından avantajlar, açıklayıcı adı metin merkezi ve önyükleme kümesinden FontAwesome simgelerine sahip bir sınıftır.
Bu, hazırlığı tamamlar.
Açılış sayfası: teklif, paralaks ve sayaç içeren kod örnekleri
En popüler üç türü kullanıyoruz: teklifle, formla ve geri sayım sayacıyla. Düzen tamamlandığında, şablon efektlerle desteklenecektir.
Örnek 1: bir teklifle
Ana gövde arka planını ve dolguyu, ilk ekran kaplanacak şekilde ayarlayın.
Jumbotron (
arka plan: #f5f5f5 url(../img/fon.jpg) üst merkez tekrarsız;
maksimum genişlik: %100
üst dolgu: 250 piksel;
alt dolgu: 200px
metin hizalama: merkez;
}
Jumbotron başlığının boyutunu h2'den h1'e değiştirin. Ardından, değiştirilmesi gereken öğeler için stilleri belirleriz.
Simgelerle başlayalım.
Faydaları ben(
renk: #cac4c4;
}
Pound işaretinden sonra bir renk belirtilir. Html renk tablolarını veya bir resim düzenleyiciyi kullanarak kendi seçeneğinizi belirleyebilirsiniz.
Bölüm başlıkları için girinti
bölüm h2 (
üst dolgu: 30 piksel;
kenar boşluğu-alt: 25 piksel;
}
Tarifelerin görünümünü sıraya koyduk. Kolaylık olması açısından, noktasal olarak seçmek istediğimiz elemanlar için kendi sınıflarımızı oluşturuyoruz.
1 numaralı tarife
$ 10
aylık/kişi başı
- Lorem ipsum dolor sit amet, conectetuer adipiscing elit
- lorem ipsum dolor
- 10 Bilgi ipsum
Ve bir sürü CSS. Bölümlerin hangi yerlerden sorumlu olduğu yorumlarda - /* eğik çizgiler arasında yıldızla */ yazılır.
/* =========Tarife stilleri======== */
/* Genel form tarife */
.pricing_item(
arka plan: #f2f2f2;
pozisyon: göreceli;
ekran: -webkit-flex;
ekran:esnek;
esnek yön: sütun;
hizalama öğeleri: streç;
metin hizalama: merkez;
-webkit-flex: 0 1 330 piksel;
esnek: 0 1 330 piksel;
dolgu: 2em 3em;
kenar boşluğu: 1em
renk: #262b38;
imleç: varsayılan;
taşma: gizli;
}
/* tıklandığında arka planı değiştir */
.pricing_item:hover (
renk: #444;
arka plan: #daebef;
}
/* her tarifede ayrı fiyat etiketi */
.pricing_item:birinci çocuk .price (
arka plan: #9ba9b5;
}
.pricing_item:nth-child(2) .price (
arka plan: #1f6098;
}
/* üzerinde geniş ekranlar dolgu ve vurgulama orta sütun tarife */
@medya ekranı ve (min-genişlik: 66.250em) (
.pricing_item(
kenar boşluğu: 1.5em0;
}
.özellikli(
z-endeksi: 10;
kenar boşluğu: 0;
yazı tipi boyutu: 1.15em
}
}
/* Başlık */
.pricing_item h3(
yazı tipi boyutu: 2em
kenar boşluğu: 0,5em 0 0;
renk: #1d211f;
}
/* fiyat etiketi desteği */
.fiyat(
yazı tipi boyutu: 2em
yazı tipi ağırlığı: kalın;
renk: #fff;
pozisyon: göreceli;
z-endeksi: 100;
satır yüksekliği: 95 piksel;
genişlik: 100 piksel
yükseklik: 100 piksel;
marj: 1.15em otomatik 1em;
sınır yarıçapı: %50
arka plan: #77a5cc;
-webkit-geçiş: renk 0.3s, arka plan 0.3s;
geçiş: renk 0,3 sn, arka plan 0,3 sn;
}
/* para birimi */
.para birimi(
yazı tipi boyutu: 0,5em
dikey hizalama: süper;
}
/* cümlenin düzeltilmesi */
.cümle(
yazı tipi ağırlığı: kalın;
marj: 0 0 1em 0;
dolgu: 0 0 0.5em;
renk: #2a6496;
}
/* liste */
.pricing_item ul (
yazı tipi boyutu: 0.95em
kenar boşluğu: 0;
dolgu: 1.5em 0.5em 2.5em
metin hizalama: sola;
}
/* liste öğeleri */
.pricing_item li(
dolgu: 0.15em0;
}
/* tarife sipariş düğmesi */
.pricing_item düğmesi(
yazı tipi ağırlığı: kalın;
üst kenar boşluğu: otomatik;
dolgu: 1em 2em;
renk: #fff;
sınır yarıçapı: 5px
arka plan: #428bca;
-webkit-geçiş: arka plan rengi 0.3s;
geçiş: arka plan rengi 0,3 sn;
}
/* butona tıklandığında rengi değiştir */
.pricing_item düğmesi: fareyle üzerine gelin,
.pricing_item düğmesi:odak(
arka plan rengi: #285e8e;
}
/* tarife arka planı*/
.bg-2 (
arka plan: #dddddd;
}
Sonuç
Musteri degerlendirmeleri. Onlara düzgün bir görünüm verelim, yerini belirleyelim.
/* =========Görüş stilleri======== */
referanslar (
dolgu: 4em0;
metin hizalama: merkez;
}
.testimonials .avatar resmi (
sınır yarıçapı: %50
yüzer: sol;
ekran: satır içi;
kenar-sağ: 1em;
genişlik: 65 piksel
yükseklik: 65 piksel;
kenar boşluğu-alt: 30 piksel;
}
.testimonials .avatar p(
metin hizalama: sola;
üst dolgu: 1em;
renk: #5d5d5d;
yazı tipi ağırlığı: 900
}
Son harekete geçirici mesajı ve altbilgiyi süslemek için kalır.
/* Eylem */
.eylem(
arka plan: #476177;
minimum yükseklik: 180 piksel;
genişlik: %100
dolgu: 4em0;
metin hizalama: merkez;
}
.eylem h2(
renk: #fff;
yazı tipi ağırlığı: 300
}
.actionp(
renk: #fff;
metin gölgesi: 0 1px 2px rgba(0, 0, 0, .2);
yazı tipi boyutu: 1.2em
}
.action .container(
kenar boşluğu: 3em;
}
/* Altbilgi */
altbilgi(
arka plan: #333333;
dolgu: 1em0;
metin hizalama: sağa;
}
altbilgi p(
renk: #fff;
satır yüksekliği: 1;
metin dönüştürme: büyük harf;
yazı tipi boyutu: 0.7em
üst kenar boşluğu: 0,5em;
}
Altbilgi düğmesine yerleşik önyükleme sınıfı btn-default atanır.
Şablonu canlandırıyoruz. uygulayalım pürüzsüz kaydırma ve bölümler için düğmeler ve ilk ekranda metin animasyonu.
Geçişlerin işe yaraması için, faydalar ve tarifeler için bölüm sınıflarının bir kısmını id - ile değiştireceğiz. Ve butonlara id linklerini yazacağız. Ekran - sarı bir işaretleyici ile vurgulanana ne eklenir.
Düğmeler için girintileri ayarlayın - jbutton. Tıklamada kaydırma işe yarıyor, ancak çok aniden.
Pürüzsüz geçişler ile oluşturulur javascript yardımı veya jQuery. İkincisi, varsayılan olarak Bootstrap şablonlarına bağlıdır.
Kaydırma artık pürüzsüz.
Animate.css ile metne animasyon ekleme ( https://raw.githubusercontent.com/daneden/animate.css/master/animate.css). Hazır açık kaynak, herhangi bir web sitesinde kullanılabilir. Github'dan gelen dosyayı css klasörüne atıyoruz ve yolu yazıyoruz.
Efektleri buradan seçin: https://daneden.github.io/animate.css/. fadeInDown'ı seçtik. Kodda şöyle yazılmıştır:
Artık sayfa yüklendiğinde veya yenilendiğinde metin canlandırılacaktır. Hazır.
Örnek 2: şekil ve paralaks etkisi ile
Bir ziyaretçiye ne kadar çok form alanı sunulursa, onları doldurma olasılıkları o kadar az olur. Yalnızca minimum düzeyde gerekli bilgileri isteyin.
benzetme yoluyla toplanmıştır. Arka planları ve renkleri değiştireceğiz. Ve elbette bir form ekleyeceğiz.
İle başlayalım paralaks .
Jumbotron arka planını şeffaf olarak değiştirin:
arka plan: şeffaf;
Komut dosyasını kafanın içine yerleştirin:
Gövdedeki ilk satır paralaks kabıdır:
Ve CSS'de davranışı:
bgparalaks(
arka plan: url(/../img/fon.jpg) tekrar;
pozisyon: sabit;
genişlik: %100
yükseklik: %300;
üst:0;
sol:0;
z-endeksi: -1;
}
Paralaks hazır. Ancak kodda ve yeni bir arka planda değişiklik yapmak, renk şemasının yeniden atanmasını gerektirir.
Menüyü karanlık yapmak:
navbar-varsayılan(
arka plan rengi: #333;
kenarlık rengi: #444;
renk: koyu gri;
sınır yarıçapı: 0
}
Navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus (
renk: koyu gri;
arka plan rengi: rgba(0, 0, 0, 0.5);
}
Jumbotron'daki cümleyi yenisiyle değiştiriyoruz - form koduyla:
Açılış sayfası ziyaretçileri müşteriye dönüştürür
Merak uyandıran her şey, şüphe uyandıran bir şekilde askıya alındı.
-
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
Ve görünüşü yaz
/* biçim */
.headform listesi(
liste stili türü: yok;
satır yüksekliği: 26 piksel;
yazı tipi ağırlığı: 400
dolgu: 0px
kenar boşluğu-alt: 40px
}
.kafa formu(
taşma: gizli;
pozisyon: göreceli;
arka plan rengi: rgba(0,0,0,.4);
dolgu: 35px 40px;
sınır yarıçapı: 8px
}
giriş, düğme, seç, metin alanı (
genişlik: %100
kenar boşluğu-alt: 10 piksel;
}
.headform-list li .fa (
pozisyon: mutlak;
üst: 0 piksel;
sol: 0 piksel;
genişlik: 42 piksel
yazı tipi boyutu: 24 piksel;
metin hizalama: merkez;
}
.headform listesi li (
pozisyon: göreceli;
minimum yükseklik: 38 piksel;
sol dolgu: 62 piksel;
kenar boşluğu-alt: 20px
}
.jumbotronp(
renk: #fff;
yazı tipi boyutu: 16 piksel;
yazı tipi stili: italik;
}
Değişiklik gerektirdiği için jumbotronun metni de buraya geldi.
Oranları değiştiriyoruz.
/* tarifenin genel görünümü */
.pricing_item(
arka plan rengi: rgba(0,0,0,.4); /* satır değişti */
sınır yarıçapı: 4px /* satır değişti */
pozisyon: göreceli;
ekran: -webkit-flex;
ekran:esnek;
-webkit-flex-yön: sütun;
esnek yön: sütun;
-webkit-align-items: streç;
hizalama öğeleri: streç;
metin hizalama: merkez;
-webkit-flex: 0 1 330 piksel;
esnek: 0 1 330 piksel;
dolgu: 2em 3em;
kenar boşluğu: 1em
renk: #f2f2f2; /* satır değişti */
imleç: varsayılan;
taşma: gizli;
kutu gölgesi: 0 0 15px rgba(0, 0, 0, 0.05);
}
/* tıklandığında arka planı değiştir */
.pricing_item:hover (
renk: #444;
arka plan: #ddd; /* satır değişti */
}
Şimdi böyle görünüyorlar - şeffaf arka plan ve yuvarlatılmış köşeler.
Şablon hazır.
Örnek 3: bir geri sayım sayacıyla
Yine jumbotronun dolgusunu değiştiriyoruz ve şablonu önceki şablona benzeterek yeni bir arka plan için yeniden boyadık. Sayaç betiğini bağlarız:
HTML
Zaman beklemez
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat. Ut wisi enim ad minim veniam, quis nostrud egzersiz ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat. vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis vero eros ve accumsan ve iusto odio dignissim qui blandit praesent in vulputate esse molestie içinde dolor.
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
-
Lorem ipsum dolor sit amet, conectetuer adipiscing elit, sed diam nonummy.
Stil dosyasında, formun alt yarıçapını kaldırın, düğmeyi akla getirin.
Ek olarak, menü yeni bir arka plan altında yeniden renklendirildi ve jumbotron'daki metinlerin stili önceki örneğe benzer şekilde değiştirildi. Sonuç.
Alt kısım
Bu, Açılış Sayfası örneklerini tamamlar, ancak kodun daha fazla çalışması gerekir.
Bir açılış sayfası, bir Ferrari gibi hızlı ve iyi olmalıdır - sayfa yükleme süresinin hemen çıkma oranları üzerinde büyük etkisi vardır. Maksimum verimlilik için görüntüleri optimize edin, hazır komut dosyalarının ve stillerin boyutunu en aza indirin.
Ders, size gerçek müşteriler kazandırmaya yardımcı olacak iyi açılış sayfaları oluşturmaya ilişkin örnekler sunar ve yeni bir şey öğreneceksiniz. Beğenip tekrar paylaşalım. Yakında görüşürüz.
Derste sunulan tüm kaynakları hazır sayfalar olarak indirmek için butonlardan birine tıklayınız. sosyal kale açmak ve bağlantıyı almak için.
Saygılarımla, Galiulin Ruslan.
Selamlar. Bugün bir Açılış Sayfasının ne olduğu ve ne için olduğu hakkında konuşacağız. Bir bilgi iş adamıysanız, büyük olasılıkla böyle bir yakalama sayfasıyla bir kereden fazla karşılaşmışsınızdır. Ve düzenli okuyucum Denis Tumilovich şimdi size bu sayfa hakkında daha fazla bilgi verecek. Tanışmak!
Merhaba harika bir blog sitesinin sevgili ziyaretçisi. Benim adım Denis Tumilovich ve çoğunlukla sıfırdan yazıyorum ve ondan sonra da para kazanıyorum.
Bugün açılış sayfaları konusunu gündeme getirmekten mutluluk duyuyorum - yakalama sayfaları (açılış sayfaları) nedir, bu açılış sayfalarına neden ihtiyaç duyuluyor, kimi nereye koyuyorlar? Onlar kimin için? Takipçi toplamak mı yoksa ürün satmak mı? Hanginiz bu konuyu zaten düşündü - ellerini kaldır!
Bu soru bana, metinlerden para kazanmayla ilgili kitabım için tam da bu açılış sayfasını yaparken okuyuculardan biri tarafından soruldu.
Yani bu soruyu çok beğendim, hemen bir makale yazmak istedim ama nedense her zaman zamanım olmadı. Konu ilginç olsa da, kabul etmelisiniz ...
Peki, ne düşünüyorsunuz, Açılış Sayfası nedir?
Wikipedia'nın ana tanımına göre, bu bir “açılış sayfası” veya başka bir şekilde bu tür sayfalara “açılış sayfaları” denir, bu bir kişinin bazı kaynaklardan aldığı bir sayfadır. Ve bu sayfada kullanıcı ile etkileşim gerçekleşir. Kullanıcının karar vermesi bu sayfadadır.
Blogger abonesi olacak mı, olmayacak mı, alıcı mı olacak? şunlar. Şimdi anlamanız gereken en önemli şey ayrı bir sayfa, ayrı bir belge.
Bu sayfa, HTML + CSS kullanılarak veya WordPress için özel eklentiler kullanılarak ayrı ayrı oluşturulabilir.
Dikkat çekici olan, bu tür açılış sayfaları için yalnızca bir blogdaki bir sayfanın değil, tüm alan adlarının bile kayıtlı olmasıdır!
İnişlerin ana görevi.
Açılış sayfalarının amacı nedir? Ana nokta, müşteri çekmek için onlara ihtiyaç duyulmasıdır. Başka bir deyişle, bu bilgi ürününüz için gerçek bir reklamdır ve bu ürün reklamının görevi birdir - potansiyel bir müşteri olan ziyaretçiyi İLGİLENDİRMEK!
Herhangi bir açılış sayfasının nihai amacı, kullanıcıyı bir müşteriye dönüştürmek veya blog yazarları söz konusu olduğunda kullanıcıyı bir aboneye dönüştürmektir.
İlk sayfamı HTML+CSS kullanarak elle yaptım. Dürüst olmak gerekirse pek iyi sonuçlanmadı ama gerçekten işe yarayan bir inişti.
Bu arada, arama sonuçlarında gördüğünüz sayfalar da hedeflenmiştir. Biliyorum? Gerçek şu ki, örneğin "İnternette nasıl para kazanılır" girdiğinizde - bu özel sorunun cevabını arıyorsunuz, ancak hiçbir durumda Napolyon pastasının tarifi yok.
Bu nedenle Yandex size yalnızca sizin için en yararlı olacak, sorunuzla ilgili sayfaları gösterir; bu, bu sayfaların sizin için en çok hedeflenen (açılış, açılış) olacağı anlamına gelir, arama motorunun düşündüğü budur.
Ve arama sonuçlarından aldığımız bu sayfalar, gerçek bir açılış sayfası ile tamamen aynı amaca sahiptir. Bize gelen bir kişiyi alıcı veya en azından abone yapın.
Bu nedenle, alaka düzeyini artırmak için, makalelerimizin her birini belirli sorgular için optimize edeceğiz, gerekli meta etiketleri ve her şeyi belirteceğiz, böylece makalemiz diğerlerinden daha alakalı hale gelecek, maksimum sayıda insan için en değerli ve yararlı hale gelecek , Ziyaretçi.
Yani. Açılış sayfalarının (açılış sayfalarının) ana amacı, dönüşümleridir (ziyaretçiyi alıcıya veya aboneye dönüştürmek)!
Artık bu gerçek herkes için açıktır. Umarım.
Açılış Sayfası Özellikleri.
1. En önemli - açılış sayfaları grafik öğelerle, çizimlerle aşırı yüklenmez, çünkü birçok grafik dikkat dağıtıcıdır. Ve ziyaretçinin teklifimize mümkün olduğunca odaklanmasına ihtiyacımız var. Başlıkta!
2. İkinci özellik reklam eksikliğidir. Yorum yapmaya bile değmez. Reklam zaten herkesten bıktı. Ürün veya hizmetinizin reklamını yapmak için tasarlanmış bir sayfada birinin reklamını yapmak mantıklı olmaz! Kim benimle aynı fikirde - lütfen yorumlarda aboneliğinizi iptal edin.
3.Üçüncü özellik – Açılış sayfaları gereksiz hiçbir şey içermemelidir, yanlış bilgilere gerek yoktur. Birçok blogcu, dahil. ve ben, hayattan haberler hakkında yazıyorum, konuyu dağıtmanıza izin verin, hava durumunu, cumhurbaşkanını falan tartışın. Açılış sayfalarında bu affedilemez. Açılış sayfalarında her şey açık ve net olmalıdır. Ne tür bir ürün, ne tür bir hizmet, kimin buna ihtiyacı var, maliyeti ne kadar ve “sipariş” düğmesi. Açılış sayfalarınızın amacının birine bir şey öğretmek değil, müşteri kazanmak olduğunu unutmayın!!!
Dönüşüm ne olmalı?
Bu sorunun tek bir cevabı yok. Gerçek şu ki, her niş, dönüşümün normalliğine ilişkin kendi göstergelerine sahiptir. Ancak hepsi bu kadar değil, yalnızca niş dönüşümü değil, aynı zamanda trafik alma yöntemini de etkiler. Örneğin, içeriğe dayalı reklamcılıktan - bir değer, teaser ağlarından - diğeri, spam yöntemlerinden - üçüncüsü.
Tabii ki, spam'inizin %1'den fazla bir dönüşüme sahip olacağını ummamalısınız, bence bu bir efsane.
Yararlı bulabileceğiniz bazı istatistikler.
Neyin iyi neyin kötü olduğunu anlayabilmeniz için birkaç numara almaya karar verdim. Bugün VK grubuna bir web stüdyosundan inişlere baktım ve bazı ilginç rakamlar buldum. Doğrudan konuya lirik bir giriş bile olmayacak:
Kırmızı düğme %5,6 dönüşüm
Yeşil düğme %3,2 dönüşüm
Bu nedenle - ana işlem için kırmızı düğmeyi kullanın!
Fiyat Al Düğmesi %5,6 Dönüşüm
“Sipariş” düğmesi %0,8 dönüşüm (ŞOK!)
Evet, bu gerçekten şok edici bir bilgi! Hala etkilendim! Kelimelerinizi dikkatli seçin!
“Ad, Telefon” formu “Ad, telefon, e-posta”dan daha iyidir ve “Telefon”dan daha kötüdür.
İnsanlar onları aradığınızda ve bir kişiye ismiyle hitap ettiğinizde hala memnun oluyorlar!
Açık bir form, kapalı bir formdan daha iyidir.
Burada her şey açık. Bir kişinin formu doldurmak için bir yere tıklaması gerektiğini tahmin etmesine gerek yoktur. Tüm formlar görünür olmalıdır.
“BU kursu sipariş edin ve BUNU hediye olarak alın…” başlığı iyi bir dönüşüm.
“BU kursu sipariş ederken BU hediyeyi alın…” gibi bir başlık kötü bir dönüşümdür.
İlk etapta ana eylem “bir kurs sipariş et” olmalı ve “hediye al” değil. Ve zaten ana siparişle birlikte birçok güzellik elde edersiniz. Çörekler bir açılış sayfasının hedefi olamaz.
Bu, açılış sayfalarında uzmanlaşmış web stüdyolarından birinin gerçek deneyimidir. İster inanın ister inanmayın ... Garip bir soru 🙂
Ve bir şeyi daha unutmayın: Açılış sayfanızın uyarlanabilirliği, dönüşüme +%5'tir! Artık oldukça fazla sayıda insan İnternet üzerinden sipariş vermek için tablet ve akıllı telefon kullanıyor - bunu unutmayın. Uyarlanabilirliği görmezden gelmek artık imkansız!
Çözüm.
Aslında açılış sayfaları ve yakalama sayfaları hakkında size söylemek istediğim hemen hemen her şey bu. Tabii ki bunlar bu konunun en önemli noktaları. Hemen hemen her blogcu (daha doğrusu herkes) bu açılış sayfalarını kullanır, çünkü abone tabanının artırılması gerekir. Ve bu tabanı artırma hızı, açılış sayfalarının kalitesine bağlıdır. Abone sayısını artırmak için bu açılış sayfalarına ihtiyaç vardır.
Peki ya bir açılış sayfasının ne olduğunu ve nasıl oluşturulacağını bilmeyen yeni başlayan biri ne olacak? wp-page gibi yapıcıları veya ücretsiz muadillerini nasıl kullanacağınızı öğrenmenizi tavsiye edebilirim. Ya da - benimle iletişime geçin - yardım edeceğim.
İşte bazı Açılışlara iyi bir örnek (tıklanabilir):
Açılış sayfası nedir ve özellikleri nelerdir? Yüksek dönüşümle hızlı bir şekilde harika bir açılış sayfası nasıl yapılır? Şu anda hangi açılış sayfası oluşturucular popüler?
Merhaba sevgili okuyucular! HiterBober.ru iş dergisinin yazarlarından Alexander Berezhnov sizlerle.
Ve bu şekilde karar verdim - size açılış sayfalarından, onları oluşturmak için kullandığım ana tekniklerden bahsedeceğim. Tek sayfalık iyi sitelerden örnekler vereceğim. Ve her biriniz kendiniz için sonuçlar çıkaracaksınız. Anlaşmak? O zaman başlayalım.
Bir açılış sayfası oluşturma teması kolay değil, çok alakalı ve ilginç. Bunu nasıl yapacağınızı bilerek, örneğin nasıl, birçok şekilde para kazanabilirsiniz. Bu yönü anlayarak, küçük işletmenizi yalnızca açılış sayfası üzerinden mal veya hizmet satarak başlatabilirsiniz.
1. Açılış sayfası nedir - yeni başlayanlar için genel bakış
Açılış sayfaları oluşturma konusunda yüzlerce makale yazılmıştır. Tüm tavsiyeleri, tüm deneyimleri tek bir malzemeye “itmek” zordur. Ama yine de açılış sayfasıyla ilgili en önemli şeyi size anlatmaya çalışacağım.
İniş tek sayfalık bir site veya sadece bir sayfadır, amacı kullanıcıları bir şeyler yapmaya teşvik etmektir: satın alın, abone olun, arayın, bir istek bırakın.
Açılış sayfası kelimenin tam anlamıyla İngilizce'den çevrilmiştir: "hedef" veya "açılış sayfası".
Muhtemelen internette böyle tek sayfalık cihazlar görmüşsünüzdür.
Neden inişler:
- çok motive ediyorlar ziyaretçinin istenen eylemi yapması.
- Hızlı bir şekilde inşa edilirler. Ve genellikle normal bir siteden daha ucuza mal olurlar. Başka bir artı: Kendiniz bir açılış sayfası yapabilirsiniz.
- Açılış sayfasının yeniden tasarımı kolaydır- geliştirin, değiştirin, eksik bilgileri ekleyin.
Açılış sayfaları şunlar için oluşturulur:
- Ürün satışı. Bunun için aramalar kullanılır: “satın al”, “istek bırak”, “ara”.
- Bilgi toplama. Burada ziyaretçilere sunulmaktadır: "abone ol", "daha fazla bilgi".
- Yazılım Dağıtımı- yazılım satışı.
İniş ve satış hunisi
Hunisatışürün/hizmet satma sürecidir. Bu sürecin her aşamasında, insanların bir kısmı - ticari bir şirketin potansiyel müşterileri - ortadan kaldırılır. Sitede hakkında ayrı bir makalemiz var.
Açılış sayfası satış süreci şuna benzer:
- 100 kişi açılış sayfasına bir bağlantı gördü;
- 40 kullanıcı bağlantıyı takip etti;
- 10 kişi uygulamadan ayrıldı;
- Ürünü 2 kişi aldı.
Yüz satıştan iki satış. Dönüş - %2. Bu iyi bir seçenek. Mükemmel değil ama başarısız da değil.
Satış hunisi, ters çevrilmiş bir mutfak hunisi gibi görünür: geniş bir taban ve dar bir boyun.
En geniş kısım sayfaya geçiştir. Bu aşamada, içeriğe dayalı reklamcılığın, sosyal ağlardaki mesajların, diğer sitelerdeki yayınların çalışmalarını test ediyoruz. TO'yu belirleyin.
TO- tıklama sayısının gösterim sayısına oranı. Yüzde olarak ölçülür.
Orta kısım uygulamadır. Açılış sayfasının etkinliğini analiz ediyoruz - tasarımı, metin kısmı.
Dar kısım, uygulamaları işlemek ve satmaktır. Burada yaşayan insanların çalışmalarını değerlendiriyoruz - operatörler, yöneticiler.
Bir açılış sayfasını analiz ederken, başka bir gösterge hesaplanır - EPC.
EPC- bu, açılış sayfasına yapılan bin ziyaretten elde edilen kazancın ortalama göstergesidir.
Geri dönüş oranı ne kadar yüksek olursa, reklam kampanyanızın etkinliği o kadar yüksek olur.
Hangi durumlarda bir iniş oluşturmak gerekir?
Aşağıda, kendi tek çağrı cihazınızı oluşturma ihtiyacıyla karşı karşıya kalabileceğiniz birkaç durumu ele alacağız.
Durum 1. Şirketin ana web sitesinin düşük dönüşümü (satışları)
Site düşük bir dönüşüm oranı gösterdiğinde - yani, alıcılar hiçbir şey satın almadan ayrılırlar. Ve yeni, çalışan büyük bir site oluşturmak için para yok.
Hesaplama örneği: Siteyi 24 saatte 300 kişi ziyaret etti. Bültene abone olun - 12 kullanıcı. Dönüşüm şöyle olacaktır: 12 / 300 * %100 = %4.
zone.RU'daki sitelerin ortalama dönüşümü %0,5'tir. Açılış sayfası dönüşümü %5–10. Bu rakamlar, girişimcilerin ürünlerini ve hizmetlerini tek sayfa üzerinden satmayı neden bu kadar çok sevdikleriyle ilgili tüm gerçeği gizliyor.
Durum 2: Yeni ürün lansmanı
Yeni bir ürün piyasaya sürdüğünüzde ve onu mümkün olan en iyi şekilde sergilemek istediğinizde. İçeriğe dayalı reklamcılığa yeni bir ürüne odaklanmanız gerektiğinde.
Durum 3. Belirli bir sorunun çözümü
Belirli bir pazarlama sorununu çözmeniz gerektiğinde. Ve şirketin ana sitesi buna uygun değil.
Çoğu durumda bunlar olmadan bir açılış sayfası oluşturmak satışları artırmaya yardımcı olur.
Kendi başına bir açılış sayfasına sahip olmak, hemen bir sürü müşteri çekmeyecektir. Aslında, bir açılış sayfası sadece bir araçtır. En gelişmiş matkap bile, siz onu alana kadar duvara delik açmaz. Yani burada.
Sayfanın çalışması için "etkinleştirmeniz" gerekir.
Bunu yapmak için aşağıdaki adımları uygulayabilirsiniz:
- İçeriğe dayalı reklamcılığı başlatın tek sayfalık web sitenize.
- Bir e-posta bülteni başlatınönceden birleştirilmiş bir abone tabanına göre. Ürün özelliklerini mektupta kısaca açıklayın ve açılış sayfasına bir bağlantı ekleyin.
- Bir ürünün reklamını yapın forumlarda, ortak sitelerde, ilan panolarında. Her yerde sayfaya bir bağlantı ekleyin.
Bir açılış sayfasının iş dünyası ve izleyicilerin iletişim kurabileceği tek yer olabileceğini düşünmek bir hatadır. Şirket blog yazmazsa, sosyal ağlarda varlığını geliştirmezse, e-posta pazarlamasını kullanmazsa, açılış sayfası etkisiz olacaktır.
Vaka Analizi
Genç adam, Kverti şirketinin teklifiyle ilgilenmeye başladı. Adam bu firmayı daha önce hiç duymadı ve bu nedenle varlığına dair kanıt arıyor. Şirketin web sitesini ve blogunu ziyaret eder, sosyal ağlarda bir gruba katılır.
Şirketin çalıştığından emin oldu. Blog, içerikle sürekli güncellenmektedir. Sosyal ağlarda yöneticiler, kullanıcı sorularına hızla yanıt verir. Müşteri tek çağrı cihazına döner, rezervasyon yapar.
Şimdi kendinize bir soru sorun: İnternette Qverti'nin izlerini bulamayan bir adam ne yapardı? Keşke bir şirketin tüm varlığı tek bir açılış sayfasında başlayıp bitseydi. Ürünlerini sipariş eder miydi?
Bu örnekten çıkarılacak sonuç, tek sayfalık cihazınız aracılığıyla satışların etkisini artırmak için destek araçlarını kullanmaktır.
2. Bir açılış sayfası oluşturmanın maliyeti nedir ve tek sayfalık bir sitenin fiyatını ne belirler?
Bir açılış sayfası oluşturmanın fiyatı, bunu isteyip istemediğinize bağlıdır. emir bir sayfa veya kendin Yap.
- İlk seçenek pahalıdır. Serbest çalışanlar 100-200 USD'den alır. iş için, tasarım stüdyoları - 1.000 c.u.'den. Harika ajanslar - 5.000 c.u.
- İkinci seçenek “neredeyse” ücretsizdir. Geliştirmeye bir programcı veya metin yazarı bağlarsanız, ücretli bir şablonu temel alırsanız, bu yöntemin fiyatı 20 ila 1.000 USD arasında olacaktır. ve daha da yüksek. Farklı türdeki web siteleri ve açılış sayfaları için fiyatları daha iyi anlamak için makalemizi okuyun.
Bir açılış sayfası sipariş etmeye karar verirseniz, doldurmanız istenecektir. kısa bilgi– özel bir anket: sitede görmek istediklerinizle ilgili soruları yanıtlayın.
Cevaplarınızdan, sanatçı, işin fiyatını belirlerken reddedilecektir.
Tek sayfalık web sitenizde ne kadar çok "cips" ve "çan ve ıslık" görmek isterseniz, açılış sayfasının maliyeti o kadar yüksek olur.
Fiyat şunlara bağlı olacaktır:
- sıra dışı yapı ve benzersiz tasarım 700 dolara mal olacak;
- içeriğe dayalı reklamcılık ve ayarları - 100 c.u. her ay;
- iyi bir metin yazarından gelen metin - 50-100 USD, mükemmel bir ticari yazardan - 1.000 USD'den;
- benzersiz resimler ve simgeler (stoklardan indirilmez) - bu en az 100-200 USD daha.
Ayrıca, bir açılış sayfasının fiyatı, hedef kitlenin analizinden, anahtar kelime öbeklerinin seçiminden, sayfa yapısının test edilmesinden, sürekli izlemeden vb. etkilenir.
Dönüşüm oranı şu kadar olan açılış sayfaları gördüm: 50–60% . Yani, her ikinci ziyaretçi verilerini bıraktı veya bir ürün satın almak için istek gönderdi. Böyle büyük bir geri dönüşün sırrı iki faktörde yatıyordu:
- Sayfayı esas olarak hedef kitle - yani bu ürünle ilgilenen kişiler ziyaret etti.
- Geliştiriciler, etkili bir açılış sayfası oluşturmak için geleneksel kuralları izledi.
Size bu kurallardan bahsedeceğim.
İpucu 1. Açılış sayfasına bir ürün yerleştirin
Bağlanamadı - okuyucu gıpta ile bakılan "satın al" düğmesine ulaşamayacak.
Aşağıdaki kuralları izleyin:
- Müşterinin dikkatini tek bir şeye odaklayın.
- Ona programın sadece bu versiyonunun faydalarından bahsedin.
- Ona bir üründe indirim teklif edin.
- Belirli bir konuyla ilgili bir bültenle ilgilenmesini sağlayın.
Bir ekrana on ürün yerleştirirseniz, ziyaretçinin dikkati dağılacaktır. Tüm sayfayı tarıyor. Belki de büyük bir indirime veya komik bir resme dikkat edecektir. Ve sonra sekmeyi kapatın. Beş saniye içinde varlığınızı çoktan unutacak.
Kullanıcı siteye girer. Onu ziyarete gelen ilk düşünceler: Nereye geldim, neden buradayım? Önümüzdeki birkaç dakika içinde bir cevap bulamazsa, bir müşteri kaybedersiniz.
İstatistiklere göre, potansiyel alıcıların %80'i sayfayı ilk on beş saniyede terk ediyor. Ve işte ana nedenler:
- Burada ne yapacaklarını bulamadılar. Sitede belirli bir harekete geçirici mesaj yoktur: “abone olun”, “sipariş verin”, “daha fazla bilgi edinin” vb. Unutmayın, ekranda basit “satın al” kelimesiyle imzalanmış “büyük kırmızı düğme” yoksa, kötü bir inişiniz var demektir.
- Ziyaretçiler burada ne sunulduklarını anlamıyorlar. Birbirine yapışmış onlarca detay, gösterişli gifler ve sürekli Caps Lock canını sıkıyor. Sakar unsurlar, ziyaretçinin dikkatini çekmek için savaşır ve onu ana şeyden - satın alma veya abonelikten - düşürür.
Bu ipuçları, ürününüzün satışlarını artırmanıza yardımcı olacaktır:
- her şeyimiz- ortasında geniş bir fiil bulunan dikdörtgen kırmızı bir düğme. Sadece sonuna değil, aynı zamanda sayfanın başına da yerleştirin.
- Kendinizi açıkça ifade edin. Doğrudan konuşun: kullanıcının ne yapması gerektiği ve bunun için ona ne olacağı.
- Ana fikirden uzaklaştıran her şeyi kaldırın. Anlaşılmaz grafikler, tarafsız resimler, aptal başlıklar, sol düğmeler, diğer insanların ürünlerinin reklamını yapan devasa afişler.
- Ziyaretçiyi ürününüzün münhasırlığına dair bir örnekle ikna edin.Ürünü överken daha fazla sayı, karşılaştırma kullanın. İknanın yanına kırmızı bir düğme yerleştirin.
- Belirli faydaları göster müşterinin teklifinizi kullanarak alacağı.
Ancak müşteriyi uyuşturma arzunuz konusunda aşırı hevesli olmayın. Aşırı baskı ve reklam koşullarının fazlalığı sadece okuyucuları hasta eder.
İpucu 3. Satış Başlıklarını Kullanın
Floresan lamba satıyor musunuz? İşte size bir başlık: "Enerjiden 4 kat daha verimli tasarruf edin."
Şişmanları fitness merkezine mi davet ediyorsun? Kalbe vurun: "Başka kim bir TV yıldızı figürünü ister?"
Başlık oluştururken h1 ve h2 etiketlerini kullandığınızdan emin olun. Mümkünse, anahtar ifadeler ekleyin - müşterilerin sizi bir arama motoru aracılığıyla bulmak için kullanacakları kelimeler ve kelime öbekleri.
İpucu 4. Kaliteli bir satış metni yazın
Metin birincidir. Tam olarak formüle edilmiş bir teklifiniz olana kadar, bir açılış sayfası tasarımı sipariş etmeyi düşünmeyin bile.
Metnin birinci sınıf olması için şunlar gereklidir:
- Öncelikle- ürününüze ihtiyacı olan kişinin kim olduğunu bilin. "İdeal alıcının" bir portresini oluşturun.
- İkinci- pazarlama ve satış psikolojisi hakkında kitaplar okuyun.
- Üçüncü- müşteriyi konuşmaya dahil edebilmek. Bu konuşma aslında bir monolog olsa bile. Muhatabın kafasında hangi soruların ortaya çıktığını hayal edin. Cevaplarınızı metne mantıklı bir şekilde yazın. Ürünle ilgili her şeyi anlatana kadar yazın. Ve karakter sayısına takılmayın.
İnternet pazarlama uzmanlarının büyük açılış sayfalarını eleştirmeyi nasıl sevdiklerini fark ettim. Eleştiri nesnesine daha yakından bakarsanız, sıkıcı ve bilgisiz metinlerin kınandığı ortaya çıkıyor. Bazı nedenlerden dolayı, eleştirmenler ilginç ve değerli uzun açılış sayfalarını atlar.
Aşağıdaki durumlarda büyük metinlerden korkmayın:
- Ürün karmaşık ve tanıdık değil. Müşteri, ürünün her avantajını çiğnemek zorunda kalacak. Yararını kanıtlamak için bol miktarda örnek verin.
- Ürün pahalı. Bir yanıt elde etmek için açılış sayfasının tüm süper güçlerini kullanmanız gerekecek - incelemeler, garantiler, davalar, indirimler, satış sonrası servis, hediyeler.
İstatistik
70% ziyaretçiler, işkence ettiğiniz açılış sayfasını ortasına kadar okumayacak. Kendini suçlama. Diğerlerinin dikkatini çekmeye çalışın 30% - bu da iyi.
İpucu 5. Agresif reklamlardan kaçının!!!
Bir cümlenin sonundaki üç ünlem işaretini nasıl seversiniz? Belki de CAPS LOCK eklenmeliydi?
Bunlar agresif reklamcılığın bir işaretidir. Normal bir insanda büyük harflerin ve üç ünlem işaretinin görülmesi panik ataklara neden olur: “Bana biraz saçmalık satmak istiyorlar”, “Yine bu müdahaleci reklam!”, “İnternetin çöplük olduğunu hep söyledim.”
Ve iyi metin yazarları, editörler, içerik yöneticileri için aynı zamanda yerelliğin, profesyonelliğin ve bazen, kusura bakmayın aptallığın bir işaretidir.
Ayrıca “esnek indirim sistemi”, “alanında lider”, “yüksek kalite ve düşük fiyat”, “harika deneyim”, “bireysel yaklaşım” gibi klişelerin de metinden çıkarılmasını öneriyorum. Tüm ham ve sayı ifadeleri tarafından desteklenmeyen pişmanlık duymadan silin.
Bu aşama, mal ve hizmetlerin başarılı bir şekilde tanıtılması ve satışı için çok önemlidir.
Direkt kurallara geçelim:
- Okunabilir yazı tipi - 16 punto. Önerilen: Georgia, Open Sans, PT Sans, Arial, PT Serif, Clear Sans, Garamond.
- Satır başına 80 karaktere kadar.
- Her 3-5 satır yeni bir paragraftır.
- Her 2-4 paragrafta bir - yeni bir alt başlık. Alt başlıklar, okuyucunun gözüyle gözden geçirdikten sonra ne söylendiğini kolayca anlayabileceği şekilde yazılmalıdır.
- Gerekli: listeler, alıntılar, tablolar.
Ziyaretçinin gözünün hareket edeceği yörüngeyi düşünün. Tüm unsurlar yerinde olduğunda, kişi bilgiyi kolayca algılar. Ve müşteri ürününüzü anlarsa, hemen satın alma şansı vardır.
Görsel gezinmeyi kullanın: oklar, simgeler, resimler. Kontrast gölgelerle dikkat çekin: başlıkları renkli olarak vurgulayın, kırmızı (sarı, turuncu, yeşil) düğmeyi kullanın.
Alakalı bir açılış, kullanıcının beklentilerini karşılayan bir sayfadır.
Başka bir örnek
Bir kullanıcı "%10 indirimle yeni bir iPhone satın al" başlığına tıklarsa, açılış sayfası bu telefonu ve bu indirimle satın almak için bir teklif içermelidir.
Yalnızca her pazarlama kampanyası için değil, her trafik kaynağı için de kendi açılış sayfanızı oluşturun. Örneğin, müşteriler bir sosyal ağdan Vkontakte'ye geliyor - bu siteye yansıtılmalıdır.
Alıcıların %90'ı bir şey satın almadan önce düşünür. İnsanlar dolandırıcılıktan korkarlar, güvenliklerinden korkarlar. Birçoğu kimsenin satın alımlarını bilmesini istemiyor. Korku itirazlara yol açar: "Para kaybetmekten korkuyorum", "Fiyatın bu kadar düşük olabileceğine inanmıyorum."
Müşteriyi kişisel olarak rahatlatamayacağınız için, itirazlarına önceden cevap vermeye özen gösterin. İkna edici argümanlar formüle edin ve bunları metne ekleyin.
ipuçları veriyorum:
- 1-2 hafta içinde para iade garantisi."Ürünü beğenmezseniz, ona yatırılan tüm fonları iade edeceğiz."
- Ürünü ücretsiz denemeyi teklif edin."Deneme 2 haftalık süre karar vermenize yardımcı olacaktır."
Bu tür pazarlama hamleleri, açılış sayfaları oluştururken alakalıydı ve öyle kalmaya devam ediyor.
Eksiklere karşı dikkatli olun. Artık çok az insan geri sayım sayaçlarına inanıyor. Özellikle açılış sayfası yeniden yüklendiğinde sayaç sürekli güncellendiğinde.
İhtiyatlı davran. Kalan ürün sayısını girin. Bilgileri sürekli ve manuel olarak güncelleyin. Kullanıcı, malların sökülmekte olduğunu görmelidir.
Alıcının öyle düşünmesini sağlayın
“Dün %50 indirimli 74 mikrodalga fırın vardı, bu sabah - 23 ve öğle yemeğine kadar sadece 7 tane kaldı. Hemen almamız lazım!"
İpucu 11. Kullanıcıyı güvende olduğunuza ikna edin
Harekete geçirici mesajın yakınına güven öğeleri yerleştirin.
- Sosyal Medya Düğmelerini Kullanın- tweet beslemesi, Facebook'ta beğeniler, VK'daki bir gruptaki abonelerin listesi.
- İnsanlara atıfta bulunarak incelemeler yayınlayın ya da onları terk eden şirketler.
- Ödülleri ve sertifikaları görüntüleyin. Belgeler tam boyutta açılmalı ve okunması kolay olmalıdır.
İpucu 12. Doldurulması gereken karmaşık formlar yok
Veri giriş formu tek başına ziyaretçilerde hoş olmayan duygulara neden olmaz. Hedef kitlenin çoğu sizinle etkileşime geçmeye hazır. Gerekirse isimlerini, mesleklerini ve e-postalarını yazacaklar.
Zorluklar, kayıt aşamasında kullanıcılardan hayatlarını daha detaylı anlatmaları istendiğinde başlar. Daha yakından tanışma anını daha sonraya - ziyaretçinin kayıt gerçeğini onayladığı zamana kadar ertelemenizi tavsiye ederim.
Başka bir sorun karmaşık bir captcha'dır.
captcha- kullanıcının robot olmadığını onaylayan bir dizi karakter (bulanık resimlerdeki sayılar ve harfler) girdiği açılır bir form.
Herkes sembolleri deşifre etmeye, bulmacaları ve bulmacaları çözmeye takılır. Bu yüzden herkes testi geçemez - yaklaşık %30-40'ı sekmeyi kapatacak ve teklifinizi hemen unutacaktır. Captcha'yı unutun. Rakiplerinize bırakın.
Bu tavsiye, önceki tüm noktaların özünü birleştirir. Basit bir Açılış sayfası sipariş edin.
Sayfa şöyle olmalıdır:
- Gereksiz grafik ve metin yok
- Yalnızca bir eylemi gerçekleştirme teklifiyle: bir ürün satın alın, bir bültene abone olun, vb.
- Görünüşte özgür, ferah ve düzenli
İdeal açılış sayfası bir logo, net bir başlık ve bir düğmedir. Ürününüz minimalist tarzda tek sayfalık yapmanıza izin veriyorsa kullanın.
4. Hangisi daha iyi: Profesyonellerden bir açılış sayfası sipariş edin veya kendi açılış sayfanızı yapın?
Sıfırdan bir açılış sayfası oluşturmak için gereken komut:
- Pazarlamacı. Bir strateji geliştirir. Bir teklif oluşturur. Sonuçların test edilmesi. Bir web sitesi prototipi oluşturur.
- Metin yazarı. Metinler yazar. Başlıklar oluşturur.
- Web tasarımcısı. Prototipe dayanarak bir düzen yapar. Özel efektler uygular.
- Ön uç geliştirici. Programlama ve dizgi. Farklı cihazlarda açılış sayfasının görüntüsünü test eder. Bir geri bildirim formu, bir arama düğmesi ve daha fazlasını ayarlar.
- Directologist, içeriğe dayalı reklamcılık uzmanı. Semantik çekirdeği analiz eder. Anahtar kelimeleri seçer. İçeriğe dayalı reklamcılığı ayarlar.
- Müdür. Kontroller çalışıyor. Projenin geri ödemesini hesaplar. Önemli kararlar verir.
Altı uzmanın hizmetleri size 3.000 USD'den mal olacak. Bu, çalışacak bir açılış sayfasının fiyatıdır.
İşin her aşamasını önceden doğru planlar ve iyi insanları önceden bulursanız, açılış sayfası 2-3 hafta içinde hazır olacaktır.
Şimdi ikincisine geçelim - "bağımsız" seçenek .
“Sıradan” bir insansanız, büyük olasılıkla programlama, tasarım ve yerleşim görevlerinde başarısız olacaksınız. Hazır bir ücretsiz şablon indirmek veya ücretli bir açılış sayfası oluşturucusu kullanmaktan başka bir şey kalmadı.
Bir metin yazarı, yönetici, bağlamsal reklamcılık uzmanı ve pazarlamacının işi omuzlanmalıdır. İşte yaklaşık bir eylem planı:
- Bir fikirle gel. Bir teklif formüle edin - ürününüze veya hizmetinize ihtiyaç duyan bir kitleye bir mesaj.
- Fikri mantıksal bloklara ayırın.İlk blokta bir soru sorarsanız, ikinci veya üçüncü blok cevap olmalıdır.
- Bir teaser tasarlayın*- Resim veya metin. Akılda kalıcı ve özlü hale getirin.
- Ana metin üzerinde çalışın. Burada bir metin yazarı olarak hareket edeceksiniz.
- Başlıklarla gel. Heterojen olmamaları ve bir hikayeye dönüşmeleri arzu edilir.
- Eylem çağrısı. Satış sitenizde “şimdi sipariş verin”, “arayın”, “abone olun” ifadeleri ve kelimeleri olmalıdır.
- Tasarıma girin. Doğru açılış sayfası şablonunu seçin. İcat edilen yapıya göre düzenleyin. Stoklarda fotoğraf, illüstrasyon arayın. Veya bir kamera alın ve malzemeyi kendiniz çekin.
- İnişe başlayın.İçeriğe dayalı reklamcılığı ayarlayın.
Sert? Ama ücretsiz! Doğru, bunun için çok zaman harcayacaksınız: belki de en az 4-5 hafta.
Bitmiş bir tek çağrı cihazı almanın yollarına bakalım.
5. Popüler Açılış Sayfası Oluşturucuları - İlk 3 En İyi
İnişlerin popülaritesi, bir dizi tasarımcının ortaya çıkmasına ivme kazandırdı. Şimdi size birkaç tanesinden bahsedeceğim - Rusça konuşan ve en popüler olan.
Yapıcı 1. Flexbe (flexbe.com)
- çok basit ve güvenilir bir açılış sayfası oluşturucu. Ücretsiz sürüm 14 gün boyunca geçerlidir - yapıcının işiniz için uygun ve uygun olup olmadığını anlamak için yeterli zaman.
En ucuz tarife ayda 750 ruble. Bu tutar şunları içerir: bir alan, 10 sayfa, 250 SMS bildirimi, teknik destek, posta kutunuz ve .RU bölgesinde ücretsiz bir alana kadar diğer "hediyeler".
En pahalı tarife ayda 3.000 ruble. Bu sınırsız sayıda alan adı, istediğiniz kadar sayfa, 1.000 SMS bildirimi vb.
Eksilerden - hayal edilemez derecede havalı bir şey yaratmak işe yaramaz. Fırfırlar olmadan bir dizi araç "Flexby".
Artıları: İnanılmaz hız. 10 dakika içinde kabul edilebilir bir tek çağrı cihazı oluşturdum. Mobil cihazların ekranlarında iyi görünüyordu.
Yapıcı 2. LPgenerator (lpgenerator.ru)
Beğendiğiniz şablonu zaten indirdiğinizi hayal edin. Hostinginiz ve bir alan adınız var. Sonra ne yapacağız?
İniş kurulum talimatları
Tek çağrı cihazının nasıl kurulacağına dair birkaç basit adım:
- Barındırma sağlayıcınızın web sitesine gidin. Hesap kontrol panelinize gidin.
- Sitenin kök klasörünü bulun (boş olmalıdır). Bu klasörün adı önceden satın aldığınız alan adıdır.
- İndir düğmesine tıklayın, görünen pencerede şablonla arşivi seçin.
- Arşiv, etki alanı klasörüne kopyalandığında, yanındaki "Paketi Aç" düğmesini tıklayın.
- İşlemin tamamlanması için 20 saniye bekleyin. Sayfayı yenile.
- İniş kuruldu!
Açılış sayfasını düzenlemek için alan adınızın kök klasörüne gidin ve gerekli dosyayı arayın. Metni, resimleri değiştirin, video ekleyin. Bunu öğrenebilirsiniz: konuyla ilgili birkaç makale okuyun - ve devam edin, para kazanın.
7. Çalışan açılış sayfalarının gerçek örnekleri
Yaklaşık 15-20 yıl önce, dürtüsel satın almalar için açılış sayfaları oluşturuldu. Eski günlerde insanlar hala asitli renklerden, çılgın giflerden ve diğer çöplerden etkileniyordu. Şimdi daha seçici olduk: boş vaatlerden geçiyoruz, sakin bir tona ve inandırıcı kanıtlara güveniyoruz.
"O" günler geride kaldı, ancak hala bir açılış sayfasının "gösterişli" olması gerektiğine inanan insanlar var. Onları aksine ikna etmek için bu bölümü oluşturdum. İşte açılış sayfası örnekleri. Artılarını ve eksilerini analiz edelim, neden çalıştıklarını anlayalım.
Örnek 1. Master Climate - iklim ekipmanı kuran ve satan bir şirket
www.masterclimat.pro - Bu siteyi daha çalışırken bir arkadaşımızla yaptık.
Site net bir yapıya, "havalandırma ve iklimlendirme" tarzında hoş bir tasarıma sahiptir. Ayrıca, bu açılış sayfasının uyarlanabilir bir düzeni vardır, yani site, mobil cihazlar da dahil olmak üzere herhangi bir ekran boyutuna uyum sağlar.
Örnek 2. Alfa-Bank boş pozisyonları
www.job.alfabank.ru - sitede geziniyoruz ve genç bir adamın Alfa-Bank'taki kariyerinin nasıl başladığını görüyoruz. Bir süre sonra, cazip görselleştirmeye baktıktan sonra, site ziyaretçileri nihayet harfleri görüyor. Sayfa iyi metin içeriyor - kalitesi hareketli bir resimden daha kötü değil.
Yeni açık pozisyonların bir açıklaması hemen yüzeyde yayınlandı, fırsatlardan bir bölüm yayınlandı. Başvuru sahipleri için - küçük ve çok basit bir form.
Eylem düğmesi: üstte, küçük ve göze çarpmayan bir "özgeçmiş gönder" düğmesi bir eksidir; sayfanın en altında, parlak bir “boş pozisyonları görüntüle” bağlantısı bir artıdır.
Küresel olarak, açılış sayfalarından üç şekilde kazanabilirsiniz:
- Özel inişler oluşturma yani tüm projenin web stüdyosu, tasarımcısı veya yöneticisi olmak, doğru ekibi bulmak.
- Tek sayfa sitelerini amaçlandığı gibi kullanma yani onlar aracılığıyla mal ve hizmet satmak.
- Kurşun üretimi yapın. Müşteri adayları - potansiyel müşterilerin bağlantıları. Bunlar, hedef şirketlere satılabilecek “sıcak” uygulamalardır. Örneğin, trafiği buraya çekmek ve oluşturulan uygulamaları bu gardıropları üreten şirketlere satmak için "Samara'da Dolaplar" açılış sayfası oluşturabilirsiniz.
Hangi yolu seçeceğiniz size kalmış. İlk durumda, sitelerin kendilerine ihtiyacı olan müşterilerden para alacaksınız ve ikinci durumda, satışlardan son kullanıcılara açılış sayfalarını getirecek para alacaksınız.
9. Sonuç
Gerçekte, insanlar açılış sayfasından bıktı. Aynı numaralardan bıktılar - geri sayım sayaçları, çılgın indirimler, "benzersiz teklifler", 2-3 yıldır değişmeyen statik incelemeler.
Bir ziyaretçinin açılış sayfanızı kapatmasını önlemek için onu şablondan çıkarın. Hayır, sadece şablonları kullanabilirsiniz, ancak bunları akıllıca doldurun. Yalan söyleme, geçici kazanımların peşinden koşma. Müşteriyi, onun ihtiyaçlarını düşünün.
Özetleyelim:
- İniş- bu, yeni aboneleri, alıcıları çekmek için harika bir araçtır.
- Sadece açılış sayfasında teklif vermeyin.İzleyicilerle iletişim kurmak için diğer alanları geliştirin - bir blog, ana site, sosyal ağlardaki gruplar.
- Bir açılış sayfası sipariş etmek için her zaman zamanınız olacak. Bu nedenle, önce kendiniz yapmaya çalışın. Hazır şablonlar ve yapıcılar bu konuda size yardımcı olacaktır. Sadece bir pazarlama stratejisi geliştirmeniz, bir metin yazmanız, içeriğe dayalı reklamcılık kurmanız gerekecek.
Makalenin sonunda - mükemmel bir açılış sayfası yapma konulu bir video:
Size işinizde iyi şanslar diliyorum, bir açılış sayfası açın ve satışları artırın!
Altın Numaralar Güzel bir telefon numarası nasıl satılır
Kripto para madenciliği: basit kelimelerle nedir
En iyi dizüstü bilgisayar işletim sistemi: Eksiksiz inceleme
Sınıf arkadaşlarından müzik indirmek için programlar Sosyal ağ sınıf arkadaşlarından üzücü bir şarkı indirin
Yandex tarayıcısının mobil versiyonu