Müşterilerin Satın Almalarını Sağlayan 9 Popup Tasarım En İyi Uygulaması

Yayınlanan: 2022-06-29

Pop-up'ları çevreleyen çok sayıda tartışma var. Bazıları onlardan hoşlanmaz, bazıları ise kullanmayı sever; Ama kesin olan bir şey var ki, pop-up'lar dönüştürülür ve burada kalırlar!

Pop-up'lar - doğru kullanılırsa - gözden kaçırmak zordur ve bu nedenle, yepyeni veya geri gelen ziyaretçilerin harekete geçirici mesajınız (CTA) üzerinde harekete geçmesini sağlamanın en iyi yolu budur.

İyi haber şu ki, daha fazla ziyaretçiyle etkileşim kurmak ve kullanıcı deneyiminizi geliştirmek için en iyi açılır pencere tasarımını oluşturarak bu alanda uzman olmanıza gerek yok.

İyi bir pop-up kampanyası yapmak için izleyebileceğiniz belirli kurallar ve uygulamalar vardır.

popup-design-best-practices-cover-showing-two-popup-overlays

Açılır Pencere Tasarımı En İyi Uygulamaları Kılavuzu

Açılır pencere tasarımı en iyi uygulamalarını takip etmek ve güvenilir bir açılır pencere oluşturucu uygulaması kullanmak, markanız/mağazanız için son derece ilgi çekici açılır pencereler oluşturmayı oldukça kolaylaştırır.

Bu nedenle, hem görsel olarak çekici hem de ikna edici bir açılır pencere tasarlamak için en iyi dokuz uygulamayı sizinle paylaşıyoruz. Ek olarak, ipuçlarının nasıl çalıştığını göstermek için farklı markalardan bazı açılır tasarım örnekleri ekledik.

Etkili Açılır Pencere Tasarımlarını Kullanarak Dönüşüm Oranlarını Artırmak için 9 İpucu

Pop-up tasarımınızı nasıl iyileştireceğinizi, dönüşüm oranınızı ve işletmenizin büyümesini nasıl artıracağınızı merak ediyorsanız, işte başlangıç ​​için bazı yararlı ipuçları:

1. Hedeflerinizi Belirleyin ve Harekete Geçin

simpson-character-opening-life-goal-notebook-to-see-the-goals

Her şeyden önce, hedeflerinizin ne olduğunu anlamalısınız. Gerçek şu ki, onlardan ne istediğinizi bilmiyorsanız, açılır pencere tasarımlarınız doğru olamaz.

Pop-up'ınızı tasarlamaya başlamadan önce iş hedeflerinizi bilmek, tasarımın bunlarla uyumlu olabilmesi için önemlidir.

Hedeflerinizi belirlemeli ve buna göre aksiyon almalısınız.

  • Satışları artırmak.
  • Büyüyen e-posta listesi.
  • Ürün/hizmet tanıtımı.
  • Sepet terkini azaltmak.

Her açılır pencere için farklı hedefleriniz olabilir, ancak bunları en iyi sonuç için optimize etmek için belirli taktikleri takip edebilirsiniz.

Bu makalede, bu taktiklerin her birini gözden geçireceğiz ve bunları pop-up'larınıza en etkili şekilde uygulamak için bazı ipuçları vereceğiz, o yüzden başlayalım!

2. Harekete Geçirici Mesajınızın Dikkat Çekici Olduğundan Emin Olun

Basit ama ilgi çekici hale getirin!

Harekete geçirici mesajınız (CTA), açılır pencere tasarımı söz konusu olduğunda dönüşümün anahtarıdır .

Açılır pencerenizin, müşterileri e-posta adreslerini girmek veya sepetlerine bir ürün eklemek gibi belirli bir eylemi gerçekleştirmeye teşvik eden kısmıdır.

Harekete Geçirici Mesaj Düğmesi nedir?

CTA dikkat çekici değilse, potansiyel müşterileriniz büyük olasılıkla onu görmezden gelecektir - bu da ilk etapta açılır pencereleri kullanma amacını ortadan kaldırır. Örneğin, bu Hubspot'un blogunu tanıtan açılır tasarımı, basit ama akılda kalıcı bir harekete geçirici mesaja iyi bir örnektir.

Hubspot-email-listing-Popup-example-for-CTA-as-Popup-Design-Best-Practices

CTA'nızın öne çıkmasını sağlamak için yapabileceğiniz birkaç şey vardır:

  • Metin yerine bir düğme kullanın ; Düğmelerin görülmesi kolaydır ve arka plan rengine karşı öne çıkarlar.
  • Animasyonları veya hareketli grafikleri dahil edin ; Bu, ziyaretçilerin ilgisini çekecek ve onları harekete geçmeye teşvik edecektir.
  • Kısa tutun ; Site ziyaretçilerinin tam olarak ne yapmalarını istediğinizi bilmelerini sağlamak için harekete geçirici kelimeler ekleyin.
  • Düğmenin veya bağlantının bulunmasının kolay olduğundan emin olun ; Ziyaretçilerin onu aramasını istemezsiniz.
  • Aciliyet ekleyin ; "şimdi" veya "sadece bugün" gibi ifadeler kullanmak aciliyet ve FOMO yaratabilir.

3. Metniniz İle Kısa Ama İkna Edici Olun

Az söyle ama iyi söyle!

Ziyaretçiniz üzerinde bir izlenim bırakmak için yalnızca birkaç saniyeniz olduğundan , başarılı bir açılır pencere tasarımı için kısalık çok önemlidir.

Kopyanızla ikna edici olun; Ürününüzün veya hizmetinizin faydalarına odaklanın ve dikkat çekmek için güçlü kelimeler kullanın.

Mesajınızı güçlendirmek ve ne sunduğunuz konusunda net olmak için sosyal kanıt ve topluluk katılımından yararlanın.

İyi hazırlanmış bir açılır pencere tasarımıyla, insanları harekete geçmeye ve dönüşüm oranınızı artırmaya ikna edebilirsiniz.

İşte Lego'dan kısa ve ikna edici bir açılır pencere örneği. Web sitesini ilk kez ziyaret ettiğinizde açılan bir gezinme penceresi sizi e-mağazayı veya oyun alanını ziyaret etmeye davet ediyor.

Brief-Lego-popup-design-navigating-users-to-two-different-sections-of-the-website-with-two-CTA

Satış yok, sadece faydalı bilgiler ve kısa bir mesaj! Ek olarak, CTA'lar farklı olmasına rağmen, dikkat çekicidir ve yön göstermede aynı amaca hizmet eder.

4. Mesajınıza Daha Fazla Dikkat Çekmek için Kontrast Uygulayın

Açılır pencere tasarımınızın görüldüğünden ve buna göre hareket edildiğinden emin olmanın en iyi yollarından biri kontrast uygulamaktır .

Pop-up'ınızın en önemli öğesini izleyicilerinizde öne çıkarmak için renk tekerleğinde birbirine zıt renkler kullanın.

ultra-beauty-contrasting-floating-bar-pink-popup-design-best-practices

Bu tekniğin uygulamada mükemmel bir örneği, Ultra Beauty kayan çubuk açılır penceresidir.

Bu açılır pencerenin pembe rengi sitenin beyaz arka planıyla tezat oluşturuyor ancak web sitesi stiliyle uyumlu. Ayrıca, "Eğlenceyi kaçırmayın!" başlığı. kısa ama tetikleyici.

Bu nedenle, insanların mesajınızı gördüğünden emin olmak istiyorsanız, harekete geçirici mesaj düğmeniz veya tüm açılır pencereniz için zıt bir renk kullanmayı düşünün .

Dikkat çekmek ve görmezden gelinmek arasındaki fark bu olabilir!

5. Yaratıcı Görseller Kullanın ve Onlardan En İyi Şekilde Yararlanın

Açılır pencerelerinize alakalı görseller ve farklı şekiller ekleyerek sahip olduğunuz alandan en iyi şekilde yararlanın. Aslında, bir açılır pencere ne kadar benzersiz olursa, öne çıkma olasılığı o kadar artar. Aşağıda, ilgili ve dikkat çekici görüntülerin kullanıldığı bir COVID-19 yanıt bildirimi açılır penceresi örneği verilmiştir:

covid-pop-up-tasarımı-virüs-görüntü-ve-iyi-CTA'yı gösteren

İlgili görselleri ve grafikleri kullanmak, dikkat çekmenin harika yollarıdır ve genellikle insanların açılır pencerenizi fark etmelerini sağlamada etkilidir.

Pop-up'larınızda resim kullanmak için bazı iyi fikirler şunlardır:

  • Göndermek istediğiniz mesajla ilgili görseller
  • Ürünlerinizin resimleri.
  • Hedef kitlenizi veya ideal müşterinizi temsil eden kişiler.
  • Kullanılan ürünlerinizi gösterme.

6. Popup Tasarımınızı Web Sitenizin Tarzına Uyarlayın

Pop-up'lar, iyi tasarlanmışlarsa, insanların mesajınıza dikkat etmelerini sağlamanıza yardımcı olabilir. Ancak, bunu stil ile yapmalısınız!

Pop-up'ınızın tasarımını web sitenizin genel stiliyle eşleştirmek, markanızın kimliği için çok önemlidir.

Bunu yaptığınızda, açılır pencere daha gösterişli görünecek ve sayfalarınızdaki içeriğin geri kalanından farklı olacaktır.

Adobe Color'ı kullanarak eşleşen bir açılır pencere tasarımı oluşturabilirsiniz. Web sitenizin veya açılır pencerenin görüneceği sayfanın ekran görüntüsünü yükleyebilirsiniz ve Adobe Color yalnızca sitenizle çalışacak renkleri önerir.

Ardından, uyumlu bir görünüm oluşturmak için bu renkleri açılır pencerenizin tasarımına dahil edebilirsiniz.

popupsmart-popup-design-matching-popup-to-site-style-showing-team-members-smiling-and-inviting-the-user-to-book-a-demo

Bu, Popupsmart'ın potansiyel müşterileri mükemmel bir şekilde hedefleyen ve markanın kimliğine ve web sitesinin stiline uyan çıkış amacı pop-up'ına bir örnektir.

Popupsmart açılır pencere oluşturucu çözümü, açılır pencerelerinizi mağazanızın stiline uyacak şekilde tamamen özelleştirmenize olanak tanır.

7. Çok Fazla Bilgi İstemeyin

Bir müşteriyle iletişim kurmanız gereken tek şey onların e-postası olduğunda, neden onları bu kadar çok alanla rahatsız ediyorsunuz?

Açılır bir formdaki giriş alanlarının sayısını azaltmak, genellikle daha iyi müşteri deneyimi ve etkileşimi ile sonuçlanabilir.

İyi bir kural, yalnızca ihtiyacınız olan bilgileri istemektir. Bu, müşteri yolculuklarınızı kolaylaştıracak ve formu doldurmaları daha olası olacaktır.

Pop-up formunuzdaki giriş alanlarının sayısını sınırlamak, kullanılabilirliği artırmanıza ve daha iyi sonuçlar almanıza yardımcı olur. Aşağıdaki e-posta açılır pencerenizi tasarlarken bunu aklınızda bulundurun!

Sonsuza dek-21-basit-e-posta-pop-up-tasarımı-yüzde-20-ve gösteren-iki-model-kız-ve-erkek-marka-kıyafetleri

Bu iyi bir örnektir; Forever 21, bu açılır pencerede bir e-posta adresi karşılığında %20 indirim kuponu sunuyor.

8. Açılır Pencereleri Kapatmayı Kolaylaştırın

Yanlış kullanıldığında pop-up'ların oldukça can sıkıcı olabileceği bir sır değil. Ama daha da kötüsü ne biliyor musun? Pop-up'ları kapatmak zor!

Birçok pazarlamacı, ziyaretçileri hayal kırıklığına uğratan ve ayrılmalarına neden olan küçük, fark edilmeyen, tıklaması zor "X"leri kullanma hatasına düşer. Ya da daha kötüsü, ziyaretçilerin kendi başlarına çözeceğini umarak kapatma düğmelerini tamamen kaldırmaya karar verirler.

Ziyaretçilerin pop-up'larınızı kapatmasını kolaylaştırmak, sitenizle etkileşime devam etmelerini sağlar.

Ünlü Markalar Tarafından Kullanılan 20 İlham Verici Pop-up'a göz atın.

Sürekli ortaya çıkan can sıkıcı bir açılır pencereyi kapatamadıkları için web sitelerinden ayrılan insanların sonu olamaz. Bu şekilde hemen çıkma oranınıza zarar verme riskini almayın!

Popupsmart ile, ziyaretçiler için erişilebilir olmaya devam ederken, açılır pencereyi kapat düğmesini sitenizin stiline uyacak şekilde özelleştirebilirsiniz.

9. Özelleştirilmiş Mobil Pop-up'lar Oluşturun

Hepimizin bildiği gibi, mobil trafik giderek daha önemli hale geliyor ve web siteniz mobil cihazlar için optimize edilmemişse, birçok potansiyel işi kaçırıyorsunuz.

Açılır pencereleri farklı cihazlar için özelleştirmek zor olabilir ancak olası tüm kanallara ve hedef kitleye ulaşılmasını sağlar.

Masaüstü kullanıcıları daha büyük bir ekrana sahip olduğundan, açılır pencerenize daha fazla öğe ekleyebilirsiniz. açılır-akıllı-aracı ile-özelleştirilmiş-masaüstü-açılır-tasarım-oluşturma

Öte yandan, mobil kullanıcılar sınırlıdır, bu nedenle açılır pencerenizdeki faktör sayısını azaltmalısınız. Popupsmart-aracı ile-özelleştirilmiş-mobil-pop-up-tasarımı-oluşturma

Popupsmart, masaüstü ve mobil görünüm arasında geçiş yapmayı kolaylaştırır, böylece değiştirilmesi gereken öğeleri kolayca düzenleyebilirsiniz.

Ayrıca farklı cihazlar için ayrı açılır pencereler oluşturabilir veya mobil açılır pencereniz için aynı tasarımı kullanabilirsiniz.

Mobil açılır pencerelerinizin eğlenceli ve ilgi çekici olmasını istiyorsanız aşağıdaki ipuçlarını göz önünde bulundurun:

  • Mobil cihazınız için açılır kopyanızı ve CTA'nızı kısaltın
  • Kafa karıştırıcı arka plan resimlerini kaldırın
  • Form alanlarının sayısını en aza indirin

Yüksek Dönüştürücü Pop-up'larınızı Şimdi Tasarlamaya Başlayın!


Bu açılır pencere tasarımı en iyi uygulamalarını takip ederek, markanız için mutlu müşterilere yol açan ilgi çekici bir deneyim yaratabilirsiniz.

Pop-up'ınızı bu ilkelere dayandırmak, daha fazla dönüşüm elde etme şansınızı artıracak ve nihayetinde marka bilinci oluşturma hedeflerinize ulaşmanıza yardımcı olacaktır.

Ayrıca, bu uygulamaları takip etmek zor değildir ve bunları ihtiyacınıza göre doğaçlama yapabilirsiniz.

Bununla birlikte , her şeyin tek bir amaca yönelik olması gerektiğini hatırlamak daha iyidir; bu, kullanıcıların istenen eylemi tamamlamalarına yardımcı olur .

Bu listeye eklemek istediğiniz başka en iyi uygulamalar var mı? Yorumlarda bize bildirin!

Aşağıda, araştırmanızda yardımcı olabilecek bazı ilgili makaleler listelenmiştir:

  • 2022 İçin İlham Verecek Mükemmel Olarak Optimize Edilmiş 27 Pop-up Tasarımı
  • Popup UX Tasarımı: Yaygın Hatalar ve Bunun Yerine Yapılması Gerekenler
  • E-posta Açılır Penceresi: 15 Harika Örnekle Tam Kılavuz

İlgili terimler:

  • Tıklama Oranı (TO) nedir?
  • Dönüşüm Oranı nedir?
  • E-posta Pazarlama Nedir?