Milyen legyen egy jó “áraink” oldal?

“Áraink” vagy “árak” oldalt a szolgáltatásokat kínáló cégek szoktak elhelyezni a weboldalukon. Néha azonban ezek az oldalak túl bonyolulttá válnak, ami abból következik, hogy nem tudják, milyen elvek alapján jelenítsék meg és rendezzék el az információkat.

Amikor egy “árak” oldalra van szükséged, akkor az jellemzően tartalmaz néhány “csomagot”, melyekbe eltérő szolgáltatások kerülnek, eltérő árakkal, elvileg különböző célközönségnek (például magánszemélyek, cégek) címezve. Ezek az információk egy táblázatba kerülnek, azonban úgy kellene elrendezni őket, hogy a felhasználók is könnyen megértsék, ne csak Te.

Ez persze elsőre nem látszik túl bonyolult feladatnak, ugyanakkor időnként felbukkannak olyan apróságok, melyek miatt az egész értelmét veszti, és kiderül, hogy az árazási oldal inkább csak összezavarja a felhasználót, aki így kénytelen az ügyfélszolgálattal felvenni a kapcsolatot.

Design szempontjából sem feltétlenül egyszerű egy ilyen oldal, hiszen különféle megjegyzéseket, füleket kell elhelyezni, lenyílókban megjeleníteni az információt, hogy lehetőleg teljes legyen a kép, mert egyébként nem sok értelme van. Ráadásul mindezt mobilkijelzőn is használható módon kellene prezentálni.

A lényeg tehát, hogy olykor megterhelően sok lehet az információ, amit itt el kell rendezni, mégpedig olyan módon, hogy az inkább segítse a látogatót a döntés meghozatalában, ne pedig akadályozza.

Hogyan hasonlítják össze az emberek az árakat?

Itt érdemes abból kiindulni, hogy miként hasonlítanak össze az emberek tulajdonságokat egy árak oldalon. Azt feltételezhetjük, hogy amikor egy látogató megérkezik az oldalra, akkor olyan árú szolgáltatáscsomagot keres, ami a legjobban passzol az igényeihez. Lehet persze, hogy csak tájékozódik vagy épp összehasonlítja az árakat a konkurenciáéval.

Bármi is a motiváció, feldolgozható módon kell tálalni az információkat. Egy-egy szolgáltatás esetében azonban rengeteg tulajdonság, funkció felsorolható, ha ezt a teljesség igényével meg is tesszük, akkor az rendkívüli módon megterheli a látogatót. Tehát, hogyan tegyük mindezt? A Smashing Magazin felsorolt néhány olyan felhasználói szokást és jó megoldást, melyeket érdemes figyelembe venni az árak oldal kialakításánál.

Fűnyíró minta

Amit elsőként érdemes figyelembe venni az árak oldalunk kialakításánál, hogy a használhatósági vizsgálatok szerint a felhasználók leggyakrabban fűnyíró mintában dolgozzák fel az összehasonlító táblázatokat. Erről már mi is írtunk korábban a Nielsen Norman Group kutatása alapján. Ez azt jelenti, hogy elindulnak a bal felső sarokban, eljutnak a sor végére, majd egy sorral lejjebb mozdul a tekintetük, mely elindul visszafelé a sorban.

Fűnyíró minta

Ugyanakkor ez nem minden esetben igaz, hiszen sokszor csak találomra egy-egy tulajdonságra fókuszálnak, amit aztán részletesebben is megvizsgálnak. Ez azt jelenti, hogy össze-vissza jár a tekintetük a szépen kidolgozott táblázatban.

Egy tipikus probléma az szokott lenni, hogy ha bonyolult egy táblázat, akkor elveszítik az emberek a tájékozódási pontokat. Tehát eljutnak a közepéig, aztán visszatérnek az oszlop címsorához, hogy meggyőződjenek arról, még mindig a megfelelő helyen járnak. Gond akkor van, ha az oszlop címsorát nem látják. Ilyenkor elkezdenek felfelé és lefelé görgetni tájékozódási pont után kutatva. Ez különösen nyomasztó tud lenni mobileszközökön.

A növekedés iránya balról jobbra tart

Amikor árakról szóló táblázatról van szó, akkor az egyszerűbb, ingyenes ajánlat mindig a bal oldalon kap helyett, míg a profiknak szóló, drága megoldások a jobb oldalra kerülnek. A kettő között pedig kirajzolódik a változás folyamata, tehát az egyre több szolgáltatást kínáló és egyre drágább csomagok sorakoznak egymás után. A helyzetet bonyolítja, amikor meg kell jeleníteni a normál vagy legnépszerűbb csomagokat is, melyek valahol a táblázat közepén kapnak helyet.

A szolgáltatások teljes listájának megjelenítése

Általában azt feltételezzük, hogy az ügyfelek tudják, mely funkciók relevánsak számukra, de amikor elég összetett egy termék, akkor ez nem feltétlenül igaz. Néhány tulajdonság ismerősnek vagy fontosnak tűnik, de a leírásuk alapján ezt nem lehet eldönteni, más funkciók pedig ugyan nem fontosak jelenleg, de később azok lehetnek.

Ha sok a tulajdonsága egy szolgáltatásnak, akkor nehéz kiválasztani, hogy melyik releváns közülük, ha nem nézzük át a teljes listát. Ezért van szükség egy részletes összehasonlító nézetre, melyben minden funkció és tulajdonság megjelenik. Erre a felhasználók mintegy végső referenciaként tekintenek, hogy minden apró részletet tisztázni tudjanak.

Ugyanakkor egy ilyen részletes lista túl sok információ tartalmazhat, és rendkívül fárasztó lehet a feldolgozása. Ezért bár elérhetőnek kell lennie az oldalon, nem feltétlenül kell a teljes funkciólistát felülre helyezni.

Két összehasonlítás

A felhasználói tesztek azt mutatják, hogy sokan kétszer is nekifutnak az egyes ajánlatok összehasonlításának. Az első alkalommal csak megpróbáljuk általánosságban felmérni a lehetőségeket, majd elindulunk azon csomag felé, ami a legjobbnak tűnik. A második menetben pedig ezt a csomagot részletesebb vizsgálatnak vetik alá.

Nem minden funkció azonos súlyú

Végül az összehasonlítás kapcsán azt is fontos figyelembe venni, hogy nem minden felhasználót érdekel minden funkció. A tesztek azt mutatják, hogy sokan ugranak sorokat vagy teljes szakaszokat, mert kihagyják azt, ami nem releváns számukra. Nyilván itt is lehetnek fontos funkciók, melyeket meg kell jeleníteni, azonban van néhány másodlagos, kevésbé fontos.

Ezért hasznos lehet, ha a tulajdonságokat és funkciókat csoportokba tudjuk rendezni, és csak kérésre (lenyílóban) jelennek meg részletek. Így az összehasonlító táblázat egyszerűbbé válik.

Alapelvek az árak oldal kialakításához

Az előbbiek alapján fel lehet sorolni néhány alapelvet, ami segíthet a kivitelezésben:

  • Ha egyszerű az árképzésünk, akkor a legjobb a megszokott megoldás, egy olyan táblázat, amivel az adott iparágban többnyire találkoznak az emberek a weben. Akkor érdemes egyedi designban gondolkodni, ha bonyolultabb a szolgáltatásunk.
  • Az árak összehasonlítására a legjobb forma a táblázat, amelyet oszlopok és sorok alkotnak. Ezekbe elhelyezzük a fő funkciók és tulajdonságok leírását, valamint egy CTA-t. Ha megkülönböztetünk havi és éves árakat, akkor ezek kapcsolóját a táblázat felett helyezzük el, ahogy a pénznem-választót is.
  • A fő tulajdonságokra figyelj! Habár lehet, hogy szeretnéd a szolgáltatásaidnak valamennyi tulajdonságát felsorolni, azonban pont emiatt szoktak befogadhatatlanul bonyolulttá válni az árazási táblázatok. Tehát a fő táblázatban csak a legfontosabbakat jelenítsd meg, a részleteket pedig csak akkor, ha a felhasználók kifejezik az igényüket egy kattintással.
  • Érdemes lehet egyébként minden egyes csomag esetében a legnagyobb csomag teljes funkciólistáját feltüntetni, de a nem aktív elemeket elhalványítani. Így pontosan látható, hogy mi marad ki valamely csomagból.
  • Hasznos lehet ragadós fejléceket, címsorokat használni, mivel a felhasználók gyakran visszatérnek ide, hogy megerősítsék, még mindig a megfelelő csomagot vizsgálják. Ha folyamatosan látják a címsorokat, akkor nem kell visszagörgetniük, és esetleg elveszíteni a fonalat.
  • Az is jó megoldás, ha az egyes tulajdonság-csoportokat összecsukható szakaszokban prezentáljuk, így a felhasználók csak azt nyitják ki, melynél további részletekre kíváncsiak. Ezáltal nem bonyolítjuk feleslegesen a táblázatot, egyes szakaszok átugorhatók.
  • Mobilon a nagyobb árösszehasonlító táblázatok megjelenítése korlátokba ütközik. Az soha nem jó megoldás, ha egy táblázat miatt vízszintesen kell görgetnie a felhasználónak. A leginkább használható megoldás, ha fülekként jelennek meg az egyes csomagok nevei, és mindig csak az aktív fül (azaz csomag) tartalma látszik.
  • Ha egy-egy tulajdonságnál további magyarázatra van szükség, akkor az tooltip-dobozként jeleníthető meg mondjuk egy körben elhelyezett (i) ikonra kattintva.
  • Személyre szabható funkciók: szintén nagyon hasznos megoldás, ha nem csak adott csomagokból választhatnak a felhasználók, hanem az igényeiket megadva mintegy személyre szabhatják a csomagokat. Ez azért hasznos, mert gyorsabban megtalálhatják a számukra releváns megoldást. Itt persze feltétel, hogy rugalmas legyen az árazás.

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.

Hozzászólás jelenleg nem lehetséges.

Széchenyi 2020