Webáruház kinézet: mitől ad el az online kirakatod?

Röviden: Egy webáruház kinézete akkor ad el, ha a látogató pár másodperc alatt megérti, mit árulsz és kinek, megtalálja a terméket, és nem érez okot a gyanakvásra. Ezt nagyrészt a szerkezet dönti el: mi van az első képernyőn, hol a kereső, mennyire kényelmes a pénztár telefonon. A színt bármikor átállíthatod, a szerkezetet nehezebben.

Mit lát a látogató az első képernyőn?

Egy utcai boltnál a kirakat dönti el, hogy a járókelő benyit-e. A webshopban ugyanezt a főoldal első képernyője csinálja, vagyis az, amit a látogató görgetés nélkül lát. Innen kell kiderülnie, mit árulsz, kinek szól a bolt, és merre induljon tovább.

Ide kevés dolog fér. Egy nagy kép vagy egy rövid mondat a fő termékkörről, alatta a kategóriák, aztán néhány kiemelt termék. Ha a látogatót előbb egy hírlevél-ablak, egy sütisáv és három forgó banner fogadja, a termékig már nem jut el, mert közben bezárta a lapot.

Amin a vásárlás múlik

Az alábbi elemek egyikéről sem mondható, hogy mindig ez a legfontosabb. Egy ruhaboltban a fotó visz mindent, egy alkatrész-webshopban a kereső. A saját boltodban azzal kezdd, amelyik ma a leggyengébb.

Termékfotó

Online a vevő nem tudja megfogni a terméket. A fotó helyettesíti a polcot és a próbafülkét. Legyen egységes a háttér és a képarány, legyen több nézet és egy közeli részletkép, és ahol számít, használat közbeni kép is. Egy egyszerű kinézet jó fotókkal profinak hat, a legszebb kinézet viszont sem menti meg a sötét, különböző méretű, telefonnal kapkodva készült képeket.

Telefon

A Google a mobil változatot nézi, a te látogatóid közül pedig sokan telefonról jönnek. Hogy pontosan hányan, azt a saját statisztikádban nézd meg, eszköztípus szerint. A gombok legyenek akkorák, hogy hüvelykujjal is eltaláld őket. A menü egy érintéssel nyíljon, a kosár mindig kéznél legyen, a pénztár pedig ne kérjen felesleges mezőket. Minden kinézetet telefonon is próbálj ki, ne csak a gépeden.

Sebesség

A Google a Core Web Vitals mérőszámokkal méri a felhasználói élményt. Jónak számít, ha a legnagyobb elem 2,5 másodpercen belül megjelenik (LCP), a lap 200 ezredmásodpercen belül reagál egy érintésre (INP), és betöltés közben nem ugrálnak az elemek (CLS 0,1 alatt). A leggyakoribb lassító egyszerű: a túl nagy, tömörítetlen kép.

Ezen te magad is sokat javíthatsz. A fotót ne a fényképező teljes felbontásában töltsd fel: egy termékoldalra néhány száz kilobájtos kép bőven elég. A nyitóképet válaszd úgy, hogy kis méretben is olvasható legyen, és ne tegyél egymás alá öt forgó bannert, mert mindegyiket le kell tölteni, mielőtt a látogató a termékig görgetne.

Bizalmi elemek

Egy ismeretlen boltban a vevő azt keresi, kivel van dolga. Jól látható helyen legyen a cégnév és az elérhetőség, a szállítási díj és határidő, a fizetési módok, az elállás és a visszaküldés feltételei. Kellenek a vásárlói vélemények is, a láblécbe pedig az ÁSZF és az adatkezelési tájékoztató.

Kis boltnál a legerősebb bizalmi elem sokszor egy ember. Egy rövid bemutatkozás fotóval, hogy ki áll a bolt mögött és miért ezt árulja, többet mond egy idegennek, mint egy általános jelvény. Ha van fizikai üzleted vagy átvételi pontod, a címét is írd ki.

Kategóriák és menü

A kategóriák a vevő nyelvén szóljanak, ne a raktárén. A menüpont „Női cipő” legyen, ne „Lábbeli / Női / Egyéb”. Kevés, jól elnevezett főkategória többet ér egy húszsoros legördülő listánál. Ha a termékek több szempontból kereshetők (méret, szín, ár, márka), a szűrők a kategórialap tetejére kerüljenek, telefonon is.

Kereső

A kereső legyen jól látható helyen, bírja az elírást és az ékezet nélküli gépelést, és már gépelés közben mutasson találatot. Cikkszámos áruknál a kereső többet számít a főoldal képénél.

Kosárba gomb

A „Kosárba” gomb legyen a termékoldal legfeltűnőbb eleme, telefonon görgetés közben is elérhető. Közvetlenül mellette ott van az ár, a készlet és a várható szállítás. A vevőnek ne kelljen keresnie, hogyan fizessen.

Miben különbözik a jó kinézet szakmánként?

Egy ruhabolt és egy alkatrész-webshop egészen mást kér a felülettől. A ruhánál a kép dönt, az alkatrésznél a cikkszám. A bútornál a vevő napokig nézelődik, az állateledelnél ugyanazt a tápot rendeli újra havonta. Az alábbi tizenkét szakmához készítettünk kinézetet.

Mind a tizenkét szakmát bővebben is leírtuk a „Milyen webshop illik a te iparágadhoz?” cikkünkben. Ha vegyes a kínálatod, azt a kinézetet válaszd, amelyik a legtöbbet eladott termékcsoportodhoz illik.

Kész téma vagy egyedi dizájn?

Az egyedi dizájn akkor éri meg, ha az arculatod már erős, van rá kereted, és pontosan tudod, mit csinálnál másképp, mint a többiek. Induló és kis webshopnál mi a jól megválasztott kész témát javasoljuk. Azonnal használható, telefonon is végig van gondolva, és egy rendszerfrissítés után nem kell újraterveztetni.

Kész témánál egy dolgot nézz meg alaposan: mennyire mozdítható. Ha csak a színeket állíthatod, a boltod olyan lesz, mint ezer másik. Ha a főoldal modulokból épül, és a sorrendjük is változtatható, a kész téma is a tiéd lesz.

Kinézetek a dajkashopban

A dajkashopban 60 kinézet közül választhatsz, szakmák szerint. Mindegyik saját főoldal-szerkezettel érkezik: a betű, a fejrész alakja, a kategóriacsempe és a menü helye is kinézetenként más. A főoldalt az adminban modulokból rakod össze, a termék- és a kategóriaoldalnak is van építője. Ékezet-független kereső és szűrők, kívánságlista, összehasonlítás, értékelés, termékvideó és nyelvváltós, többnyelvű bolt alapból jár.

Öt kinézetet prémiumnak hívunk: Tárlat, Üvegház, Volta, Futam, Kelme. Ezeket egy-egy konkrét szakmára komponáltuk, saját termékkártyával, egymásba csúszó sávokkal és gazdagabb nyitó főoldallal. Cserébe jó fotót és kevés, válogatott terméket kérnek. A részleteket a prémium kinézetekről szóló cikkünk írja le.

Egy kinézetet élesben, saját termékekkel is kipróbálhatsz: harminc termékig havidíj nélkül indulhatsz (a részleteket az árak oldalon találod).

Ellenőrzőlista telefonon

Nyisd meg a boltodat telefonon, egy idegen szemével, és menj végig a kérdéseken. Ahol nemet mondasz, ott kezdd a javítást.

1. Az első képernyőn kiderül, mit árulsz és kinek?
2. Van egyértelmű következő lépés (kategória vagy kiemelt termék) görgetés nélkül?
3. A termékfotók egységes háttérrel és képaránnyal készültek, és van közeli részletkép?
4. Egy kézzel kényelmesen eléred a menüt, a keresőt és a kosarat?
5. Egy átlagos termékoldal gyorsan betölt, és nem ugrálnak rajta az elemek?
6. A szállítási díj, a fizetési módok és a visszaküldés feltételei a termékoldalon is látszanak?
7. Vannak valódi vásárlói vélemények, és látszik, ki üzemelteti a boltot?
8. A kategóriák a vevő nyelvén szólnak, és legfeljebb két kattintásra minden elérhető?
9. A kereső megtalálja a terméket elírással és ékezet nélkül is?
10. A „Kosárba” gomb a termékoldal legfeltűnőbb eleme, ár és készlet mellett?

Szín vagy szerkezet?

A színt egy perc alatt átállítod. Azt viszont, hogyan nyit a főoldal, hogyan jelennek meg a termékek és hol ül a kereső, már nem egy csúszkával változtatod meg. Kinézetválasztáskor ezért a saját fotóidat töltsd be, a saját kategóriáiddal, és telefonon nézd meg, hogyan mutat. Egy üres bemutató bolt mindig szebb, mint egy valódi, ahol a fotók különböző méretűek és a termékneveknek hosszuk van.

Kapcsolódó útmutatók

• Prémium kinézetek: mitől több öt kinézetünk a többinél, és kinek valók
• Webáruház motor: típusok, költségek és a választás szempontjai
• Webáruház indítása lépésről lépésre: az első naptól az első rendelésig
• Honnan jönnek a vevők? Forgalomszerzés kisbolt számára, reklámköltés nélkül is
• Mennyibe kerül egy webáruház? Költséglista és egy végigszámolt első év