Reszponzív webdesign, UX design

3 UX tipp a felhasználóbarát landing oldalakért


Egy egyszerű landing oldal összeállítása manapság nem számít akkora kihívásnak. Egy olyan amelyik hatékonyan konvertál látogatókat potenciális vásárlókká viszont már annál inkább. Ha már rendelkezel weboldallal akkor bizonyára tudod, hogy az igazi kihívás a minőségi forgalom megragadása.

3 UX tipp a felhasználóbarát landing oldalakért
Author: Szabolcs Bakos

A kérdés tehát adott: Milyen módon építhető fel igazán ütős felhasználói élmény landing oldalak esetében? Mielőtt jobban belemélyednénk a részletekbe érdemes megjegyezni, hogy a landing oldal fogalma gyakran összemosódik azzal, ahová a látogatót linkeken keresztül elvezetjük. Azonban egyszerűbb ha úgy tekintünk a landing pagere mint egy önálló weboldalra, ami a fő weboldalad beléptetőpontja. Fontos, hogy egyszerű és működőképes felhasználói élményt biztosítson.

Érdemes az alábbi három fő célt figyelembe venni a tervezés során:

  • vonzza a látogatók tekintetét
  • értékes információkat gyűjt a látogatókról (például email cím)
  • segítse a felhasználókat akadály mentesen bejutni a konverziós tölcsérbe

1. Tipp Ügyelj az emocionális felhasználói élményre

Az emberek erősen függenek érzelmeiktől. Tehát amikor emocionális dizájnról beszélünk, azokat a kontextusokat kell érteni alatta, amelyek bizonyos élménynek, érzelmek kiváltói. Az érzelmek által vezérelt felhasználói élmény közelebb hoz célcsoportodhoz.

Így használj érzelmeket:

Szöveg

Emeld ki a problémákat, hogy az emberek lássák, hogy megérted őket. Törekedj a tartalmas mondanivalóra és ne riadj vissza az érzelmek kifejezésétől legyen az humoros vagy éppen valami szomorú.

Képek

Használj nagy felbontású képeket amelyek összhangban vannak a kontextussal. Ne csak szavakkal fejezd ki mennyire jó a terméked vagy szolgáltatásod, mutasd is meg! Olyan stock fotókat használj amelyek valós szituációkat reprezentálnak, így könnyebben tudnak azonosulni a látogatók.

Videók

Ha egy kép felér 1000 szóval akkor egy igényes videó felér 1000 képpel. Emellett egy webes környezetre optimalizált videó nem lassítja az oldalt.

Ajándékok

Az emberek szeretnek kapni. Legyen akár ingyenes tartalom, kuponok, ügyelj rá, hogy őszinte legyen a szándék. Ha “hátsó szándék” húzódik meg az ajándékozás mögött az ront a felhasználói élményen.

2. Tipp Ügyelj a színekre és a kontrasztra

Biztos vagyok benne, hogy hallottad már a városi legendákat ahogyan a színekkel elméket tudnak manipulálni. Ez talán kicsit távolinak tűnik, de az igazság az, hogy a színek fontos szerepet játszanak a pozitív felhasználói élmény kialakításában.

Amikor a kontrasztról kérdezem az embereket gyakran az ugrik be elsőre nekik, hogy ellentétes színek. A kontrasztnak a felhasználói élmény tervezésénél azonban sokkal tartalmasabb jelentése van. Közel 218 ezer látássérült él hazánkban, az alacsony kontraszt alkalmazása azonban megnehezíti a látássérültek navigációját az adott felületen. Az alábbi képeken azt láthatod, hogy az egyik legnehezebben kezelhető színpárt, a zöldet és a pirosat hogyan látják ezen személyek.

3. Tipp Építsd fel a vizuális hierarchiát

Amikor egy landing oldal tervezéséről van szó, az egyes elemek különféle céllal és prioritással szerepelnek. Minél közelebb kerül a tervezett felhasználói élmény a valós elvárásokhoz annál közelebb kerülünk a konverziónöveléshez. A vizuális hierarchiával meghatározhatjuk, hogy a landing oldal látogatói hova figyeljenek először.

Az F mintát követve a felhasználók először horizontálisan pásztázzák a felső szegmensét a landing oldalnak. Ezt akár többször is megismételheti azonban ezek a mozgások egyre rövidebb területet fednek le. Az utolsó fázisban a látogató vertikálisan böngész a képernyő bal oldalához igazodva.

Egy másik elterjedt változat a Z minta, amely jellemzően a szövegben szegényebb de vizuálisan gazdagabb felületeknél jelenhet meg. Az ilyen minták felismerésére természetesen létezik felhasználói élmény optimalizáló eszköz amely hőtérképek, illetve úgynevezett session replay funkcióval szolgáltat elsőkézből adatokat a látogatók landing oldalon tanúsított magatartásáról.

Ha már a felhasználói élmény tervezésénél tartunk érdemes megemlíteni a white space-t. Sokan ezt pusztán kihasználatlan üres térként kezelik, azonban ez a hozzáállás téves. A white space igenis értékkel bír a UX design világában. Gondolj úgy rá mint a “kevesebb néha több” szabály megtestesülésére.

Néhány érv ami a használata mellett szól:

  • Javít az olvashatóságon, priorizálja a tartalmat és az egyes UI elemeket
  • Letisztult képet alkot, eleganciát sugall az oldal látogatói számára
  • Segít az ideális pásztázási minták kialakításában mint az F vagy a Z minta

Konklúzió:

Gyakran a landing oldalak definíciója félreértelmeződik. Egy egyedileg elkészített landing oldal javíthat a keresőmotorokban elért pozíción, értékes leadeket generál, növeli a hitelességet. Azonban, hogy ezek mind teljesüljenek, elengedhetetlen figyelmet szentelni a felhasználói élmény optimalizálására.


Bakos Szabolcs, UI/UX Designer

Kövess Facebookon a friss bejegyzésekért

Bakos Szabolcsnak hívnak, szabadúszó UI/UX Designer vagyok, több mint 17 év webdesign tapasztalattal a hátam mögött, cégek és vállalatok számára tervezek weblapokat.



Vedd fel velem a kapcsolatot!

Amennyiben kérdésed van, legyen az egyszerű információkérés, együttműködés, vagy üzleti megkeresés, örömmel állok a rendelkezésedre.

Elolvastam és megértettem az Adatvédelmi és szerzői jogi nyilatkozatot

UI/UX Design
Facebook Twitter Google+ Linkedin
Webdesign