Hogyan működik a pszichológia a webdesignban?

A weboldal egy marketing eszköz. A marketing pedig nem más mint pszichológia. A hatékony webdesignban fontos szerepet játszanak a különböző pszichológiai tényezők, mert hatással vannak a felhasználók döntéseire.

A pszichológia már az előtt működik, mielőtt a látogatók megérkeznek a weboldalra, hiszen a keresőből, vagy a közösségi médiából a számukra legérdekesebb, legrelevánsabb címsorra kattintanak.

Miután megérkeztek, pozitív, vagy negatív érzések fogalmazódnak meg bennük a látottakkal kapcsolatban. Pl: “Jó helyen vagyok, ezt kerestem? Ez megoldja a problémámat? Megbízható a cég?” stb.

Ezek az érzések kevesebb, mint 10 másodperc alatt fogalmazódnak meg a felhasználókban, vagyis egyértelműen a vizuális benyomás alapján ítélik meg a weboldal relevanciáját.

Célcsoport

A legtöbb tényező, amit figyelembe veszünk a tervezés során, az általában széleskörű, a legtöbb felhasználóra igaz. Pl.: Reszponzív weboldalt tervezünk, mert mindenki mobilozik. Viszont fontos tudni, hogy a pszichológiai tényezők nem egyformán hatnak minden felhasználóra. A döntéshozatalban, nagy szerepet játszik a felhasználók életkora, neme, családi állapota, foglalkozása stb.

Fontos, hogy a célcsoport elvárásait mindig szem előtt tartsuk, hiszen egy kisgyermekes anyuka és egy menő startupper hölgy (bár lehet egy és ugyanaz a személy) internet böngészési szokásai és az Őket befolyásoló tényezők is lehetnek nagyon különbözőek.

Marketing

A vásárlói döntéseket nagyba befolyásolja a felület minősége, ahol az értékesítés történik, hiszen reflektál a termék minőségére is. Egy igényes szalonban nagyobb valószínűséggel adsz el bármit, mint egy lepukkant garázsban. A hanyagul kialakított webdesign taszító lehet a látogatók számára, ami befolyásolja a konverziót is.

Minden oldalt meggyőzően kell megtervezni, nem csak a kezdőlapot. A belső oldalak kinézetére sok esetben nem fordítanak kellő figyelmet, beömlesztik a szöveget és kész, pedig fontos, hogy minden oldal jól megszerkesztett, vizuálisan tagolt legyen.

A különböző CTA-kkal (Call To Action) meghatározhatjuk a fókuszpontokat, vezethetjük látogatóinkat a megrendelés felé. Az emberek természetes módon a feltűnő dolgok felé veszik az irányt. Ezt kihasználva rakhatunk a weboldalba feltűnő gombokat, vagy figyelemfelkeltő dobozokat, amivel a megrendelés, ajánlatkérés felé terelhetjük Őket.

A legtöbb figyelmet a weboldalak gördítés nélkül látszódó területe kapja, így a legfontosabb, legmagasabb prioritásban lévő információkat, kiemelt ajánlatokat érdemes ide elhelyezni.

Szín

Most tekintsünk el az olyan kliséktől, hogy “A kék a bizalom, a zöld a nyugalom színe”.
Egy szín különböző árnyalatai, vagy telítettsége is jelenthet mást és mást. Emellett más színekkel párosítva is teljesen eltérő jelentéssel bírhat. Kék-arannyal teljesen más érzetet kelt, mint kék-zölddel.

blue-site

Szinte bármilyen színnel meg lehet tervezni egy jó webdesignt, a hangsúly inkább az árnyalaton, a telítettségen és a színek harmóniáján van. A semleges színek (pl: fehér, szürke, bézs, fekete, pasztell színek) nagyon jól kiegészítenek egy fő színt. Egyszerre legfeljebb 5 színt érdemes használni, ennél több már zavaró, kaotikus hatást kelt.

A szín hatással van a konverzióra is. Ezt nagyon sok A/B teszt is igazolta már, nem mindegy, hogy egy gomb kék, zöld, vagy piros. Azonban a hatékonyság függ attól is, hogy milyen témájú az oldal és milyen célcsoportnak szól. Egy fogászati oldalon a piros gombra sokkal kevesebben fognak kattintani, mert a fájdalomra asszociálnak.

A kék az egyik leggyakrabban használt szín, jó okkal, hiszen első helyen szerepel a legtöbb felhasználó kedvencei között. Érdemes még tudni, hogy a nők nem igazán szeretik a szürke, a narancs és a barna árnyalatait, viszont kedvelik az ibolyát, a kéket, és a zöldet. A férfiak nem szeretik a lilát, a narancsot és a barnát, a kék, a zöld és a fekete a kedvencük.

Tipográfia

A megfelelő tipográfia fontos vizuális tényező, mivel a felhasználók több időt töltenek a szövegek olvasásával, mint a képek nézegetésével. A színekhez hasonlóan az egyes betűtípusoknak is vannak társított jelentései, amelyekhez érzelmek, hangulat társul, ezért ügyelni kell a betűtípusok, betűkombinációk és méretek megfelelő kiválasztására.

betü

A címsorokhoz érdemes a folyószövegtől eltérő betűt használni, hogy legyen betűdinamika, ezáltal könnyebb pásztázni a bekezdések között.

A talpatlan betűtípusok a legkönnyebben olvashatóak a kijelzőkön. Nagy tartalmú oldalaknál, vagy hírportáloknál is megfigyelheted. A talpas betűk nagyon jól használható címsorokhoz, vagy gombokhoz. A legtöbb script, vagy dekoratív fontot csak kis mennyiségben ajánlott használni.

A legmegfelelőbb a szemnek a másfeles sorköz, és minimum 15-20px margó a bekezdések között. Az ideális sor hossz körülbelül 50-75 karakter között van. Lényeges a megfelelő távolság is a betűk között, ne legyen túl sűrített, vagy ritkított sem.

Az üres hely is egy vizuális elem, az információ tagolására szolgál. Ha minden talpalatnyi területet kitöltünk szöveggel, grafikával, az kaotikus és frusztráló. Ha elegendő fehér terünk van, az letisztulttá könnyen befogadhatóvá teszi a tartalmunkat.

Képek

Nagyon hatásos és erősen javasolt a jó minőségű képek, illusztrációk használata, mert fotókkal könnyen befolyásolható a fókusz, erősíthető a kommunikációt, növelhető a hitelesség és az elkötelezettség.

A felhasználók kiemelt figyelmet szentelnek az informatív, kontrasztos, részlet gazdag fotóknak. A minőségi követelményeken felül akkor jó egy képanyag, ha az megfelelő üzenetet továbbít, motivál a döntéshozatalban, vagy vágyat ébreszt a termék iránt.

Az embereket ábrázoló képeken leginkább az arcokat, arckifejezéseket nézi meg a látogató. Azt akarják, hogy az arc, a személy kommunikáljon velük, így bizalom alakul ki. Érdemes olyan helyzeteket, embereket, arckifejezéseket mutatni, amik bemutatják azt a megoldást, amit a szolgáltatás nyújt.

Vizuális hierarchia

A Vizuális hierarchia valójában egy sorrend, amely szerint az agyunk rangsorolja a látottakat. Akkor jó egy design, ha a vizuális hatás az információ fontosságával egyenesen arányos és egyértelműen látszik, hogy mely elemek tartoznak össze, vagy melyek egymásnak alárendeltek. Ha tiszta és világos a viszonyrendszer az elemek között, akkor könnyebben befogadható a tartalom.

Pl.: Egy H2 szintű címsor, magasabb szintű hangsúlyt igényel, mint a folyószöveg ezért a betűméretben, vagy betűtípusban, esetleg színben, különböznie kell a folyószövegtől. A hierarchia nem csak a mérettől függ. Lehet színnel, formával és kontraszttal is kiemelni egy-egy fontosabb elemet.

hierarchia

Minták, szokások

A legtöbb felhasználó intuitív, az az ösztönös megérzésen, élményszerű felismerésen alapuló döntéseket hoz. Tudja, hogy a céglogót a bal felső sarokban találja, tudja mire való a hamburger ikon, és tudja, hogy a linkek általában kiemelt színnel szerepelnek. Ezen korábbi tapasztalatok alapján próbálnak felfedezni minden új webhelyet, még akkor is, ha esetleg az adott weboldal elrendezése mást sugall.

Ha nem találkoznak a megszokott megoldásokkal, akkor jobb esetben egy tanulási, felfedezési folyamat kezdődik (ha könnyen használható az oldal), vagy rosszabb esetben bezárják a webhelyet. Ezért fontos, hogy a weboldal felülete valamennyire megegyezzen a felhasználói elvárásokkal, nem számít mennyire hétköznapi, vagy unalmas az a megoldás.

Természetesen tervezőként és felhasználóként is vágyunkban az újításra, az új módszerekre. A felhasználók képesek felismerni az új mintákat, különösen akkor, ha azok pozitív érzéseket váltanak ki. Ezért az új megoldások bevezetése apránként mindenképpen ajánlott, amolyan “fűszerként”.

Összhang

A jó design észrevétlen, nem tudjuk megfogalmazni mitől, egyszerűen csak jó ránézni, egyszerű használni, jó visszatérni az oldalra. Minden összhangban van, minden összeillik, az egész harmonikus képet ad. A színek a betűtípusok, a tartalmak, gombok, a távolságok, a képek egy komplett egészet alkotnak, összhangot és egységet teremtve az oldalon.

Nagyszerű, elolvastad! Oszd meg a világgal!

Írta: Pócsik Emese webdesigner

2007 óta dolgozom a design szakmában. Munkáim nagy részét céges weboldalak, portálok tervezése teszi ki. Rólam bővebben »

Iratkozz fel értesítési csatornámra!

Tetszett a bejegyzés? Iratkozz fel csatornámra és küldök Neked E-mail értesítőt, ha ehhez hasonló új cikk kerül fel a blogra.