Barion Pixel
Ez itt a lifelong learning

Sosem tudhatsz eleget!

Blog

Inspiráció

Kiváló Landing Page-ek

2021. március 19. | Bognár Péter

# # # # # #

Az első benyomás tartós” tartja a régi bölcsesség. A webdesignban ez különösképpen igaz, de még ezen belül is leginkább a Landing Page-ek esetében, ahol valóban húsba vágó fontosságú, hogy elsőre meg bírjuk ragadni a látogató figyelmét. De pontosan mi is az a Landing Page? Mi különbözteti meg a hétköznapi honlapoktól? Hogyan érdemes felépíteni, mire érdemes leginkább odafigyelni a megtervezésekor?

Landing Page vs. Honlap

A honlapokat persze nagyon is jól ismerjük, az alapvető honlap egy cég vagy szolgáltatás internetes képviselete, és a cég, no meg a termékpaletta bemutatása mellett jellemzően arra hívja a látogatót, hogy nézzen körül, böngésszen a különböző lehetőségek között – merüljön el a bemutatkozó vagy a “Rólunk” oldal izgalmas öntömjénjében, böngészgessen az áruk, szolgáltatások között, persze kukkantson be a blogbejegyzések közé is, egyszóval fedezze fel magának, amit kínálunk.

Forrás: Pixabay

A Landing Page ezzel szemben egy sokkal szűkebb értelemben vett marketing eszköz. Jellemző módon egy hirdetési kampányhoz, pontosabban szólva egy konkrét hirdetéshez fűződik: legyen az banner, szöveges Google keresőhirdetés, Facebook-reklám, rövid szpot a YouTube-on vagy a Videán, minden webes hirdetés egyetlen célja, hogy klikkelésre bírja a látogatókat. Ez a klikk pedig egyáltalán nem mindegy, hogy hová vezet: ha egy rendesen felépített kampányról van szó, a link túlsó végén egy speciálisan megkonstruált oldalt találunk, aminek az egyetlen kitűzött célja a konverzió vagy a lead-generálás, azaz csúnyán leegyszerűsítve, a látogató klikkelésre bírása, ügyféllé alakítása.

Konverzióról akkor beszélünk, ha a látogató megbökte a Call to Action gombunkat, azaz jelentkezik a hírlevélre, árajánlatot kér, előfizet a szolgáltatásra vagy rendel magának egyet az Egér a Marson mintás pólónkból. Ezt a megfelelő követőkódok beállításával könnyen mérhetővé is tehetjük. A Lead a marketing-szlengben az a látogató, aki már potenciális ügyfél: ismeri a céget, kapja a hírlevelet, ellátogatott a Landing Page-re, tehát érdeklődik a téma iránt. Megfelelő gondozással a Lead vásárlóvá puhítható. 

Hogyan építsük fel?

A Landing Page tehát valójában már a hirdetésnél kezdődik, legyen az szöveges Google Ads, Facebook-hirdetés vagy éppen egy animált html banner – a klikkelésre ösztönző reklám szerves egységben működik a weblappal, amire vezet, ahol felcsigázott érdeklődésétől vezetve “landol” a kedves látogató, azaz potenciális ügyfél, vásárló. 

A Landing Page-eket két fő típusra oszthatjuk, egyrészt a termékek szolgáltatások megrendelési oldalára, másrészt a feliratkozó oldalakra, ahol pl egy ingyenes e-könyvet, kuponkódot vagy egyéb nélkülözhetetlen dolgot ajánlunk a felhasználónak a személyes adataiért, pl. egy hírlevél-feliratkozásért cserébe.

A jó Landing Page lényege, ahogy fent is írtam, a fókusz. úgy vezeti végig a látogató figyelmét az oldalon, hogy az semmiképp ne tudjon a céltól elvezető linkeken át elveszni a számunkra. A Landing Page lényegében a fő honlap egy önmagában álló aloldala, lehetőleg minimális számú kifelé vezető linkkel és egyértelmű, könnyen begépelhető, olvasható URL-lel. Nagyon fontos tervezési alapelv, hogy a Call to Action gomb kiemelt helyen legyen, semmiképp ne az oldaltörés alatt. 

Néhány jó tanács a sikeres Landing Page megalkotásához:

  • Talán a legfontosabb elem a nyitó címsor, amin először meg fog akadni a látogató szeme. Régi stratégia, hogy megpróbálod végiggondolni, mi okozza jellemzően a legtöbb fejfájást a reklámozott szolgáltatás bejáratott ügyfeleinek, és ezeket a problémákat, aggodalmakat veszed célba és oszlatod el a frappánsan megfogalmazott fejléccel.
  • A Landing Page-ek esetében is nagyon hasznos a hitelességedet különböző vásárlói beszámolókkal, referenciákkal alátámasztani.
  • A lap tetején, tehát a beköszönő résznél érdemes egy jó hero image-et is elhelyezni, vagy egyenesen egy videót. Régi pszichológiai trükk a marketingben az arcok, szemek bevetése, legyen szó fotóról vagy grafikáról.
  • Legyen nagyon világos (főleg a saját magad számára), mi a konkrét célod: adatbázis építés (telefonszám, email cím vagy postacím?), vagy valamilyen szolgáltatás értékesítése (helyfoglalás, megrendelés, árajánlat-kérés, ingyenes próbaidő elindítása), esetleg valami más?
  • A Call to Action legyen világos és egyértelmű, no meg persze kellőképpen szembetűnő. Feljebb írtam, hogy érdemes az oldal elején elhelyezni, de az sem baj, ha többször visszatér a görgetések után (vagy közben), ahogy a lap alja felé haladunk.  

A jó Landing Page mindemellett nem kell, hogy rövid legyen, sőt, a reklámszolgáltatók algoritmusai (itt különösképpen a Google Adsre kell gondolnunk) jobban szeretik is a valamivel terjedelmesebb oldalakat. A hosszadalmasabb tartalom ugyanis több kulcsszót tartalmazhat, és ezáltal az algoritmus jobban be tudja lőni az oldalunk tartalmát és minőségét, ezen keresztül pedig azt, hogy kinek lehet érdekes a kapcsolódó kulcsszavakra kereső felhasználók körében. A jól összerakott tartalmat kínáló és szépen lekódolt oldalakat ráadásul az algoritmusok kiemelt találati helyekkel és kedvezményes árakkal honorálják.

Ugyanakkor a SEO és SEA bizony nem a kapkodó, türelmetlen emberek játszótere. Minden szaktekintély felhívja a figyelmünket két fontos tényezőre, amit az első perctől érdemes fejben tartani, ha ilyen projektbe kezdenénk.

Az egyik, hogy nincs tökéletes beállításokkal induló Landing Page és online kampány. Abszolút bevett gyakorlat az indítás utáni finomhangolás, a kulcsszavak, vagy akár a webdesign apró változtatása: az egyik gyakran javasolt eszköz, az A/B tesztelés lényege, hogy már az élesben futó oldalon vizsgálja az egyes, akár egészen apró elemek, mint pl. egy kapcsoló színe különböző változatainak teljesítményét. 

A másik tudnivaló, amit sajnos elég nehéz megemészteni, hogy nem szabad azonnali sikert várni. Egy jó Landing Page esetében is könnyen lehet, hogy akár hónapokat is kell várni, mire a kampány és a leszállóoldal elkezd igazán jó eredményeket hozni. Ez persze idegtépő dolog, főleg a megbízó oldaláról, aki nyilván azonnali eredményeket várna a kampányba fektetett pénzéért. Kitartás!

A lentiekben nézzünk meg néhány szép példát a gondosan megkonstruált Landing Page-ekre!

(Figyelem: ha a weben előforduló Landing Page-eket természetes közegükben szeretnéd megszemlélni, mindenképpen a fizetett hirdetésekre kell ráböknöd, máskülönben a cég sima weblapjára fogsz jutni. Ugyanakkor adott esetben azt is nagyon izgalmas megvizsgálni, miben különbözik egymástól a kettő. Sajnos ez némiképp esetleges: ha a kereső algoritmus szerint nem tartozol a reklám célközönségébe, vagy éppen nem kampányol annyira erősen az adott cég, egyszerűen nem fog megjelenni a hirdetés a keresési találatok között.)

GetResponse

Nagyon látványos, figyelmet megragadó a sárgával, a hagyományosan legfigyelemfelkeltőbb színnel kiemelt, animált címsor, ami egyszerre váltogatja is az üzeneteket. A fotón álló hölgy mélyen a szemünkbe néz, és persze szimpatikusan mosolyog, miközben a remek eredményeit mutatja. Itt is megjelenik a sárga – érdemes megnézni, hogy ezt a színt főleg a Landing Page és a hirdetések kedvéért vetették be, a céges oldalakon alapvetően az égszínkék a cég színe. 

A CTA összesen négyszer jelenik meg az oldalon: a legfelső menüsávban és persze a központi helyen, az üdvözlő üzenetben. Később, további győzködés, a különböző felhasználási lehetőségek taglalása és az árlista után újra előjön, már sárgával kiemelten hangsúlyozza a 30 napos próbaidő ingyenességét.

TunnelBear

A mackós VPN szolgáltató Landing Page-e is nagyon célratörő módon fogja meg a látogatót: tömör, velős és nagyon aktuális üzenettel (“Vedd vissza a privát szférád!”) próbálja megfogni a látogatót. A címlapra ráfért még egy előny taglalása, valamint három referencia a felhasználóktól. A lentiekben a jópofa mackó maszkotot is maximálisan kihasználják. Érdemes kiszúrni, hogy a Landing Page-en egy szót sem szólnak arról hogy havi 500 MB forgalomig ingyenesen is használható a szolgáltatás.

Spreadsheeto

Az Excel profi használatát oktató tanfolyamokat kínáló cég Landing Page-e kiváló példa arra, hogy nem feltétlenül muszáj, a grafikára kihegyezni a designunkat, hogy hatékonyan érvényesüljön. A Landing Page excelzöld menüsorából határozottan kiemelkedik a narancsszínű Call to Action gomb. Ezután egy tömörebb, a lényeget összefoglaló szöveg következik, majd ha elindul lefelé a látogató, újra nekiszegezik a kérdést, nem iratkozna-e föl. Ha még lejjebb megy, rengeteg információt kaphat a termékről és a cégről, természetesen köztük az elmaradhatatlan felhasználói tapasztalatokkal, és mindeközben rendszeresen visszatér a narancsszínű kapcsoló.

OGNO

A SEO specialista OGNO absztraktabb designt választott a potenciális ügyfelek behálózására. Látható, hogy ez egy Lead generációra kihegyezett Landing Page, azaz a cél nem az értékesítés, hanem a látogató közelebb hozása, konkrétabban egy ingyenes konzultáció nyélbe ütése. 

A címlapra egy rövid bemutatkozó szöveg jutott, barátságos nagy pasztell színű foltokkal a háttérben, jobb oldalt pedig egy absztraktabb grafikával, ami ugyanekkor az ötletek mozgását és az elégedett ügyfeleket is megjeleníti. Nagyon fontos elem az ügyfelek felsorolása: a cég abban a kellemes helyzetben van, hogy olyan neveket is fel tud mutatni, amelyek valóban magukért beszélnek.

Érdekes trükk a színes honlapon a fekete-fehér fotó egy üzleties, ámde lezser külsejű fiatal hölgyről a kapcsolatfelvevő form szövegmezői mellett. Az illető ugyan színtiszta illusztráció, mégis személyesebbé bizalmasabbá teszi a jelentkezést (azaz az adataink megadását).

ClickFunnels

A ClickFunnels pont azt a tudást árusítja, amivel ez a cikk is foglalkozik, az ügyfelek behúzását – nem a csőbe, hanem az értékesítési tölcsérbe, aminek a tetején átlagemberek mennek be, a végén pedig fizető ügyfelek potyognak kifelé. Az oldal megint csak erős a szövegben. Megjelenik viszont a videó a nyitó felületen, no meg egy méretes, ingyenes próbaidőt kínáló call to action gomb.

Figyelmet érdemel még a valós időben frissülő (vagy legalább is annak látszó) statisztika a nyitó szekcióban: látványos, hatásos üzenet, és önbizalmat sugároz, egy folyamatosan mozgásban levő cég képét mutatja.

A Landing Page további részében is a videóké a főszerep, összesen 5 fő videó árasztja magából az információt a termékről és a cégről, de szokatlan módon a vásárlói referenciákat is videós formában ajánlják fel. Ez persze azt is jelenti, hogy ha ilyesmit szeretnénk az oldalunkra, nem elég kivágni a szöveget az ügyfeleink hálás emailjeiből vagy Google-értékeléseiből, hanem egy ügyes videós társaságában fel is kell őket keresni és felvenni a történetüket, tehát egy lényegesen nagyobb energiabefektetést igénylő megoldás.

Lejjebb a webdesigner bevetett egy interaktív kérdőívet is, ami megmutatja, hogy bizony mi vagyunk az ideális ügyfél a cég számára, a lap aljára még egy FAQ szekció is elfért – a Landing Page nagyon igyekszik a látogató minden lehetséges aggodalmát eloszlatni és meggyőzni róla, hogy valóban ez a termék oldhatja meg a problémáit.

Öt Landing Page, öt különböző megközelítés – de talán elég ötlet és nyersanyag ahhoz, hogy beinduljon a fantáziád és bőven legyenek ötleteid, ha neked is tervezned kell egyet magad vagy az ügyfeleid számára!

Iratkozz fel YouTube csatornákra!

blog

Virtuális asszisztens legyél vagy webdesigner?

Virtuális asszisztens legyél vagy webdesigner?

2024. február 01.

Mindkettő fantasztikus lehetőség arra, hogy elhagyd a hagyományos kereteket, mint szoros, rugalmatlan munkaidő, helyhez kötöttség vagy akár a bérplafon. Egy ponton találkozik is a két munkakör, ahol a grafikai munka már az asszisztenciába hajlik – designerként is végezhetsz weboldal adminisztrációt, közösségi média tartalom készítést vagy felügyeletet és virtuális asszisztensként is sokszor találkozni már-már tervezői munkába […]

Tovább a cikkre
Secured By miniOrange