V minulosti měly webové stránky spoustu nepotřebných prvků, konkrétně stránky plné honosných a ošklivých barevných schémat, příliš mnoho textu uvízlého v malých prostorech a vyskakovací okna, která se objevují a otravují návštěvníky.

Ale designéři tehdy nevěděli více, nebo spíše jen pracovali s jedinými designovými trendy a osvědčenými postupy, které znali.

Od té doby se časy hodně změnily.

Weboví vývojáři a návrháři již nejsou omezováni technologií nebo technikou, což znamená, že již neexistují žádné omluvy pro špatný design. To se týká každého prvku nalezeného na webu WordPress, od obrázku záhlaví domovské stránky po formuláře kontakty, stejně jako od typografie po vyskakovací okna. Při navrhování pro uživatelský dojem nyní záleží na všem.

Dnes se chci zaměřit na to, co dělá vyskakovací okno efektivní, což považuji za podstatnou součást procesu převodu. Konkrétně bych chtěl prozkoumat anatomii efektivního vyskakovacího okna WordPress a to, jak tento vzrušující prvek může zvýšit vaši míru konverze.

Argument pro používání vyskakovacích oken na WordPressu

Vyskakovací okna jsou zajímavým designovým prvkem. I když dočasně přeruší uživatelský zážitek (což se obvykle příliš neocení), ty, které se dělají správně, nabízejí něco tak přitažlivého nebo vzrušujícího, že návštěvníkům nevadí ztráta minutu věnovat pozornost.

Samozřejmě v tomto případě mluvíme o vyskakovacích oknech generujících konverze, které slouží ke shromažďování předplatitelů bulletin nebo lákat návštěvníky k nákupu. Vyskakovací okna však lze použít k různým účelům. Můžete například sdílet své soubory cookie nebo zásady ochrany osobních údajů, doporučovat související položky poté, co návštěvníci něco přidají do košíku, nebo je dokonce požádat o vyplnění rychlého průzkumu.

Pop-up anatomie - vyskakovací okno pro cílené doporučení

Pokud z velké části používáte vyskakovací okno, pravděpodobně chcete, aby návštěvníci jednali. Koneckonců, proč přerušit jejich zážitek, když rušení není užitečným využitím jejich času? Podle studie téměř dvou miliard vyskakovacích oken zjistili průměrnou míru konverze u těchto typů vyskakovacích oken na 3,09%.

Nyní si musíme položit otázku: Jsou vyskakovací okna stále relevantní a efektivní? Pokud je trh tak přesycený vyskakovacími okny, ahoj pruhy, překryvnými stránkami celé stránky a dalšími, stojí za to použít tento nástroj generátoru konverzí na vašem webu WordPress?

Samozřejmě !!!

Vyskakovací okna berou v úvahu mnoho dobrých postupů při navrhování webů. Například:

  • Vyskakovací okna odstraňují zbytečný nepořádek ze stránek vašeho webu.
  • Obvykle se skládají z čistých vizuálů a minimálního textu.
  • Výzvy k akci jsou dobře navrženy a jednoduše nabízeny ve smyslu znění.
  • Návštěvníci mají malou křivku učení, protože většina lidí zná vyskakovací okna a ví, jak s nimi komunikovat.
  • Vyskakovací okna poskytují zábavnou příležitost naplnit váš web animacemi, videi nebo sociálními důkazy.
  • Můžete je snadno vytvořit pomocí WordPress pluginy vysoká kvalita jako Hustle nebo OptinMonster.

Anatomický pop-up - sociální důkaz HubSpot

Dobře navržené vyskakovací okno je obecně ideální pro upoutání pozornosti návštěvníků, když to nejvíce potřebujete. Můžete je použít k odesílání včasných oznámení nebo žádostí. Údaje návštěvníka můžete také použít k nalákání na nákup.

Anatomie efektivního vyskakovacího okna WordPress

Je zřejmé, že úspěch vyskakovacích oken vašeho webu WordPress závisí na těch, která jsou perfektně navržena a mají tak přesvědčivé nabídky, že návštěvníci nemohou neinteragovat. Pojďme se tedy podívat, jak vypadá vítězný vzorec pro efektivní vyskakovací okno.

1. styl

Různé typy vyskakovacích oken bývají účinnější při přeměně návštěvníků na předplatitele:

  • Vyskakovací okna e-mailových předplat mají konverzní poměr 2,9%.
  • Uvítací vyskakovací okna (ta, která při vstupu zabírají celou stránku) převádějí 2,6%.
  • Vyskakovací vyskakovací okna převádějí 1,9%.
  • Inteligentní nebo Hello pop-up okna zobrazují konverzi 0,5%.

To neznamená, že musíte vždy používat tradiční vyskakovací okno pro předplatné e-mailu. Zde je příklad ze stránek Neila Pateli.

Pop-up anatomie - Neil Patelův bar Dobrý den

Tenhle je dobře provedený, protože je jednoduše navržený, nerušivý, et používá zábavnou animaci k upoutání pozornosti v případě, že její minimální stopa zůstane bez povšimnutí. Pamatujte, že výběr stylu není o použití stylu, který je nejoblíbenější nebo nejznámější pro vyšší míry konverze. Jde o nalezení stylu, který funguje pro vaše stránky, vaše návštěvníky a který je navržen tak, aby doplňoval zážitek mezi nimi.

2. barva

Barva bude samozřejmě vždy hrát hlavní roli v designu webových stránek. Pochopením psychologie za vybranými barvami můžete vytvořit efektivnější vyskakovací okna, která se převádějí. Samozřejmě také nemůžete zapomenout na zavedené barevné schéma vaší značky, takže jde o nalezení rovnováhy mezi návrhem vyskakovacího okna, které na webu vypadá dobře, ale které také nutí návštěvníky jednat.

3. složení

Je důležité udělat krok zpět a zobrazit vyskakovací okno jako celek. Ačkoli na konstrukci každé pohyblivé části ve vyskakovacím okně záleží, stejně jako celkový makeup vyskakovacího okna.

Vaše vyskakovací okno by mělo:

  • být jednoduchý a snadno sledovat.
  • Navrženo s čistými liniemi a být dobře vyvážené.
  • Zahrňte relevantní obrázky ve vysokém rozlišení; v ideálním případě jediný obrázek, který shrnuje předmět nabídky.
  • Vypadají jako rozšíření vašeho webu a zjevně nejsou vyrobeny z vyskakovacího okna s omezenými možnostmi přizpůsobení.
  • Použijte velkou, snadno čitelnou typografii.

4. text

Pak máme vyskakovací zprávu. I když nejste v procesu vývoje jazyka, který jde do těchto věcí, existuje řada osvědčených postupů, které byste si měli být vědomi, pokud jde o vyplňování vyskakovacích oken textem.

Mějte na paměti následující:

  • Vždy uvádějte název, krátkou zprávu (bude stačit jedna věta) a výzvu k akci.
  • Používejte silný jazyk, který přitahuje emoce návštěvníků.
  • Buďte stručný. Pokud ji nemůžete napsat méně než 30 slovy, tato zpráva nepatří do vyskakovacího okna.
  • Použijte stejný tón a osobnost, jakou používáte na svých stránkách.
  • Nabídněte něco cenného, ​​co vaši návštěvníci nenajdou nikde jinde na webu.
  • Je-li to možné, použijte naléhavost. Pokud to nemůžete udělat slovy, udělejte to barvou.

Vyskakovací okno anatomie - překryvná obrazovka Wishpond

5. CTA

V dnešní době existuje podivně rostoucí trend, kdy webové stránky nabízejí návštěvníkům dvě možnosti výzvy k akci. Chápu, proč tento trend roste, ale viděl jsem, že byl nesprávně použit na tolika webových stránkách, že doufám, že tento trend nakonec vymře.

Pravděpodobně jste sami viděli tuto špatnou aplikaci:

  1. Pozitivní volba : Tenhle říká: „Ach, děkuji, děkuji! Vím, že tato nabídka změní můj život k lepšímu! " 
  2. Negativní možnost : Tenhle říká: „Rád dělám špatné životní volby a oceňuji, že si mě třeseš po tváři.“ Dovolte mi kliknout na tuto sebepodceňující možnost, abych obdržel další okno, které se mě znovu zeptá, jestli chci učinit toto hrozné rozhodnutí. " 

To neznamená, že všechna vyskakovací okna se dvěma možnostmi CTA jsou špatně navržena nebo zamýšlena tak, aby návštěvníka zahanbila. Tim Ferris má dobrý příklad dobře provedené duální volby CTA:

Pop-up anatomie - Tim Ferris pozitivní negativní

Celkově bych však řekl, že pokud se snažíte být sarkastickí nebo zastrašit své návštěvníky při jejich rozhodování, pak se z vašeho webu odstraňte a dejte jej na Twitter. Váš web pro to není místo a Twitter to snad úplně pohltí.

Kromě tohoto mazlíčka navrhuji také udržovat jednoduchost výzvy k akci. Použijte jednoduchý jazyk, který objasní, co návštěvníci dostanou za zadání svého e-mailu nebo kliknutí na tlačítko. Udržujte také práci na minimu: ne více než dvě pole k vyplnění (tj. E-mail a možná jméno) a jedno tlačítko pro kliknutí.

To je pro tento návod vše, doufám, že vám umožní dobře navrhnout tlačítka výzvy k akci.