Webfejlesztés Webshop

Magyar webáruházak használhatósági elemzésének tapasztalatai

OnlineStore_iMac_Icon_300dpi

Az ELTE Informatikai Karán – a Web-fejlesztés I. kurzusunk hallgatóinak bevonásával –  több száz magyar webáruházat vizsgáltunk használhatósági szempontok alapján  a 2011/2012-es időszakban. Az eredmények rámutattak olyan jelenségekre, amelyekre érdemes odafigyelnünk, ha magunk is webáruházak tervezésébe, fejlesztésébe kezdünk. De mielőtt erre rátérnénk, lássuk magát az értékelési folyamatot!

Első lépésként meg kellett határoznunk azon irányelveket, amelyek alapján egymással összehasonlíthattuk a különböző webáruházakat azok megvalósítása alapján. Ehhez Dr. Rung Andrásnak – a téma hazai elismert kutatójának –  egy 2011-ben publikált tanulmányát használtuk fel, amely összefoglalja azon alapelveket, amelyek alapvetően fontosak a webáruházak hatékony működéséhez.

A letölthető leírásban a Szerző kitér a nyitóoldal tervezésére-, a menüsor kialakítására-, a keresésre-, a termékoldalak tartalmára-, felépítésére-, a kosár megvalósítására-, a vásárlás lezárásnak folyamatára vonatkozó fontos tudnivalókra.

Az irányelvek meghatározása

A letölthető tanulmány tartalmát rövidebb állításokra, irányelvekre bontottuk, így a dokumentum alapján 7 kategóriában 77 irányelvet különítettünk el, amelyek a következők voltak:

Nyitóoldal

  • A nyitólapon egyértelműen kiderül, hogy mivel foglalkozik az oldal.
  • Az oldalon nincs üdvözlő szöveg.
  • A nyitóoldalon a termékek több kategóriában is elérhetők (pl. akciók, leggyakrabban keresett termékek,nemrég vásárolt termékek).
  • A nyitóoldalon nincs nagy méretű, csak dekorációs célokat szolgáló kép.
  • A nyitóoldalon nincsenek nagy méretű hirdetések.
  • A kezdőlapon már láthatóak a különböző termékek.

Menüsor / Kategóriák

  • A menüben 5-9 menüpont helyezkedik el, vagy a menüpontok termékkategóriákat jelölnek, úgy hogy azok egyértelműen és könnyen áttekinthetőek.
  • A menüpontok nem tartalmaznak rövidítéseket.
  • A menüpontok nem tartalmaznak angol szöveget (kivéve amelyek meghonosodtak, pl. pendrive).
  • A menüpontok szövege érthető a potenciális vásárlók számára.
  • Nincs olyan kategória, amelyben csak egy elem szerepel.
  • Nincsenek a tartalomra nem utaló, semmitmondó kategórianevek (pl. egyéb termékek).
  • A szállítási díjakkal kapcsolatos információk egyszerűen elérhetőek.

Keresés

  • Van keresés funkció.
  • Egyszerű és összetett keresésre is van lehetőség.
  • Az egyszerű keresés minden oldalról elérhető.
  • A keresődoboz a jobb felső sarokban van, vagy a felső menüsor alatt.
  • A keresőmezőben legalább 30 karakter elfér.
  • A keresés nincs külön megcímkézve és szerepel egy megfelelő gomb, amellyel elindítható a keresés.
  • A vásárlás szempontjából kritikus gombok kiemelésre kerültek.
  • A gombok szövege cselekvésre serkentő módon kerültek megfogalmazásra (pl. Kosárba teszem, Megrendelem).
  • Az egyszerű keresést lehet kategória szerint szűrni.
  • A keresés a termékek neveiben, és legfontosabb adatmezőiben történik, ezek hiányában a teljes leírásban.
  • A keresés elkezdésekor keresőkifejezéseket javasol a portál.
  • Ékezetmentes lekérdezésekre is jó találatot ad a rendszer.
  • A keresés figyelembe veszi az esetleges szinonimákat is (pl. fülhallgató, fejhallgató).
  • A leggyakoribb elgépeléseket figyelembe vette a keresőmechanizmus.
  • Ha nincs találat, akkor instrukciókat kapunk, hogy hogyan lehetne a keresést javítani.
  • A találati listában látszik a találatok száma.
  • Ha valaki elindított egy egyszerű keresést a megfelelő kulcsszavakkal, akkor annak eredményét az irányított kereséssel tovább tudja szűkíteni, finomítani.
  • Viszonylag sok találatot kapunk egyszerre. Ha termékeink vizuálisan könnyedén beazonosíthatóak, akkor akár 50-100 termék is szerepelhet egy oldalon, ha a leírások is fontosak, akkor a 20 körüli szám az ideális.
  • Rendelkezésre állnak olyan szűrőfeltételek, amelyekkel pontosíthatók a találatok.
  • A szűrők csukhatók és nyithatók.
  • A szűrőkből legfeljebb 10 darab van.
  • A szűrőkkel végrehajtott változások azonnal megjelennek.
  • A szűrők fontosság szerint rendezve vannak.
  • Túl sok opció esetén a kevésbé fontos opciókhoz egy további opció link is meg van adva.
  • A szűrőkben a beviteli mezők könnyen kezelhetők, szöveg/ikon utal arra, hogy mit várnak el.

Termékoldal

  • A termékek jó minőségű, nagy fotókkal illusztráltak.
  • Ha egy termékhez több kép tartozik, azok között lehet lapozni.
  • A vásárló minden olyan információt megkap, ami a vásárláshoz szükséges lehet.
  • Elérhetőek termékbemutató videók is.
  • A termék ára erős színnel, a nevéhez közel kiemelve jelenik meg.
  • Az ár közelében van elhelyezve a “Kosárba” gomb.
  • A kosárba gomb jól látható, nagy méretű, színes.
  • Nincsenek hirdetések a termékoldalon, legfeljebb az oldal alján vannak kapcsolódó, hasonló termékek.
  • A termékről könnyen áttekinthető formában lehet az információkat megtekinteni.
  • A termékinformációk egyes sorai eltérő színnel vannak jelölve, hogy vezessék a szemet.
  • Ha vannak nehezen érthető fogalmak, akkor azok megmagyarázásra kerülnek.
  • Ezen magyarázat megtekintéséhez nem kell elhagyni az oldalt, az buborék segítség formájában. elérhető
  • A döntéshez szükséges össze információ megtalálható a weblapon, nem külön fájlban (pl. PDF) tölthető le.
  • Elérhetőek olyan gombok, amelyekkel a népszerű közösségi oldalakon megoszthatók az oldalak.
  • A termékeknél elérhető egyfajta értékelési rendszer.
  • Az értékelési lehetőségek és az eredmények jól látható helyen szerepelnek.
  • Van lehetőség arra, hogy a termékről beszámolót, kritikát (review) lehessen írni.
  • A felhasználók reagálhatnak/válaszolhatnak egy értékelésre.

Termék összehasonlítás

  • Van mód a termékek összehasonlítására.
  •  A felhasználó minden egyes terméket a találati oldalakon vagy a termékoldalon megjelölhet összehasonlításra.
  • A kiválasztott termékek az oldal alján egy szalagon gyűlnek kategóriánként.
  • Az eltérő kategóriákba tartozó termékek eltérő csoportosításban (pl. füleken) jelennek meg, hisz a különböző kategóriákba tartozó termékek összehasonlítása nem lenne hasznos funkció.
  • Van lehetőség a termék törlésére az összehasonlító listából.
  • Maximum 5-6 terméket lehet kigyűjteni.
  • Ha legalább két termék ki van választva, akkor azok összehasonlíthatóak bármikor egy önálló oldalon.

Kosár

  • A kosár megszokott helyén, a jobb felső sarokban van.
  • A kosarat Kosárnak hívják, nincs más, kreatív elnevezése.
  • Mindig látszik hogy a kosárban hány termék van, és  milyen értékben.
  • Ha kevés termék van a kosárban (max. 2-3), akkor azok neve mindig látható.
  • A kosár tartalmát alakítani lehet (hozzáadhatunk terméket, elvehetünk).
  • A kosárban végzett változtatások azonnal megjelennek, vagy van egy figyelemfelhívó gomb a frissítésre.

Vásárlás lezárása

  • A vásárlást  egy jól látható, nagy gombbal lehet megkezdeni.
  • Ha a vásárlás több lépcsőben történik, akkor az oldal tetején egyértelműen jelölve van, hogy épp milyen fázisnál tart a felhasználó, és hogy milyen lépések jönnek ez után.
  •  A vásárláshoz nem kell regisztráció, a megrendelés leadása után kell visszaigazolni az e-mailt.
  • Csak olyan adatok vannak bekérve, amelyek a sikeres eladáshoz mindenképpen szükségesek (ne csináljunk piacfelmérést a vásárlással összekötve, rosszul sülhet el).
  • Bankkártyás fizetés a bank oldalán történik (vagy ha az oldal elismert, akkor integrálásra is kerülhet).
  • Feltüntetésre kerül a szállítási díj is.
  • A megrendelés után a vásárló e-mailben megkapja a vásárlás adatait.
  • Amennyiben a vásárló a kiszállítást választotta, de az nem igényel időpont egyeztetést, akkor is értesítik őt e-mailben a csomag feladásáról.

Az irányelveket egy egyszerűen kitölthető Excel táblázatba foglaltuk, amelynek kitöltése során a hallgatók jelezhették, hogy teljesül-e az adott irányelv, illetve szöveges véleményt is megfogalmazhattak.

Eredmények

Az elemzést véletlenszerűen kiválasztott magyar webáruházakkal három egymás utáni szemeszterben is elvégeztük. Mivel a trendeket tekintve az egyes kategóriákban szinte ugyanolyan eredményeket kaptunk mindhárom félévben, elég ha most a legutolsó vizsgálat eredményét tekintjük át.

Ezt a felmérést 2012. áprilisában készítettük, 182 magyar webáruház kiválasztásával. Az alábbiakban röviden (grafikonok segítségével) bemutatjuk az egyes kategóriákra jellemző összesített eredményeket.

TELJES CIKK ITT

A GAP Internetes sikerei

WEB Ergonómia azaz a Használhatóság Sikerstoryja

1990 -es években a GAP menő cég volt az USA-ban.

Minden celeb és szupermodell GAP üzleteiben vásárolt.

2001 végén több mint egy évtized után először arról számolt be , hogy előző negyedévet vesztességgel zárta.

A GAP márkaboltok forgalma több mint 12% csökkent, és a cég továbbra is lagymatag forgalmakat produkált

2003-ban az e-kereskedelemnek köszönhetően kicsit kezdett magához térni, és ebben az évben a GAP Inc felkérte Toby Lenk internetes vállalkozót az online részleg vezetésére. Toby Lenk  a használhatóság támogatója volt.

Lenk tanulmányozta a bolton belüli vásárlói élményt, megfigyelte, hogy a nők milyen gyorsan és zökkenőmentesen vásárolnak az üzletben és úgy döntött hogy ezt az interneten is alkalmazni fogja.

A felhasználók navigálását megkönnyítette azzal hogy minél kevesebbet kellessen kattintaniuk az oldalon.

Lenk annak érdekében, hogy az offline üzletekben megtapasztalt élményhez közelítse a internetes vásárlásét úgy áttervezte az oldalt hogy  hogy a vásárlók a kurzort a termék fölé tolva , kattintás nélkül nagyméretű képeken is megtekinthessék a termékeket, ami már nagyban hasonlít ahhoz, mint amikor valaki gyorsan végigböngészi  az üzletben.

gap Szinte Loránd online marketing tanácsadó

Három évvel később Lenk egy újabb nagy lépésre szánta rá magát 2008-ban egyetlen egy webáruházban vonta össze márkáit, köztük a zászlóshajónak számító GAP, Banana Republic, Old Navymárkáit és a Piper Lime internetes cipőboltját.

2009-ben létrehozta Athleta nevű márkáját.

A cég történetében először a vevők a Gap Inc összes márkáját egy üzletben , egy bevásárlókosárral és egy kiszállítási díjért megvásárolhatták.

A Cég netes forgalma 8% al növekedett és egy tranzakcióra jutó eladott termékek száma 10%-al nőtt.

E közben USA ruhaipara csak 6% -al növekedett míg a GAP 14% forgalomnövekedést ért el.

Csak a netes forgalom több mint 1 millárd dollárra rúgott.

Lenk a használhatóságot helyezte az első helyre. A használhatóság diadalmaskodott

Egyszerűen hangzik:készíts valamit , amit az emberek szívesen használnak, és még többet fogják használni.

gap london - szinte loránd online marketing tanbácsadóforrás:AARON SHAPIRO

 

Könyv ajánló! Szerinted Jó a weboldalad? NEM

Jakob Nielsen a web világának nem egyszerűen egy meghatározó alakja, hanem ahogy a New York Times találóan fogalmazott ő a weblap-használhatósági guru.

Ezen a területen ma valószínűleg neki van a legnagyobb tapasztalata a világon.

A használhatósági vizsgálódásának vezéreszméje mindenekelőtt az egyszerűségre való törekvés. A web nem termékkatalógus, nem újság, nem könyv és nem televízió, még csak nem is ezek analógiájára működik. Hanem kattintás alapú interaktív tevékenység, használói élményalkotás, információvadászat és mozgás együttese.

Ez a könyv az elmúlt két évtized jó és rossz webalkalmazási tanulságait összegzi a kiadónál korábban megjelent Web-design című kötete alapján, megújítva a szerző további használhatósági jelentéseinek segítségével.

A webergonómia nem a fejlesztők belső ügye, hanem mindnyájunké, hiszen – frivolan fogalmazva – ma már az olvasó is felhasználó. A kötetet a hazai ergonómia bemutatásával Izsó Lajos nyitja meg, és az editition 2.0 hagyományainak megfelelően két fiatal webergomán, Bőviz László és Rung András kommentjei kísérik.

WEB Ergonómia

Kiadó: TYPOTEX ELEKTRONIKUS KIADÓ KFT.
Sorozat: EDITION 2.0
Szállítás: 1-3 munkanap
Oldalak száma: 242
Borító: PUHATÁBLÁS, RAGASZTÓKÖTÖTT
Súly: 410 gr
ISBN: 9789632795782
Nyelv: MAGYAR
Kiadás éve: 2011
Árukód: 2222696 / 1078620
http://www.libri.hu/konyv/webergonomia.html