7 dizájn hiba, ami megölhet egy webáruházat

A látogató az oldalnak sokkal hamarabb látja a küllemét, és az elrendezettségét, mint azt, hogy van-e benne szűrési rendszer, vagy, hogy jó-e a kategória elrendezés, netán megnyerőek-e a termékleírások. Így elengedhetetlen, hogy az áruház megjelenésével is foglalkozzunk.

Bármely áruház esetén igaz, hogy a megjelenést sokkal szabadabban választhatjuk meg, mint a működést, mivel az utóbb már adott (és legtöbbször bonyolult) informatikai háttérrel rendelkezik. Ez persze nem jelenti azt, hogy ne lennének írott, vagy íratlan szabályai annak, hogy mit és hogyan válasszunk meg áruházunk kinézetén.

Ha a hibákból tanulni lehet, úgy a legjobb másokéból tenni ezt, hiszen minket már így nem érhet kár. Ezen megfontolásból gyűjtöttünk össze egy csokorra valót a legalapvetőbb hibákból.

1. Nem túl bizalomgerjesztő

Hiába „felszerelt” az áruházunk, hiába van telezsúfolva mindenféle funkcióval, ha a dizájnra egyáltalán nem adunk. Ha az oldalunk úgy néz ki, mint egy ’90-es évekbeli teletext, vagy csak egyszerűen olyan, mint ami szétesni készül, már sokat vesztettünk.

Így nemhogy a vásárlásig, de még a kosárba rakásig sem jut el a reménybeli vevő, mert kétszer meggondolja, hogy aki ennyire foglalkozik a webáruházával, attól érdemes-e rendelnie. Még akkor is ezt teszi, ha amúgy minden más rendben van. Ő ugyanis ezt nem tudja. Csak arra támaszkodhat, amit lát.

Mivel mindegyik oldal egy-egy brandet jelent, amelyet nemcsak az oldal kinézetével, de minden mással is építenek (mint a szolgáltatás minősége, színvilág, stb.), ezért elvárható, hogy a webáruházuk is szépen nézzen ki.

2. Túldíszített

A mai trendek – főleg a webes felületeken – az egyszerűséget, és a funkcionalitást hangsúlyozzák. Ennek szöges ellentéte lehet egy barokkosan túldíszített oldal, ahol mind megannyi kis apró – és nagyon felesleges – kicsi képi elem, felesleges cakkozás teszi az oldalt átláthatatlanná. Ettől nemcsak hogy elvész a lényeges tartalom, de a sok apró rész előbb csak zavaróan hat a látogatóra, később idegesítővé is válik.

Ez tulajdonképpen az első pont teljes ellentéte, hiszen itt nem arról van szó, hogy valaki egyáltalán nem foglalkozik az oldal külsejével. Hanem pont arról, hogy – rossz értelemben véve – túl sokat. Bár ez a típusú hiba ritkán fordul elő, van egy válfaja, amely viszont elég gyakran, ezek pedig a túlszínezett oldalak.

A legtöbb esetben három fő színre kellene építeni az oldalt. Ezeket érdemes valamilyen elgondolás mentén megválasztani, hogy három egymást kiegészítő (harmonizáló), de eléggé különböző színt használjunk. Amennyiben szükséges, használhatunk ezekből kiinduló világosabb, vagy sötétebb árnyalatokat.

Minthogy a megjelenés ezerféle lehet, és jóval könnyebb is variálni egy weboldal esetén, így csak természetes, hogy az interneten sok segítségre bukkanhatunk. Léteznek színpaletta, vagy színséma oldalak, ahol saját magunknak, interaktívan rakhatunk össze három-négy-öt színt tartalmazó színsémát. Itt most csak a legjobbak közül igyekeztünk válogatni:

• colorschemedesigner.com  - Ezen az oldalon az adott színekhez társítható színárnyalatokra is kapunk tippeket. A baloldali színtárcsa felett állíthatjuk be, hogy 1, 2, 3, 4 színt szeretnénk használni. Akkor ajánlható ez az oldal, ha nagyjából tudjuk, hogy milyen színeket szeretnénk használni, vagy már legalább egy-kettő konkrétan ismert.
• colorcombos.com  - A weboldal tartalma szintén 3-4-5 színből álló színösszeállítás. Alapvetően ötletszerzésre ajánlható, hiszen több száz már elkészített paletta közül választhatunk.  
• kuler.adobe.com/create/color-wheel  - Az Adobe megoldása egyszerű és nagyon látványos. Az oldal közepén található színválasztóval állíthatjuk be magunknak a kívánt színt. A tőle jobbra látható opciók adják meg, hogy mennyi színt szeretnénk használni, és ezek egymáshoz képest milyen viszonyban vannak. Szintén akkor ajánlható, ha már van valamilyen elképzelésünk a színekkel kapcsolatban.

3. Minden oldal különböző

A dizájn nem csak a színekről és a formákról szól, hanem az elrendezésről is. Gyakori hiba, hogy az áruházban található oldalak mindegyike más-más elrendezéssel bír; így minden alkalommal újra fel kell térképezzük, hogy mit hol találunk.

A webáruházak többségében az elrendezésben szerepel fejléc, jobboldali vagy baloldali hasáb (esetleg mindkettő), és lábléc. Ezek tartalmát a webáruház rendszerek többségében oldalanként testre lehet szabni; ezen funkció használatát azonban nem szabad túlzásba vinni.

Természetesen ez nem jelenti azt, hogy minden oldalnak tökéletesen ugyanolyan tartalommal kell rendelkeznie. Vannak olyan bevált megoldások, amelyek kifejezetten igénylik ezt. De nagy a különbség aközött, hogy a kosár és pénztár oldalaknál elhagyjuk az oldalsó hasábokat, és aközött, hogy minden termékoldal teljesen egyedi fejlécet, láblécet, és oldalsó hasábokat kap.

Az okok egyszerűek: a látogatók szívesen nézelődnek a termékeink között, de ezt számukra egyszerűvé és könnyűvé kell tenni; nem szabad, hogy ebben megakadályozzuk, vagy nehezítsük a dolgukat. Ha vásárolni szeretnének, essen kézre – és ezért mindig legyen ugyanott – a kosár gomb, és legyen mindig minden termékmegjelenésnél hasonló logika alapján elhelyezve az a gomb, amellyel azt a kosárba teheti.

4. Ami fontos, nem látszik ...

Egy oldal külsejének megtervezésénél, átgondolásánál sokan elfelejtik, hogy a színek, a megjelenés, de még a formák is eszközök. Segítségükkel nem csak a brandet építhetjük, hanem az oldalon való tájékozódást, magát a vásárlást is kényelmesebbé tehetjük.

A legrosszabb, amit az áruházunkkal tehetünk, hogy a legfontosabb elemeket eljellegtelenítjük, vagy úgy elrejtjük, hogy a reménybeli vásárlók mindenhova klikkelnek, de oda pont nem. Ennél is lehet rosszabb, ha az oldal tele van bannerekkel és hirdetésekkel, amelyek vonzzák a szemet. El a termékről, a kosárba gombról, és így a vásárlástól.

Ezzel gyakorlatilag magát a vásárlást akadályozzuk, amely egyik webáruház tulajdonosnak sem érdeke. Az egyik alapszabály, hogy egy elem – legyen az gomb, banner, link, kép, bármi – minél nagyobb, és minél jobban kitűnik a környezetből, annál inkább hajlamosak rákattintani a vásárlók.

Ezt a szabályt tartva a legfontosabb részeket emeljük ki! Legyen a legszembetűnőbb a kosárba rakás gombja. Nem szükséges kicsi, eldugott linkként tengődnie ezernyi felesleges elem között. Látszódjon a kosár!

A legismertebb ilyen elem általában a bannerváltó. Nagy, elüt a környezetétől, és általában kattintható. Ez utóbbit szokták néhol elfelejteni; pedig egy kép (bár többet ér ezer szónál a mondás szerint), nem tartalmaz minden részletet.

5. ... de ami nem fontos az igen

Az előző pont ellentéteként gyakran előfordulnak olyan elemek, amelyek szó szerint a látogató arcába másznak, de ezen túl semmire sem jók.

Nagy szövegek, amelyek akcióra hívják fel a figyelmet, de nem vezetnek sehova? Felugró ablakok, amelyeknek nem kattintható a tartalma? Ha nem vezetik tovább a vásárlót, nem kattinthatóak, nem sarkallnak további vásárlásra, akkor semmi értelmük. Csak azért, mert jól néz ki, még nem kell, hogy elnyomja az oldal célját, és a termékeket.

Ugyanezt a hibát többféleképpen is elkövethetjük. Teleaggathatjuk a különféle képi elemekkel az oldalt, vagy egyszerűen csak minden fontosnak (vélt) szöveget mindig mindenhol kiírunk.

Ilyenkor a vásárlók, főleg azok, akik nem rutinosak, nem tudnak majd semmilyen – az oldal és a saját tapasztalataik szerint fontosnak vélt – elemre sem kattintani, így összezavarodnak, ezzel vészesen lecsökkentve annak az esélyét, hogy egyáltalán elkezdik a vásárlást.

Az egyetlen megoldás, hogy eltűntetjük azokat az elemeket, amelyekre nincs szükség, a többit pedig józan gondolkodással a megfelelő méretre csökkentjük.

6. Túl sok banner, külső link

A figyelem megtartása, és a vásárló rávezetése a termék megvásárlására elég fontos, és kellően nehéz feladat. Nincs rosszabb, mint amikor ezt a figyelmet a vásárló elveszti azért, mert a termék alatt, felett, mellett, az oldalról elnavigáló linket talál, amelyek sokkal látványosabbak, mindenféle színben pompáznak.

Ennél már csak az a rosszabb, ha mindenféle más oldalakra, esetleg más webáruházra mutató linkeket helyezünk el mindenféle „kölcsönös” megegyezés alapján. Vagy egyszerűen az oldalunkra kiteszünk egy Google Adwords hirdetéseket megjelenítő dobozt, mert az is hozhat pénzt. A webáruházunk célja az, hogy minél többen legyenek, akik a termékeinket nézegetik, és közülük a lehető legtöbben vásároljanak is.

Ettől a céltól ne tántorítsuk el őket! Minden olyan link, banner, reklám, ami ezt akadályozza, eltávolításra érett. Külön kiemelném a máshova mutató linkeket; legyen Adwords, vagy linkcsere, ezzel csak magunknak ártunk. A reménybeli vevő máshova kattint, elhagyja az áruházunkat, ami után már esélytelen, hogy bármit is vásároljon.

7. Idegesítő elemek

Ahogy korábban már volt róla szó, a nagyon túldíszített webáruház inkább okoz fejfájást, mint sok vásárlást. Fokozottan igaz ez bármilyen animációra, fontosabb funkció nélküli mozgó elemre.

Fontos tudni, hogy a mozgás nagyon figyelemfelkeltő. Éppen ezért három esetben használjuk:

1. Videó. Manapság egyre több termékoldalon találkozni beágyazott videóval. Ez úgyis akkor indul el, amikor a látogató rákattint (ellenkező esetben nagyon idegesítő).
2. Banner váltáskor. A nagy akciókat, újdonságokat ma már bevett szokás bannerrel jelezni. Egy helyen így több tartalom is megjelenhet, és a mozgás pont kellően ráirányítja a figyelmet. (De az is általában a főoldalon, egy helyen található.)
3. Valamilyen, a látogató által végzett esemény hatására történik mozgás. Ilyen a kategória szétbontás, vagy egy kinyíló kereső, melyeket az egér rájuk pozícionálásával érhetünk el.

A többi esetben inkább maradjunk meg a mozdulatlan elemeknél. Ha nagyon akarunk, ebbe is csempészhetünk némi „animáltságot” melyet inkább CSS-el, egyszerű színváltással érhetünk el.

Összefoglalás

Mint látható a harsány, funkció nélküli elemek nem igazán érik el a céljukat. A webáruházak világa nagyon gyorsan változik, igazodik az online vásárlók igényeihez. A trendeket bátran követhetjük; nem csak az általános, de az egyéni ötletekre is van megoldás.

Viszont ne felejtsük el, hogy a megjelenés is eszköz, amely abban segít, hogy áruházunk emlékezetes maradjon a látogatók számára, illetve vásárlásra, sőt újbóli vásárlásra sarkallja őket.

Ha kérdésed merül fel, keress minket:

WebShop Experts
www.webshopexperts.hu
Tel: 06-1-234-5011
Fax: 06-52-445-880