Mi az a konverzió optimalizálás? Hogyan teheted vele hatékonyabbá a weboldalad?

Tartalomjegyzék
Bővített tartalomjegyzék

Amikor elkészíttetted a weboldalad, nyilván Te is azt vártad, hogy óriási lesz a forgalma, dolgozik az oldal, hozza a megrendeléseket. Ugyanakkor talán most azt látod, hogy nincs növekedés, nincs konverzió, nincsenek eladások. De mi lehet a baj? Itt lép be a képbe a konverzió optimalizálás.

Amikor egy-egy látogató a weboldaladra téved, akkor azt szeretnéd, ha megtennének valamit. Nem feltétlenül azt, hogy egyből megrendeljék a terméked vagy a szolgáltatásod: lehet ez egy hírlevél-feliratkozás, egy információs anyag letöltése, vagy csak, hogy további tájékoztatás érdekében megadják az elérhetőségüket. Ezt hívjuk konverziónak, ami nem nő egyenes arányban a weboldalad látogatószámával. Ezért lényeges a konverzió optimalizálás a weboldalakon. De hogyan növelheted a konverzióid számát?

Mérd fel a helyzeted!

Ne tegyél semmit, amíg nem tudod, hogy hol is állsz! Először vess egy mélyreható pillantás a Google Analytics vagy bármely más elemző eszköz adataira, mert így kiderítheted, hogy kik látogatják az oldaladat, mikor, milyen eszközöket használnak, mit csinálnak ott.

Emellett tedd fel magadnak a következő kérdéseket, és próbálj rájuk válaszolni a felhasználók szemszögéből:

  • Könnyű a navigáció a weboldaladon?
  • Elég egyszerű call to actiont használsz?
  • Könnyű a felhasználóidnak elérni a céljukat?
  • Elég gyors a weboldalad?
  • A weboldalad tartalma megfelel a felhasználói igényeknek, és értékes ez a tartalom?

Ha a válaszod bármelyik kérdésre “nem”, akkor újra meg kell vizsgálnod a weboldaladat és a tartalmaidat, majd változtatni rajtuk.

Ezt követően

különítsd el három csoportra az oldalaidat

Az egyikbe kerüljenek azok, melyek szépen hozzák a konverziókat, a másikba azok, melyek nem hozzák, de kellene nekik, míg a harmadikba azok, melyek valahol a kettő között állnak. Ezeket aztán tovább oszthatod aszerint, hogy melyek hoznak nagyobb mobilos és melyek nagyobb asztali gépes forgalmat. Erre azért van szükség, hogy ötleteket meríts a jobban teljesítő oldalakból, melyek mobilon is masszív eredményeket érnek el. Ezeket az ötleteket pedig felhasználhatod a gyengébben teljesítő oldalaid feljavítására.

Figyeld az analitikát!

Az analitikai adatokat arra is használhatod, hogy megkeresd azokat az oldalaidat, melyeknél nagyobb a visszapattanás. Ha ilyen oldalakat találsz, akkor érdemes ezeknek jobban utánanézni, mert valami oka van annak, hogy túl gyorsan távoznak róluk a felhasználók. A visszapattanási arány pontos mérése ugyanakkor trükkös dolog, ennek már szenteltünk egy terjedelmesebb bejegyzést, érdemes átfutni.

Végül elemezd a felhasználók viselkedését a weboldaladon!

Ez az analitikai adatoktól egy kicsit eltérő típusú adat. Itt a felhasználók viselkedését kell elemezni, mely például hőtérképekkel történik. A hőtérképek remekül megmutatják, hogy mit is csinálnak a felhasználók, amikor a weboldaladra érkeznek. Kiderül, hogy hol hagyják abba a weboldalad olvasását, hol az a pont, ahol lelépnek az oldalról. Ezáltal meghatározhatod azt is, hogy mely információkat olvastak el, és melyek nem érdekelték őket.

Ha ezekkel megvagy, akkor továbbléphetsz!

Mi az, ami számít a konverzióknál?

Szinte minden. Most a részletekbe való belemerülés előtt felsoroljuk először, hogy meglegyen a kellően széles perspektíva.

Webdesign és felhasználói élmény

Mindössze 8 másodperced van arra, hogy meggyőzd a látogatókat. (Mások ezt 5 másodpercben határozzák meg, ahogy ezt már A Te weboldalad átmegy az ötmásodperces teszten? című bejegyzésünkben fejtegettük.) Néhány dolog, amire figyelned kell:

  • legyen letisztult az elrendezés
  • tüntesd fel a pozitív visszajelzéseket
  • alkalmazd, amit a konkurenciád jól csinál
  • legyen egy belső keresőmotor az oldaladon
  • használj nagyfelbontású képeket
  • könnyű legyen bejelentkezni az oldaladra
  • használj egyszerű formokat
  • legyenek hatékonyak a call to action gombjaid

Adj személyre szabott élményt!

Ha a tartalmaidat már a különböző vásárlói personáidra szabtad, akkor ugyanezt meg kellene tenned a felhasználói élménnyel is. Az “egy méret mindenkire” megközelítés nem működik sem a tartalmaknál, sem a webdesignban. Vagy legalábbis a személyre szabott megoldások hatékonyabbak.

Nem olyan bonyolult ez, mint amilyennek elsőre hangzik: kell készíteni egy belépő oldalt, ahol a felhasználók kiválaszthatják a számukra legmegfelelőbb utat azt figyelembe véve, hogy mi érdekli őket, vagy milyen csoportba tartoznak. Egyszerűen tedd lehetővé nekik, hogy válasszanak az alapján, hogy kik ők és mit akarnak.

Felhasználhatod a látogatók helyadatait is, és azt, amit tudsz a vásárlási és böngészési szokásairól. Ezeknek az adatoknak a birtokában személyesebbé teheted a böngészési folyamatot a felhasználók számára, melynek kapcsán talán már mondani sem kell, hogy mennyire hatékonyan segíti elő a konverziókat.Ezután pedig olyan élményt adhatsz nekik, ami pontosan rájuk van szabva.

Ne hagyd figyelmen kívül a trendeket!

A hatékony meggyőzés érdekében nem árt, ha képben vagy a webdesign trendekkel kapcsolatban. Mert attól függetlenül, hogy tetszik-e neked egy trend vagy sem, a trend felívelése azt mutatja, hogy sokaknak bejön valamilyen megoldás. Ami persze nem azt jelenti, hogy minden új dologra le kell csapnod, és kényszeresen alkalmaznod, de ha nem felelsz meg az elvárásoknak, annak a konverziós arányod látja a kárát.

A designtrendek közül sok azért válik népszerűvé, mert működik: jobb felhasználó élményt, jobban működő weboldalt eredményeznek. Ezek a trendek később sokszor design-szabványokká válnak.

A The Deep End Design infografikájában nem egyszerűen összeválogatta a most legdivatosabb webdesign-megoldásokat, hanem azokat gyűjtötték egybe, melyek szerintük a leghatékonyabb eszközök lehetnek a konverziós arány javításában.

  • Faltól-falig képek – tanulmányok szerint a nagy képekre felfigyelnek az emberek, mégpedig olyan módon, ami jellemzően a konverziónak is jót tesz.
  • Kettéosztott weboldalak – amikor többféle terméket vagy szolgáltatás kínálsz, fontos, hogy az ügyfeleid minél előbb a rájuk optimalizált landing oldalra jussanak. Egy kettéosztott megjelenéssel könnyen elérheted, hogy felhasználóid gyorsan megkezdhessék a “saját kalandjukat”.
  • Monokróm színek, kontrasztos CTA-val – a kontrasztos vagy semleges monokróm színek közül nagyon jól ki tud tűnni egy-egy feltűnő call to action gomb, ez pedig kattintásra késztet.
  • Priorizált navigáció – minél több opcióval találkozik a felhasználó, annál kisebb az esélye a konverziónak. Ezért javasolt minden másodlagos navigációt a háttérbe szorítani, mondjuk egy ikon mögé rejteni a menüt.
  • Lead-generálás minimál megoldással – egy egyszerű kérdés, néhány előnyöket ismertető mondat és egy feliratkozási lehetőség, minden zavaró tényezőtől mentesen. Mi lehet ennél hatékonyabb lead-generálásra?
  • Videók – az egyik legnagyobb akadály, hogy egy vevőből vásárló váljon: a bizalom. Egy videó nagyon jó megoldás a márkád megszemélyesítésére, és arra, hogy az emberek lássák ki vagy Te.
  • Ragadós CTA – minden weboldal legfontosabb eleme a CTA, a konverziók szempontjából pedig rendkívül fontos, hogy az mindig látható legyen.
  • Kártya-alapú design – a minap foglalkoztunk már kicsit részletesebben is a kártya-alapú designnal, melynek előnye, hogy a látogatók gyorsan elérhetik, ami érdekli őket, és hamarabb jutnak el a vásárlásig.
  • Egyhasábos CTA – ha eltávolítod a call to action gombjaid mellől az olyan zavaró tényezőket, mint például az oldalhasáb, az javítani fogja a konverziós arányod.

Állandó megújulás

Ahogy az autógyártók mindig friss modellekkel lépnek piacra, úgy kellene neked is 2-3 évenként frissíteni a weboldalad egy-egy redesign segítségével. Ez nem öncélú változtatás, hiszen a design azért változik, mert változnak az emberek és az a mód, ahogy a webet használják. Most már követelmény a felhasználó által olvasható URL-ek használata, a mobilbarát design, valamilyen CMS-rendszer használata, mely kellően keresőbarát megoldásokat kínál. Érdemes figyelembe venni azt is, hogy a saját kezűleg, könnyen összerakható, sablonokra épülő rendszerek nem mindig vagy nem teljesen felelnek meg a követelményeknek.

Tartalom

Tedd fel magadnak a kérdést: a tartalmad a megfelelő látogatókat vonzza? Olyan tartalmat készítesz, ami látogatót hoz vagy ami konverziót? A kulcsszavakat és a rájuk épülő tartalmat úgy kell összeválogatni, hogy azokkal inkább az utóbbi célt érjed el. Ha megvannak a megfelelő kulcsszavaid, akkor azokra építve kell tartalmakat létrehozni a blogodba, a weboldaladra és a közösségi médiába is.

Rövid szövegek?

A weboldal szövege kapcsán az egyik legelterjedtebb tipp, amivel találkozni lehet, hogy vegyük minél rövidebbre a szövegeket, hiszen a felhasználók amúgy sem olvassák el a neten, így pedig el sem jutnak a CTA-gombig. Ebben persze van igazság, azonban a másik oldalon ott áll az a tény, hogy aki érdeklődik az ajánlatod iránt, az szeretne minél több információt is beszerezni róla, nem pedig egy-két rövid mondat alapján dönteni.

Ezért hasznos, ha a weboldalon elhelyezzük a lehető legtöbb releváns információt. A hangsúly itt a releváns szón van, tehát nem kell regényt írni, teljesen elkalandozva a témától, felesleges dolgokkal fárasztva a látogatót. A lényeges információk viszont legyenek jelen a weboldalon.

Személyre szabott, hasznos tartalom

A konverzió optimalizálás során azt is végig kell gondolnod, hogy van-e megfelelő tartalmad az emberek számára a vásárlási folyamat minden szakaszára. Ha sikerül azoknak is valamit nyújtanod az adott pillanatban, akik már a folyamat végén tartanak, akkor jelentős mértékben megnöveled a konverzió esélyét.

Szánj időt arra, hogy kitaláld, miként tudnál jobb tartalmat kínálni a számukra! Ha kell, akkor tedd egyénivé, és olyan formában add át neki, ami fenntartja az érdeklődésüket. A tartalmaidon keresztül próbáld megmagyarázni az embereknek, hogy miért kellene téged választaniuk a versenytársak helyett. Ha sikerül rámutatnod a fájó pontjaikra, akkor felismerik, hogy segíteni tudsz nekik, és van is megoldásod a problémáikra.

Tippek:

  • Eredeti, jó minőségű szövegeket írj!
  • Korábbi tartalmaidat felhasználhatod újra, de új formában!
  • Rendszeresen frissíts!
  • Termékleírásaid legyenek informatívak és szórakoztatóak!
  • Teszteld a tartalmat is!

És ne felejtsd, hogy azoknak a cégeknek a 92 százalékánál, akik rendszeresen blogolnak, közvetlenül a blogjukból is érkeznek vevők.

Technikai dolgok

Légy mobilbarát!

Ha nem veszel tudomást a mobileszközök térhódításáról, akkor komoly hibát követsz el, és egy jelentős üzleti lehetőséget hagysz ki. Az okostelefonok a kereséseknél mára megelőztek a hagyományos asztali gépeket és laptopokat, ami jól mutatja az irányt. A Google már régóta azt javasolja, hogy tedd a weboldalad mobilbaráttá annak érdekében, hogy javítsd a felhasználói élményt és jó helyezést érj el a mobilos találati oldalakon, úgyhogy ha még nem tetted volna meg, akkor válts mobilbarát kialakításra, például reszponzív weboldalra!

Számold fel a hibákat az oldaladon!

A törött linkek, a 404-es hibák jelentős mértékben rontják a felhasználói élményt a weboldaladon. Ez pedig hatással van a konverziós arányodra, mivel manapság a felhasználók már csak másodperceket vesztegetnek az idejükből egy-egy weboldalra, főleg, ha nem működik megfelelően. Ezért ellenőrizd, hogy milyen törött linkek találhatók a weboldaladon, de készíttess egy egyedi 404-es oldalt, amin érdemes egy keresőt is elhelyezned, így az embereket más, számukra hasznos oldalaidra irányíthatod át.

Emellett:

Közösségi média

Azt is már sokszor hallhattad, hogy a cégek számára az egyik legjobb hely a megjelenésre a közösségi média. Ehhez kapcsolódóan javasolt, hogy tegyél az oldalaidra közösségi megosztási gombokat, ami lehetővé teszi az emberek számára, hogy az ott található információkat terjesszék a különböző közösségi média csatornákon. Ha ezt a lehetőséget kihasználod, jelentős mértékben növelheted a weboldalad forgalmát, valamint nőhet a céged iránti elkötelezettség is, ami pedig a konverziós arányodra lesz jó hatással. Vagyis:

  • weboldaladra helyezd el a social media csatornák megosztási lehetőségeit
  • rendszeresen frissíts új tartalmakkal a közösségi médiában is
  • ne a reklámot és az eladást erőltesd

Linkek és URL-ek

  • készíts jó tartalmakat, hogy jó minőségűek legyenek az oldaladra mutató linkek
  • távolítsd el a tört linkeket az oldaladról
  • építs fel logikus URL-struktúrát, érthető szövegeket használva
  • linkekkel kapcsold össze az oldalaidat

Online marketing

Ma már elengedhetetlen a komoly online marketing tevékenység az ügyfélszerzéshez. Mindent megteszel, hogy megtartsd a leadeket és vevő legyen belőlük? Ha egy látogató kitölt egy formot, akkor ő már azon az úton van, hogy megrendelővé váljon. Sok látogató nincs még abban a fázisban, hogy vásároljon, azonban a jövőben vevő lehet belőle. Őket érdemes megtartani hírlevelekkel, e-mail kampányokkal és a bennük lévő jó tartalommal, hogy az olvasók idővel vásárlóként térjenek vissza a weboldaladra. Mindez azt is jelenti nagyon egyszerűen fogalmazva, hogy elegendő pénzt kellene tenned az online marketingedbe, és oda kell figyelned rá!

Tesztek

A landing oldaladat és azok elemeit egyébként is érdemes mindig optimalizálni A/B tesztekkel, hogy meghatározd, mi az, ami működik a Te célközönséged esetében és mi nem. Használhatók erre olyan szoftverek, mint például az Optimizely, de a linkelt cikkünkben további, ingyenes megoldásokra is adunk tippeket. Emellett bevethetsz egyéb vizsgálatokat, használhatósági teszteket is (például a Clicktale-t), melyek segíthetnek a konverziós arány optimalizálásában. Ezekkel beazonosíthatod azokat a kihívásokat, melyekkel az emberek a weboldalad használata közben szembe találják magukat, és annak okára is fény derülhet, hogy miért nem konvertálnak.

Gyakorlatilag tehát a weboldal minden eleme, sőt még azon túlmutató dolgok is mind a konverziót befolyásoló tényezők, melyekre figyelned kell a konverzió optimalizálás során. De akkor nézzük a – talán – legfontosabbnak tekintett oldalon belüli tényezőt, a CTA-gomb kialakítását kicsit részletesebben!

A CTA gomb kialakítása

Amit itt mindjárt előre kell bocsátanunk, hogy rendkívül komoly félreértés, amikor attól várjuk konverziónk nagy mértékű javulását, hogy mondjuk más színű CTA-gombot adunk a weboldalunkhoz. A siker nem csak ezen múlik, hiszen egy részletkérdésről van szó. Ugyanakkor, ha a konverzió optimalizálás a célod, az nem fog menni hatékony call to action (CTA) gombok, linkek nélkül. A CTA gombodat a weboldalad kiemelt részén helyezd el, hogy a felhasználók azonnal megtalálják. Egy rossz elhelyezés megnehezíti a látogatók számára, hogy megtalálják azt, ami elveszett ügyfeleket jelent számodra. Oda tedd a CTA-dat, ahol az információt nyújtod a látogatóknak, így amikor kellően tájékozottnak érzik már magukat, bármikor kattinthatnak is rá!

Elhelyezés

Hova is kellene tenni a CTA-gombot, hogy a felhasználók felfigyeljenek rájuk és kattintsanak? Van esetleg olyan hely az oldalon, mely több kattintást generál, mint a többi? Igen, van néhány ilyen hely:

  • Egy űrlapnak a vége.
  • A call to action üzenet jobb oldala.
  • A kijelző vagy az oldal alja.
  • Egy üzenet alatt, középen.

Azért ezek a legjobb helyek a gombok számára, mert a felhasználók ezeket szokták meg a weboldalakon. A dolog azonban nem ennyire egyszerű!

A CTA kialakításánál azt kell kihasználnunk, hogy az emberi viselkedés megjósolható. Az emberek például szeretik az ismétlődő mintázatokat, és nagyon gyorsan feltűnik nekik, ha valami hibát, eltérést látnak egy mintában. Ezzel felkelthetjük a figyelmüket, és így nem kell olyan idegesítő és túlságosan nyilvánvaló megoldásokat alkalmaznunk, mint például 25 felkiáltójel a CTA-szövegünk végén.

miért kell trükközni a CTA-val?

Akik még nem foglalkoztak webdesignnal, konverzióoptimalizálással, landing page-ek tervezésével, CTA-k finomításával, azok talán még azt sem értik elsőre, hogy miért olyan lényeges a call to action megtervezése. Miért nem elég mondjuk a weboldal végén kiírni egy sorban, hogy “gyertek és itt iratkozzatok fel a hírlevelünkre”? A válaszunk erre: azért nem elég, mert mint az idők során már bebizonyosodott, egy ilyen CTA nem igazán konvertál. Azaz nem lesz feliratkozónk, főként azért, mert az emberek észre sem veszik. Hiszen, mint tudjuk, csak átfutják a weboldalt.

Ezért van szükség arra, hogy különféle vizuális trükkökkel kiemeljük a számunkra fontosabb elemeket a weboldalon. Tipikusan ezek közé tartozik a leadeket vagy már közvetlenül eladásokat jelentő CTA gomb is. Weboldalunk tulajdonképpen azon célból jön létre, hogy a call to actionre felhívjuk a látogatók figyelmét, akik ennek révén az általunk kívánt akciót végrehajtják.

Beterelni a konverziós tölcsérbe

Még akkor is szükséges ez, ha kifejezetten azért érkeznek az emberek a weboldalunkra, hogy valamit megrendeljenek nálunk. Ráadásul sokszor nem is ez a céljuk, hiszen egyszerűen csak tájékozódni akarnak, mi ugyanis magunkhoz vonzottuk őket igényes, hasznos tartalmunkkal. Tovább kell azonban haladniuk a konverziós tölcsérben.

Annál nehezebb továbbmozgatni őket, minél távolabb szeretnénk juttatni őket, azaz minél nagyobb számukra a tét. Egy hírlevél-feliratkozáshoz még könnyebb megszerezni egy e-mail címet, hiszen ingyen kapnak esetleg számukra hasznos tartalmat. Az viszont már más történet, amikor komolyra fordul a helyzet és súlyos pénzeket kell kifizetniük a termékünkért vagy szolgáltatásunkért.

A helyet az elköteleződés is meghatározza

Ez az oka annak, hogy egy kisebb elköteleződéshez, például egy hírlevél-feliratkozáshoz kapcsolódó call to actionnak nem kell olyan rafináltnak lennie, lehet egészen közvetlen: elhelyezed a felhasználó orra elé egy felugró ablakban, hogy észrevegye. Ez a megoldás azonban már nem fog működni akkor, ha valaminek a megvásárlására szeretnénk rávezetni a látogatót. Ehhez előbb elő kell készíteni, edukálni, mérsékelni az aggodalmait, felkelteni az érdeklődését, stb.

Ezért a CTA elhelyezése komoly megfontolást igényel. Sokszor hallani, hogy a landing page-en a hajtás felett tedd elé a CTA-t, és majd ömlenek a konverziók. Van amikor ez így megfelelő, sok esetben azonban kevés, hiszen előtte meg kell győzni a látogatót. Ha komolyabb elköteleződésről van szó, akkor a call to actiont nem biztos, hogy jó ötlet a hajtás fölé helyezni, optimális inkább a lap alján, erre viszont fel kell hívni a figyelmét. A kérdés, a hogyan.

Az alap: egy következetes webdesign

Ami feltétlenül kell, az a hatékony CTA-szöveg. A design csak felhívja erre a figyelmet. Ha nincs jó CTA-szöveged, azzal a design nem tud mit kezdeni. Mint azt már korábban jeleztük, az emberek arra figyelnek fel, ha valamilyen törés van a mintában. Először tehát ki kell alakítani egy mintát, egy ritmust. A weboldalad használ bizonyos betűtípusokat, színeket, layoutot és egyéb elemeket, ezek hozzák létre az ismétlődő mintázatot. Már ha jól tervezted vagy tervezték meg a weboldalad.

A jó webdesign egyik alapvető ismérve, hogy az elemek folyamatosan, bizonyos ritmus szerint ismétlődnek, ez a következetesség teremti meg a jó felhasználói élményt. Minél nagyobb a következetesség, annál könnyebb megtörni finom és elegáns módon. Megtörni pedig azért kell, mert ezzel tudod a számodra fontos dologra – adott esetben a CTA-ra – felhívni a felhasználók figyelmét.

Ha a weboldalad nem következetes, nincsen kialakult, ismétlődő mintázata, akkor az olyan, mint amikor egy társaságban mindenki eltérő színű, rikító ruhákba öltözik, és Te közülük akarnál kitűnni. Ezzel szemben, ha mindenki feketébe és fehérbe öltözik, Te viszont felveszel egy piros pólót, akkor nyilván minden szem rád fog szegeződni. A kiindulópont tehát az, hogy készíts egy egyszerű és jó, azaz következetes webdesignt, ahogy mindig is mondtuk, például itt is.

Megtörni a mintát

Ha sikerült egy jól használható webdesignt összehozni, akkor a megfelelő kontraszt kialakításával fel lehet hívni ezen belül bármire a figyelmet. A kontraszt alatt nem csak színkontrasztot kell érteni, hanem méretet, távolságot, pozíciót. Ezeket érdemes kombinálni, mert nem minden embernél működik mindegyik eszköz egyformán. Vagyis nem biztos, hogy elegendő a megfelelő színkontraszt kialakítása, hanem nagyobb teret is kell hagyni a CTA körül.

Igen, itt a whitespace-ről van szó, mellyel korábban már egy önálló bejegyzésben foglalkoztunk és számos cikkünkben érintettük is. A CTA körüli whitespace-szel fel tudjuk hívni a figyelmet valamire, miközben nem teremtünk túlzott zajt a designban. Azzal, hogy nagyobb teret alakítunk ki egy elem körül, elválasztjuk a tartalom többi részétől. Ezzel az elkülönítéssel a következetes designon belül gyorsan ráirányíthatjuk a felhasználó figyelmét a call to actionre.

Nyilván egyszerűbb megtalálni a CTA-gombot egy olyan oldalon, mely nincs telezsúfolva, vagy legalábbis a gomb körül rész nem zűrzavaros. Ha számos más elem jelenik meg a CTA körül, akkor az megzavarja a felhasználót, eltereli a figyelmét, nem tud a gombra fókuszálni. Ha pedig a landing oldalad felhasználóinak keresniük kell a CTA-gombot, akkor vesztettél.

Ezért mindenképpen hagyd lélegzethez jutni a CTA-gombodat. Ez segít abban, hogy jól láthatóvá váljon. Arról azonban ne feledkezz meg, hogy habár a whitespace kiemelt fontosságú a weboldalad kialakításában, könnyen túlzásba is eshetsz a használatával. Ha már egy adott elem a nagy whitespace miatt elveszíti a kapcsolatát az oldallal, akkor ezáltal a konverzió esélye is csökken.

Jól kialakított whitespace a CTA-gomb körül

Jól kialakított whitespace a CTA-gomb körül

Megtörni a rácsot

Amennyiben a mostanában népszerű rácsszerkezet mentén alakítottad ki a weboldalad designját, akkor azt a rácsszerkezetet kell ott megtörni, ahová a CTA-t teszed. Ha valaki most nem tudja miről van szó, akkor a lényeg röviden: a rács nem jelent mást, mint vízszintes és függőleges vonalak hálóját a weboldalon, melynek mentén a design elemei elrendezésre kerülnek. Ez határozza meg az egész layoutot.

Amennyiben a tartalmi elemek valóban a vonalak mentén kerülnek elhelyezésre, akkor ennek az eredménye egy jól szervezett, következetes designstruktúra, mely az egész oldalon végigvonul. A ráccsal kialakul tehát a vizuális minta a weboldalon. Ha ezt a rácsot bárhol megtörjük, arra fel fog figyelni a felhasználó. Tehát, ha egyetlen elemet – jelen esetben a CTA-nkat nem a rács mentén illesztjük az oldalra, akkor azzal mindjárt hangsúlyt is kap.

Irányjelzők alkalmazása

Annak érdekében, hogy könnyebben megtalálják a látogatóid a CTA-gombodat, olyan jelzéseket helyezhetsz el nekik az oldalon, melyek mutatják számukra az irányt. Nem kell bonyolult dolgokra gondolni, még akár olyan egyértelmű is lehetsz, hogy nyilakat helyezel el az oldalon. De ugyanezt tudják az embereket ábrázoló fotók, ahol valahová mutat vagy éppen néz a képen szereplő személy. Ezek egyből az oldal legfontosabb pontjára irányítják a felhasználó figyelmét, legyen az egy űrlap vagy maga a call to action.

Irányjelző használata a weboldalon

Irányjelző használata a weboldalon

Kevésbé direkt megoldás, amikor egy képen szereplő személy tekintete vezeti a weboldal látogatójának a tekintetét. Ez a technika azért működik, mert amikor a való életben rápillantasz egy embercsoportra, és azok valahová néznek, akkor Te is automatikusan abba az irányba fogsz nézni, mert próbálod kitalálni, hogy mi olyan érdekes.

Itt is vezeti a pillantásodat az emberi tekintet a lényeges rész felé

Itt is vezeti a pillantásodat az emberi tekintet a lényeges rész felé

Forma

Amikor gombokról van szó, alapvetően két formában érdemes gondolkodni.

  1. Kör: mely különösen a material design térnyerésével lett népszerű. Ha a forma illeszkedik a weboldaladhoz, akkor használhatod nyugodtan!
  2. Négyzet: az alapvető forma, amit a felhasználók már jól ismernek és megszokták a használatát. Általában a szélességük kétszerese a magasságuknak, de lehet három- vagy négyszeres is. Az emberek csak rápillantanak egy ilyen formájú gombra, és már tudják is, mire való.

enod

Nézzen ki gombnak!

Célszerű minél egyszerűbbé tenni a weboldaladon szereplő gombokat, hogy a felhasználókat ne érje semmilyen zavaró hatás, ami eltéríthetné őket a kívánt cselekvéstől. Másrészről viszont a gomboknak azért gomboknak kell kinézniük, különben nem tudják azonosítani őket az emberek.

A felhasználóknak a gombjaidat látva azt kellene érezniük, hogy kattintani akarnak a gombra.

  • Használhatsz egy finom árnyékot, hogy kiemeld a háttérből a gombot, és ezzel egy kicsit közelebb hozd a felhasználóhoz.
  • Alakíts ki nagyobb távolságot a gomb körül, hogy kattinthatóbbnak tűnjön a gomb, és vonzza magához a felhasználót.
  • Jelezz vissza a felhasználónak már akkor, ha a gomb fölé téved az egérrel.

Jó példa az alábbi weboldal alján szereplő gombok, melyek négyzet alakja és lekerekített szélei utalnak arra, hogy gombokról van szó, ugyanakkor nincsenek túlbonyolítva.

Egyszerű gombok

Egyszerű gombok

Szín

Érdemes úgy választani színt a CTA-gombhoz, hogy az sehol máshol ne jelenjen meg a weboldalon, csakis a CTA-gomboknál. Alapvetően jó választás lehet a sárga, a kék, a zöld vagy a piros. Ugyanakkor persze figyelembe kell venni a márka és a logó színeit is. Tehát érdemes olyan színekben gondolkodni a CTA esetében, melyek összhangban vannak az elsődleges színsémánkkal.

Ha igazán feltűnő CTA-gombot szeretnénk, akkor a weboldal fő színéhez kell egy kontrasztos színt kiválasztanunk. A megfelelő színkontrasztnak az a feladata, hogy a felhasználó tekintetét a weboldal egy bizonyos pontjára, esetünkben a CTA-gombra irányítsa. Ha kellően kontrasztos színt adunk a gombnak, akkor az emberek könnyebben rájönnek, hova is kell kattintani.

Ezen a hatalmas white space-eket használó oldalon az ember tekintete egyből a telibe színezett gombokra téved, és már tudja is, hogy klikkelni kell. Nem kell persze ennyire drasztikusnak lenni, érdemes figyelni arra is, hogy a gomb színe illeszkedjen a weboldalon használt színekhez, a stílushoz, de a példa jól mutatja, hogy miről van szó:

Kontrasztos CTA-gomb

Kontrasztos CTA-gomb

Kontraszt

A kontrasztot azonban nem csak színekkel lehet kialakítani, hanem egyéb tényezők is segíthetnek kontrasztosabbá tenni a CTA-gombunkat.

  • Méret
  • Forma
  • Áttetszőség vagy animáció
  • Árnyékok és átmenetek
  • Whitespace és padding

Méret

A gomboknak nagy méretűnek kell lenniük, hogy a felhasználók azonnal felfigyeljenek rájuk. És itt elsősorban a vizuális súlyukról van szó. A szellemgomboknak például meg van a megfelelő méretük, azonban a szín hiány miatt nem feltétlenül van meg a kellő vizuális súlyuk. A méretet tekintve mindkét tényezőnek szerepe van.

Ugyanakkor el kell lerülni a túlméretezett gombokat, melyek már nem is gombnak néznek ki. Ez a méret azonban minden design esetében más és más, hiszen a weboldal többi designeleme határozza meg az optimális méretet. Ugyanakkor, ha már szinte semmi mást nem látsz, amikor a weboldaladra nézel, csak a CTA-gombokat, akkor szinte biztos, hogy túlméretezted őket.

Ha esetleg több CTA-t használsz egy oldalon (ami egyébként nem igazán javasolt), akkor a legfontosabb legyen a legnagyobb méretű.

További tippek:

  • Használj olyan gombokat, melyek sarkai inkább lekerekítettek, ugyanis a tudósok szerint ezek a gomb belseje felé vezetik a tekintetet, míg a négyzet alakú gombok kifelé.
  • A gombot az oldal elejére és a középre helyezd, és akár az oldal görgetésével folyamatosan mozoghat, ugyanabban a pozícióban, mindig szem előtt maradva.

Vizuális jelentőség

Fontos, hogy a webdesignban semminek ne legyen azonos formája, színe, vizuális súlya, mint a CTA-gombnak. Különbözőnek kell lennie, hogy észrevehető legyen. Úgy alakítsd ki, hogy nagyobb legyen, mint bármely más hasonló elem a weboldalon, vagy használj egy olyan hangsúlyos színt, ami csak a gomboknál jelenik meg. Ezek a technikák segítenek abban, hogy a gombod különleges legyen, és kihangsúlyozzák annak funkcióját.

A megfelelő szöveg

Sokszor a figyelem csak arra irányul a tervezés során, hogy milyen egy gomb kialakítása, milyenek a színek, mennyire jól van elhelyezve, ugyanakkor a CTA-gomb szövegével már senki nem foglalkozik. Pedig ez a szöveg az, ami utal a kívánatos cselekvésre. Meg kell mondanod a felhasználónak, hogy mit akarsz tőle.

Egyszerűnek kell lennie, rövidnek, könnyen érthetőnek. Ugyanakkor pontosan, utasításszerűen kell megfogalmaznia, hogy mit várunk el a felhasználótól. Világosan kell látnia, mi fog történni, ha a gombra kattint, és ez milyen előnyöket jelent a számukra. Ha minden érved nem fér rá a gombra, akkor a gomb közelében kell elhelyezni a megfelelő mondatokat.

Az általános megfogalmazásokat kerüljük, használjunk olyan mondatokat, melyek közvetlenebbül, egyedi megfogalmazással szólnak a vevőhöz! Erre a legalapvetőbb, sokat emlegetett példa, hogy a gombra inkább ne az a felirat kerüljön, hogy “Rendelés”, hanem például az, hogy “Megrendelem”.

Itt jön be a képbe a hagyományos eladási pszichológia. A vevők érzelmi szükségleteit kell kielégítenünk a vásárlással, sürgető késztetést kell keltenünk arra, hogy megrendeljék a termékünket, szolgáltatásunk. Ilyenkor jelennek meg azok a mondatok, hogy “már csak 18 órád marad arra, hogy ilyen alacsony áron vásárolj”, “korlátozott raktárkészlet”, “most ingyen kipróbálhatod”, stb. Az igazán jó szövegek a vevők érzelmeire hatnak.

Milyen hibákkal ronthatod a konverziód?

Ha úgy látod, hogy megfelelő a forgalom a landing oldaladon, viszont ehhez gyenge konverziós arány társul, akkor lehet, hogy valami súlyos hibát követsz el.

Rossz látogatókat vonz a weboldalad

A megfelelő emberek érkeznek a weboldaladra vagy számodra teljesen irreleváns látogatók, akik azonnal le is lépnek az oldalról, amint rájönnek, hogy mivel foglalkozol vagy mit szeretnél eladni? Ez persze nem az ő hibájuk. Neked kell kitalálni azt, hogy milyen tartalmakat pakolsz az oldaladra, hol, hogyan, kinek jeleníted meg, hirdeted azt.

A felesleges, nem konvertáló forgalmat teljesen értelmetlen a weboldalra vonzani, miközben a számodra fontos személyek egyáltalán nem is tudják, hogy létezik weboldalad. A nem konvertáló látogatók számára nincs értelme tartalmat készítened, hiszen a célod a konverzió.

Annak érdekében, hogy egyáltalán megismerd a látogatóidat, bele kell bújni a Google Analyticsbe, vetni egy pillantás a visszapattanási arányra, valamint megvizsgálni, hogy van-e olyan forrása a látogatóknak, mely látványosan kevesebb konverziót hoz mint a többi.

A tartalom és az ajánlatok nincsenek stratégiai kapcsolatban

A leadgenerálás sikere azon múlik, hogy a látogatókat milyen hatékonysággal tudjuk leadekké formálni. Ennek érdekében a legtöbb aloldal általában kap egy CTA-t, hogy legyen esélye a látogatónak konvertálni (persze sok esetben a hiba már ott megjelenik, hogy nincs is CTA). A gond azonban itt az is, hogy sok olyan aloldal van, amelynek tartalma nincs összhangban a CTA-val, illetve amire az irányul. Ez pedig elvezet egy gyenge átkattintási arányhoz és csapnivaló konverziós rátához.

Ha vannak az aloldalaidon CTA-k, akkor át kell nézni, hogy melyik oldalról nem érkezik rájuk kattintás. Ezután lehet elemezni az oldal tartalmát, és hogy ez mennyire van erős kapcsolatban az ott lévő CTA-val, mennyire irreleváns a CTA jelenléte az oldalon. Ha gond van, akkor érdemes egyrészt új CTA-szövegekkel kísérletezni, másrészt pedig változtatni azon, hogy mire mutat a CTA-gomb.

Még mindig nem reszponzív a weboldalad?

Már nekünk kínos, hogy ezredszer ismételjük el a mobilra optimalizálás fontosságát, azt hogy már egy ideje a mobilkorszakban élünk, ehhez pedig igazodniuk kell a weboldalaknak is. Hogy nem megfelelően működik a mobilon elérhető weboldalad, az abból is látható lesz, hogy ha az Analyticsben összehasonlítod a desktopos és a mobilos forgalmat és utóbbinál nagyobb visszapattanási aránnyal találkozol, akkor az jelentheti azt, hogy a mobilos weboldalad nem teljesen ok. Ma már a fejlesztések a mobil first szemléletből indulnak ki, pont azért, hogy mobilon se veszítsünk látogatókat, főleg, hogy egyre több lesz belőlük.

Rossz a navigáció

A navigációról elég sokat írtunk, nem véletlenül. Jelentős részben múlik a navigáció használhatóságán egy weboldal teljesítménye. A navigációt a felhasználók igényeire kell szabni, ha azt akarjuk, hogy használják. Ha nem az emberek, hanem a saját igényeidre alapozod a navigáció kialakítását, az nem az optimális eredményeket fogja hozni. Ehhez vagy az Analytics Oldalon belüli elemzés funkcióját érdemes segítségül hívni, vagy pedig az Odalelemzés Chrome-bővítményt használni. Ha találsz olyan menüpontot, linket, ahová a többinél lényegesen kevesebb kattintás érkezik, akkor annak megjelenítését érdemes átgondolni.

Összességében tehát elmondhatjuk, hogy mindegyik hibánál arról van szó, hogy az emberekre kell odafigyelned, meg kell ismerni az igényeiket és érzékenyen reflektálni rájuk, ha jó teljesítményű weboldalt szeretnél. Nem magadnak, vagy egy-két elképzelt, de rossz célszemélynek kell magalkotni a tartalmat vagy épp a menüt, hanem a valós vásárlókon alapuló csoportoknak. Enélkül hiába várod a konverziót – értetlenül nézegetve az egyébként remekbe szabott weboldaladat, és közben a fejedet vakarva -, nem fog megérkezni.

Másolsz

Sokan úgy gondolják, hogy ha valaki másnak a weboldalát lemásolják – azon egyszerű megfontolásból, hogy az tetszik nekik és hatékonynak tartják -, akkor az automatikusan hozni fogja az eredményeket náluk is, azaz jó lesz a konverzió. Ez azonban nem feltétlenül van így, legfőképpen hosszú távon lehetnek gondok az ilyen megoldásokból.

Meg kell először érteni az okokat egy-egy vizuális elem, egy elrendezés mögött, mert e nélkül nem tudjuk, hogy miért kattintanak az emberek egy adott weboldalon. A lényeg ugyanis az adatokban van, a felhasználói viselkedés és a vélemények ismerete nélkül nem lehet jól megalapozott döntést hozni egy weboldal kialakítására vonatkozóan.

Ha csak a konverzióval foglalkozol

Habár eddig is a konverzióról beszéltünk, és úgy emlegettük, mint mindennek a célját, itt azonban nem áll meg a dolog. Nyilván arra kell törekedni, hogy konverziós arányunk minél jobb legyen, azonban érdemes a konverziók minőségére is vetni egy pillantást. Az például nem jó megoldás, ha trükkökkel sikerül beugratni a felhasználókat egy-egy konverzióba.

Fontos lenne megérteni, hogy valójában mit akarnak a felhasználók, hogyan alakíthatunk ki pozitív felhasználói élményt. A jó konverziós arány tehát fontos dolog, de az elkötelezett és elégedett felhasználó hosszabb távon még fontosabb.

Csak a designnal foglalkozol

A webdesign természetesen fontos – egy felhasználóbarát, vizuálisan vonzó oldal jó kiindulópont a jó konverzióhoz -, azonban nem ez az egyetlen dolog, amire figyelned kell. Számít még:

  • A tartalom – jó a tartalmad? Releváns a célközönséged számára? Olyasmit ad számukra, amit máshol nem találnak meg?
  • A címsorok – a címeit felkeltik a közönség figyelmét? Megfelelően illeszkednek a szövegeidhez? Azt kapják a látogatók a szövegben, amit a címben ígérsz nekik?

Azt hiszed, a több tesztelés mindig jobb

A tesztelés lényeges dolos, hiszen ezáltal határozhatjuk meg, hogy a felhasználók miként lépnek interakcióba az oldalunkkal, mit szeretnek rajta és mit nem. A több tesztelés jobb megértést jelent, de ez csak akkor igaz, ha tudjuk, mit is kell tesztelni. Valóban azokat az elemeket vizsgáljuk-e melyek hatnak a konverzióra, figyelünk a teljes felhasználói élményre, és nem csak a tesztek kedvéért végzünk teszteket?

Túl hamar fejezed be a tesztelést

Ha kitaláltad, hogy melyik elemet szeretnéd megváltoztatni a teszteléshez, akkor nem elég egy rövid ideig tartó tesztet végezni rajta, mert hibás következtetésekhez vezet. Lehet, hogy akár az első pár órában, vagy pár napon jelentős növekedést látsz a konverzióban, ez nem feltétlenül a módosítás eredménye. Sok egyéb tényező befolyásolja az eredményeket:

  • Az időpont: reggel, délután, este, éjszaka.
  • A hét melyik napjáról van szó: hétvége vagy hétköznapok.
  • Szezonális vásárlások.

Ezért érdemes a teszteket hosszabban futtatni, mert csak így lehetsz biztos benne, hogy más tényezők nem torzítják az eredményeket.

Túl sok dolgot változtatsz meg egyszerre a tesztelés során

Nyilván türelmetetlenül megpróbálsz minél többet kihozni a landing oldaladból, azonban ha egyszerre nyúlsz több dologhoz, akkor használhatatlanok lesznek az adatok. Itt van néhány olyan dolog, melyek közül egyszerre csak egyet módosíts:

  • Az oldalad fő üzenete.
  • A képek az oldalon.
  • A CTA-gomb színe.
  • A címsor.

A listát lehetne még folytatni, de a felsoroltak olyan lényeges tényezők, melyeket nem lehet egyszerre változtatni több más elemmel együtt, mert nem fogod tudni, mi okozza a változásokat.

Felesleges dolgokon változtatsz a teszteknél

Itt is az a kiindulópont, hogy nyilván szeretnél minél többet kihozni a landing oldaladból. Ezért mondjuk arra gondolsz, hogy kicsit vonzóbbá tesed az oldalad. De vajon tényleg ez az, amiért a weboldaladra jönnek a látogatók? És emiatt konvertálnak? Elképzelhető, hogy csak időt és pénzt pazarolsz olyan dolgok megváltoztatása miatt, melyek egyáltalán nem számítanak a látogatóknak. Először érdemes tesztelni, és csak utána lépni.

Véletlenszerűen változtatsz

Az nem segít, ha teljesen véletlenszerűen változtatsz meg dolgokat a landing oldaladon a jobb konverzió érdekében. Mielőtt egyáltalán megváltozatnál valamit, gondol végig a következőket:

  • Pontosan mit változtatsz? Ne felejtsd el, hogy egyszerre csak egy elemet változtass!
  • Miért változtatod meg ezt az elemet? A vizsgálatok azt mutatták, hogy itt lehet probléma?
  • Mit remélsz a változtatástól? Több eladást? Több feliratkozást?
  • Tudod mérni a változás eredményeit? A mérés rendkívül fontos, ezért legyen egy terved arra, hogyan fogod mérni az eredményeket.

Ha ezekre a kérdésekre nem tudsz válaszolni, akkor nincs értelme bármit is változtatni az oldaladon!

Címkék: , , ,

A Webshark.hu a hozzászólásoknál előzetes moderálást alkalmaz. Moderálási szabályaink itt olvashatók.