5 tipov pre tvorbu Landing Page, ktorá funguje

5 tipov ako vytvoriť landing page ktorá funguje - Kamil Aujesky - Truniversity

Pôvodne som tento článok chcel písať o wireframe tools, ktoré používam a ktoré som vyskúšal. No uvedomil som si, že trošku komplexnejšie to bude mať väčšiu pridanú hodnotu.

Nie som grafik ani programátor to je dôležité zdôrazniť na úvod. Som online marketér a viem, že mať iba vymakanú reklamu nestačí. To znamená, že sa často dostávam do pozície, že si musím navrhnúť landing page. Nie komplexné stránky, ale skôr jednoduché landing pages kde riešim wording, rozloženie a nejaké call to action prvky.

Pri tom ako tieto veci pripravujem používam zopár nástrojov na inšpiráciu a samotné spracovanie.

Nechcem tu vypisovať dlhé obkecy o tom ako máte pripraviť kreatívny headline, ale skôr praktické veci, ktoré môžu pomôcť… snáď to tak aj bude a kľudne v komentároch vyjadrite názor, prípadne ak používate iné tools tak ich tam možete hodiť tiež.

1. Definovanie akcie, ktorú chceme aby používateľ spravil

Pred tým než začnete čokolvek kresliť, vymýšlať, riešiť akúkoľvek reklamu alebo landing page by ste mali mať jasne definované čo chcete dosiahnuť. Môžete chcieť aby vám niekto nechal emailovú adresu alebo vyplnil komplexnú objednávku, vyskúšal váš online produkt alebo napríklad zavolal do vašej predajne.

Príklad1: Ak chcem aby niekto vyskúšal môj online produkt, logicky rozložím stránku tak aby som mu čo najjednoduchšie vysvetlil o aký ide produkt, aké benefity mu prinášam a jasné call to action na trial verziu. Call to Action prvky a video, ktoré vysvetluje produkt by som umiestnil na vrch stránky. Príkladov je viac www.vwo.cominhiro.com.

Príklad2: Ak chcem zbierať emailové adresy. Pokúsim sa najskôr odovzdať pridanú hodnotu používateľom a potom si od nich vypýtam ich adresu. Visibility blog je presne takto spravený. Keď si rozkliknete akýkoľvek článok až po jeho prečítaní na vás vybehne call to action na email.

Rozdiel medzi Príkladom 1 a 2 je teda v logickom umiestnení call to action prvkom na základe toho o čom je moja stránka, resp. čo chcem aby vykonali používatelia.

Priklady, ktoré som vyššie uviedol sú teoretické príklady, ktoré neplatia vo všetkých prípadoch a je veľmi dôležitý produkt, cieľovka atď.. Čiže vždy keď idem pripravovať nejaký web automaticky sa snažím klienta nastaviť tak aby bol pripravený na to, že budeme A/B testovať web.

2. Rozloženie stránky

Keď už máme zadefinované ciele stránky môžeme si ju skúsiť navrhnúť.

Aktuálne používam 2 tooly na WireFramy. Keď potrebujem niečo rýchlo a jednoducho nakresliť tak využijem wireframe.cc

Je to online tool a bez registrácie a loginu môžete kresliť wireframy. Má základné možnosti a v prípade jednoduchých landing pages to stačí.

Nástroj na návrh Landing Pages - WireFrame.cc - Truniversity



Keď potrebujem pripraviť niečo komplexnejšie používam UXPin.com. Dá sa využiť 14 dnový free trial a potom je pricing od 19 USD / mesiac. V nástroji si môžete vytvárať viac projektov, riešiť responzivitu a sú v ňom predrobené rôzne templaty, ktoré sa môžu hodiť.

Keď som pred nedávnom riešil online, kto aký tool na wireframy používa dostal som tip na Powerpoint. Keď si vygooglite nejaké templaty prípadne aj bez nich to môže byť jednoduchý a rýchli nástroj na prípravu wireframov.

Vo všeobecnosti ešte k rozloženiu. Videl som už veľa Heatmáp stránok a na spodok stránky sa zoscrolluje tak 10-15% používateľov pokial nemajú naozaj relevantné dôvody na to scrollovať. Na základe toho by ste mali teda call to action prvky umiestniť tak aby boli vyššie prípadne stále viditeľné.

3. Wording

V tejto časti to bude v skratke. Nepoužívajte copywriterov. Zo skúseností viem, že pri landing pages je lepšie keď si nawordujete stránku sami (neviem kto to vlastne číta čiže pointa je aby to newordoval kreatívny kopík). Text by mal napísať ten, kto najlepšie pozná produkt alebo najlepšie vie čo má stránka splniť. Je to dôležité preto lebo kreativci si dokážu dosť uleteť a môže sa strácať pointa celej stránky.

Druhá dôležitá vec: A/B test. Je to najjednoduchší A/B test vôbec. takže na to nezabúdať.


Pri rozložení a možno z časti aj wordingu môže pomôcť táto super stránka. Objavil som ju keď tam bolo ešte len nejako 20 tipov. Teraz ich je tam cez 70 a sú naozaj užitočné a relevantné. Zase.. treba si uvedomiť, že tam nie sú univerzálne návody ako to spraviť ale nejak0 tipy čo skúsiť.

4. Grafika

Po príprave grafiky je potrebná kontrola stránky, že či sa zachovalo rozloženie.. K tomu asi viac netreba.. Iba možno, že netreba zbytočne riešiť detaily v úvode a skúsiť skôr A/B test…

5. Spustenie stránky a A/B testov

No máme super stránku, ktorú sme dali von a vyhodnocujeme ako funguje.

Od začiatku odporúčam prípravu A/B testov. Ja osobne využívam Visual Website Optimizer čo je najjednoduchší tool na vytváranie A/B testov pre marketérov, ktorí nemusia vedieť vôbec programovať. Funguje to princípom drag and drop a je to fakt jednoduché.

Free trial a potom 49USD/mesiac. Tie peniaze sa ale určite oplatia. Naše A/B testy, ktoré sme riešili mali také výsledky, že ta návratnosť investície bola niekoľko násobná.

Nástroj pre A/B testovaie Landing Pages - Visual Website Optimize - Truniversity

Cez tento tool dokážete od základných A/B testov wordingu riešiť rôzne rozlženia stránky, farby buttonov, výmenu obrázkov, split testy rôznych URL adries, prípadne testovať rôzne landing pages na rôzne zdroje návštevnosti. Teda, že používateľom z AdWords ukážete inú landing page ako používateľom z Facebooku. Prípadne pre každý zdroj ešte samostatný A/B test.

Dobrý tool, ktorý som použil pár krát je ešte Optimizely. Tento tool tu bol skôr ako VWO, ale ja som zvyknutý viac na ten.

Free trial a potom customizovaný plán presne na mieru. Keďže tento tool moc nepoužívam neviem povedať ako sa pohybujú ceny. Ak máte niekto skúsenosť dajte pls. info v kometnároch. Vďaka.

Nástroj na optimalizáciu Landing Pages - Optimizely . Truniversity
Tieto tooly vám dokážu vyhodnotiť aj Heatmapy a click mapy, z ktorých sa dá určite veľa odčítať.

Výborný tool, ktorý tiež používame pre klientov a na základe, ktorého sme dokázali vyhodnotiť aj to, že používatelia sú zmätení z nášho wordingu na stránke a nechápu cenníku je HotJar.

HotJar natáča používateľov na vašej stránke, vyhodnocuje Heatmapy, clickmapy, scroll mapy, Dokážete vytvoriť jednoduchú anketu, ktorá vybehne na používateľov a máte relevantný feedback.

Nástroj na heatmapy a webovú analytiku - HotJar - Truniversity


Čiže keď to celé zhrniem postup je takýto:

1. Definícia cieľa

2. Wireframy – rozloženie stránky

3. Wording, grafika

4. Príprava A/B testov

5. Pravidelné úpravy


Vždy musíte byť či už vy alebo klient pripravený na to, že stránka nikdy nie je final verzia. Čiže bude treba vyčleniť nejakú časť budgetu a času na vytváranie A/B testov, optimalizáciu stránky a aj na človeka, ktorý bude nad tým rozmýšlať a celé to manažovať. V konečnom dôsledku by mali tieto aktivity priniesť viac penazí do firmy.

Pri komplexnejších stránkach je dobrá skôr personalizácia obsahu napr. cez Optimizely alebo Persoo. To je, ale na samostatnú tému.

Zaujala vás téma tvorby Landing Pages? Ak máte nejakú konkrétnu otázku z online marketingu, napíšte nám ju do TRUNIVERSITY FAQ a my vám dáme odpoveď.

[optinform]

Kamil Aujesky

Kamil Aujesky

Performance marketing manager / kamilaujesky.blogspot.sk

Máte iný názor alebo používate iné tooly? Podelte sa s nami o váš pohľad v komentároch.