Totul incepe de la modalitatea in care se livreaza continutul, cum este afisat si in ce masura modul de afisare incurajeaza explorarea. Si indiferent ca pagina de rezultate foloseste un layout de tip list sau grid(sau amandoua), rezultatele sa masoara in numar de conversii venite din search si numar de abandonuri din aceasta zona.

Mai jos, un mic studiu de caz asupra paginii de rezultate provenite dintr-o cautare.
Am folosit 2 cuvinte – mobile phone sau telefon mobil, tocmai pentru a simula o cautare obisnuita, cu siguranta regasita destul de des in istoria acestor magazine.

target.com

• utilizeaza un layout tip grid, cu un singur produs pe rand, asigurand astfel o buna vizibilitate produselor afisate
• fiecare rezultat are afisat pretul, numarul de comentarii, rating-ul, reducerea(daca exista) si promotia(daca exista)
• butonul adauga in cos este prezent
• coloana stanga este folosita exclusiv pentru filtrarea rezultatelor, cu semnalizare numerica a numarului de produse din fiecare categorie ce detine astfel de intrari
• sunt sugerati termeni asemantori pentru o noua cautare
• nu exista un sistem de paginare; toate rezultatele sunt afisate intr-o singura pagina

amazon.com

• utilizeaza un layout tip grid, cu un singur produs pe rand, asigurand astfel o buna vizibilitate produselor afisate
• fiecare rezultat are afisat pretul, numarul de comentarii, rating-ul, reducerea(daca exista), promotia(daca exista) si prezenta in stoc
• butonul adauga in cos nu este prezent
• nu este afisat numarul total al rezultatelor gasite
• coloana stanga este folosita exclusiv pentru filtrarea rezultatelor, cu semnalizare numerica a numarului de produse din fiecare categorie ce detine astfel de intrari
• sunt sugerati termeni asemantori pentru o noua cautare
• exista un sistem de paginare a rezultatelor, prezent doar in zona de footer; cu certitudine pentru a miscora exit-ul din aceasta zona, mizandu-se puternic pe relevanta rezultatelor oferite
• nu exista un sistem de sortare/rearanjare a rezultatelor

emag.ro

• utilizeaza un layout tip grid, cu un singur produs pe rand, asigurand astfel o buna vizibilitate produselor afisate
• fiecare rezultat are afisat pretul, rating-ul, reducerea(daca exista), promotia(daca exista) si disponibilitatea
• butonul adauga in cos este prezent
• relevanta rezultatelor cautarii este semnalizata grafic la nivelul fiecarui produs
• numarul rezultatelor gasite este afisat
• coloana stanga este folosita pentru afisarea categoriilor, fara nici o legetura cu cautarea in sine
• categoriile ce contin produse corespondente cautarii sunt afisate in zona de maxima vizibilitate, deasupra grid-ului
• nu sunt sugerati termeni asemantori pentru o noua cautare
• exista un sistem de paginare a rezultatelor, prezent atat in zona de header cat si footer
• sub fiecare rezultat este afisata o mica lista de date tehnice, tocmai pentru a spori relevanta rezultatului si a scurta distanta pana in cosul de cumparaturi
• nu exista un sistem de sortare/rearanjare a rezultatelor

pcfun.ro

• utilizeaza un layout tip grid, cu un singur produs pe rand, asigurand astfel o buna vizibilitate produselor afisate
• fiecare rezultat are afisat pretul si prezenta in stoc
• butonul adauga in cos este prezent
• coloana stanga este folosita exclusiv pentru afisarea categoriilor, fara nici o legatura cu cautarea in sine
• categoriile ce contin produse corespondente cautarii sunt afisate in zona de maxima vizibilitate, deasupra grid-ului (in acest caz nu este afisat acest amanunt dar la alte cautari similare respectivul filtru si-a facut aparitia)
• nu este afisat numarul rezultatelor gasite
• nu sunt sugerati termeni asemantori pentru o noua cautare
• nu exista un sistem de paginare a rezultatelor, toate rezultatele fiind livrate intr-o singura pagina
• sub fiecare rezultat este afisata o mica lista de date tehnice, tocmai pentru a spori relevanta rezultatului si a scurta distanta pana in cosul de cumparaturi
• nu exista un sistem de sortare/rearanjare a rezultatelor

nota: exista posibilitatea ca printre produsele afisate in urma cautarii sa nu existe niciunul redus sau aflat la promotie si in concluzie argumentele in cauza sa nu fie afisate.

wallmart.com

• utilizeaza un layout tip grid, cu un singur produs pe rand, asigurand astfel o buna vizibilitate produselor afisate
• ofera posibilitatea vizualizarii rezultatelor atat sub forma de list cat si sub forma de grid
• afisarea default contine 48 de produse/pagina dar exista optiunea de a dubla numarul, la 96
• fiecare rezultat are afisat pretul, reducerea(daca exista), promotia(daca exista) si prezenta in stoc – sub diverse forme de disponibilitate
• butonul adauga in cos nu este prezent
• este afisat numarul total al rezultatelor gasite
• coloana stanga este folosita exclusiv pentru filtrarea complexa a rezultatelor, cu semnalizare numerica a numarului de produse din fiecare categorie ce detine astfel de intrari, sortare pe brand, niveluri de pret, rating, si argumente legate de aspect
• nu sunt sugerati termeni asemantori pentru o noua cautare
• exista un sistem de paginare a rezultatelor, prezent atat in zona de header cat ci in cea de footer
• atat in footer cat si in header exista un sistem de rearanjare/sortare a rezultatelor in functie de pret, rating, top vanzari, noutate, alfabet

Toate exemplele utilizate mai sus au notorietate. Ca fac sa nu uz de anumite metode de sortare sau filtrare, ca afiseaza sau nu detalii din istoria sau descrierea unui produs, tine de decizia fiecaruia. Totusi, judecand in ansamblu, va puteti face o imagine corecta vizavi de ce anume ar trebui sa contina pagina de rezultate.
Si fie ca optati optati pentru un model sau altul, tineti minte ca pagina in sine o construiti pentru useri si implicit pentru nivelul lor.
Iar simplu, complicat, firesc, elaborat, detaliat devin cuvinte cheie.

tweet me

Modalitatea de comunicare, logica sa, relevanta si chemarea la actiune sunt elemente care bine potentate pot scoate din amortire si cel mai “plictisit” user.
In comert electronic, in termeni de usability, definitia de interactiune ar trebui sa tina cont si de elementele de mai jos…

Usability – Interactiune

• Dialogul are o progresie logica?
• Sunt recomandarile clare si vizibile?
• Sunt afirmatiile relevante si concise?
• Userul este chemat la implicare directa in istoria unui produs/serviciu?
• Elementele de interactiune directa(form type, ranking) sunt dispuse/grupate logic si corect; sunt vizibile?
• Exista butoane de confirmare a interactiunii(submit type); sunt vizibile?
• Butoanele de comanda cheama la actiune?
• Exista elemente de interactiune directa (tel, ym); sunt vizibile?
• Elementele grafice tip ‘promo’ cheama la actiune?

Pe subiectul usability in ecommerce iti recomand sa citesti si:
usability in ecommerce – arhitectura si navigare
usability in ecommerce – layout si design
usability in ecommerce – continut

tweet me

La nivel mediu, un formular ce urmareste sa masoare uzabilitatea unui ecommerce in tot ceea ce inseamna continut, ar trebui sa contina si elementele de mai jos.

Usability – Continut

• Este textul clar si concis?
• Este continutul tip text afisat organizat si structurat?
• Se utilizeaza formatarea pe paragrafe a continutului tip text?
• Titlu este indeajuns de vizibil?
• Titlul este delimitat de descriere?
• Descrierea este delimitata de comentarii?
• Descrierile produselor sunt explicative?
• In descrierea produsului exista o zona distincta de detalii tehnice?
• Pretul produsului este vizibil?
• Garantia si tara de provenienta a produsului sunt afisate?
• Daca exista, reducerea este vizibila?
• Producatorul este afisat?
• Exista greseli de gramatica?
• Exista componente multimedia in pagini?
• Unitatile de masura sunt ambigue si greu vizibile?
• Paginile de prezentare contin toate datele magazinului?
• Coordonatele de contact sunt afisate intr-un loc de maxima vizibilitate?
• Exista o sectiune specifica de ajutor/intrebari si raspunsuri?

Daca aveti pareri, sugestii .. nu ezitati!
Pe subiectul usability in ecommerce iti recomand sa citesti si: usability in ecommerce – arhitectura si navigare, usability in ecommerce – layout si design.

tweet me

In astfel de cazuri, orice vizitator cu intentie de cumparare vadita rataceste o perioada in cautarea unui produs sau a unei categorii anume si intr-un sfarsit, nu foarte departe in timp de momentul in care a intrat, paraseste magazinul. Este un client pierdut, fara intentie de revenire, prima impresie in cazuri de genul acesta fiind definitorie.
Concluzia – gradul de utilizare al unui astfel de magazin este extrem de scazut, tot ceea ce presupune usability rasfrangandu-se in mod direct asupra vanzarilor.

La nivel mediu, un formular ce urmareste sa masoare uzabilitatea unui ecommerce in termeni de layout si design ar trebui sa contina si elementele de mai jos.

Usability – Layout si Design

• Marimea paginii depaseste dimensiunea ecranului? (resize)
• Exista un punct de  focalizare clar in fiecare pagina?
• Este logo-ul pozitionat vizibil?
• Layoutul impresioneaza vizual?
• Prima impresie denota organizare?
• Alinierea este folosita eficient?
• Gruparea este folosita eficient?
• Exista un contrast vizibil?
• Este layoutul dezordonat?
• Este layoutul estetic?
• Este layoutul aglomerat?
• Este layoutul prea aerisit, da o senzatie de gol?
• Este sincronizata aranjarea pe verticala si orizontala?
• Exista o topica a aranjarii spatiilor goale?
• Culorile folosite sunt consistente?

Daca aveti pareri, sugestii .. nu ezitati!
Maine – Continut.

Pe subiectul usability in ecommerce iti recomand sa citesti si usability in ecommerce – arhitectura si navigare.

tweet me

La nivel mediu, un astfel de chestionar mie mi-a iesit conform norului de mai jos. In total, peste 100 de puncte distincte, excluzand voit zona de cart.

Astazi, sectiunea ce trateaza probleme de arhitectura si navigare. Fiecare punct in sine contine la randul sau diverse derivate, dar pentru a obtine o analiza de baza, sugestiva pentru multe din magazinele online ‘a/live’ in acest moment, este un punct de start mai mult decat suficient. Pe alocuri diverse notiuni functioneaza ca mici multimi comune, dar tocmai pentru ca portabilitatea si universabilitatea lor le subliniaza in mai multe zone.

Usability – Arhitectura si Navigare

• Structura magazinului se aliniaza scopului?
• Arhitectura magazinului poate fi inteleasa rapid?
• Schema de navigare este clara?
• Poti spune cu exactitate unde te afli?
• Ai idee cum poti gasi ceea ce cauti?
• Remarci un numar rezonabil de optiuni de navigare?
• Optiunile de navigare sunt logic dispuse?
• Linkurile au acelasi nume ca paginile?
• Sunt linkurile clar demarcate?
• Exista un breadcrumb?
• Exista un motor de cautare intern?
• Exista optiunea de cautare avansata?
• Exista un sitemap?
• De-a lungul navigarii, fiecare pagina iti comunica clar unde te afli?
• Simti ca ai controlul navigarii?
• Sistemul de navigare este intuitiv?
• Exista un sistem de filtrare al produselor?
• Exista un sistem de notare al produselor?
• Exista un sistem de recomandare al produselor?

Daca aveti sugestii, nu ezitati.
PS. Maine – Layout & Design.

tweet me

Si fie ca este vorba de de homepage, pagina de produs sau pagina de categorie, o reducere trebuie afisata si potentata. Are rolul de  transforma vizitatorul in cumparator si conversia poate fi uimitoare.
Trei argumente altereaza insa gradul de convingere al unei reduceri: pozitionare, aspect si natura.
Mai jos, cateva exemple despre cum folosesc diversi etaileri cele 4 argumente ale unei reduceri.

Amazon.com – in homepage sau listing de categorie, pretul dupa discount este afisat sub forma de text, intr-un cod de culoare diferit de cel standard, fontul fiind bolduit. Vizibilitatea este medie, reducerea nu sparge deloc “monotonia” listing-ului. Etailer-ul in cauza opteaza pentru afisarea si semnalizarea de reducere prin postarea pretului vechi taiat si amplasarea in proximitate a pretului nou, ignorand sistemul procentual. (37% in cazul de fata)

Vexio.ro – pretul dupa discount este afisat sub forma de text, cu un mic suport grafic pe fundal pentru potentare. Vizibilitatea este medie-crescuta. Sublinierea reducerii se face comparativ, prin afisarea pretului vechi taiat, intr-o culoare distinca si amplasarea in proximitate a pretului nou. Sistemul procentual este ignorat.

Emag.ro – pretul dupa discount este afisat sub forma de text, avand in imediata apropiere si procentul cu care se face reducerea. In plus, etailer-ul in cauza grupeaza toate amanuntele argumentului pret intr-o zona restransa, pentru o mai buna focalizare. Sublinierea reducerii se face comparativ, prin utilizarea de contrast si culoare. Taierea si estomparea pretului vechi impreuna cu afisarea procentului intr-o culoare aparte sunt suportul pentru noul pret.

Librarie.net – similar modelului amazon.com, reducerea este enuntata prin afisarea celor 2 preturi, vechi si nou si utilizarea codului de culoare. Sistemul procentual este ignorat.

Thesource.ca – pretul dupa discount este afisat sub forma de text, facandu-se uz de sistemul comparativ vechi-nou, cu suport grafic important pe fundal pentru ambele variante. Potentarea se face atat prin cod de culoare cat si prin folosirea marimii si naturii fontului. Sistemul procentual este ignorat.
Culorile sparg monotonia listing-ului, constrastul semnalizand perfect si atragand atentia vizitatorului asupra “etichetei” in cauza.

Logica unui tipar de afisare se masoara in productivitate. In cazul reducerii, in numar de vanzari ale produsului care face obiectul acestui proces.
Si orice vanzare este influentata de pozitionare, aspect si natura.
Pentru reducere asta inseamna – unde anume o afisez, in ce fel o afisez, o afisez ca numar rezultat sau/si procentual.

tweet me

Exista o regula nescrisa in design-ul web care spune ca jocul proportiilor in elementele folosite este extrem de important pentru usability si va conta foarte mult economia navigatiei. Incipient, la nivel de constructie, din motive de vizibilitate, marimea fontului ales pentru un titlu sau un pret este capitala.
Densitatea paginii, dinamica ei … si cam tot ce intra la capitolul grad de utilizare, vor fi influentate in primul rand de cele 2 elemente.
Asta pentru ca ele vor fi focusate incipient.
Si daca la momentul implementarii viziunea viitorului proprietar implica si notiunea de optimizare pentru motoarele de cautare, atunci unul din cei 2 mici “eroi” va trebui ajustat putin.
Cum? Urmariti cele 3 exemple de mai jos.

target.com
- titlu -  H1, font marime mare, pozitionare excelenta in de vizibilitate maxima, contrast puternic
- pret – font marime mare(22px), culoare puternica, contrast maxim, vizibilitate excelenta

amazon.com
- titlu – H1, font marime medie, pozitionare in cea mai buna zona de focus, vizibilitate buna, contrast puternic
- pret – font marime medie ce prin jocul proportiilor in raport cu ‘vecinii’ de rand iese in evidenta, culoare medie-puternica, contrast bun, vizibilitate excelenta

zappos.com
- titlu – H1, font marime medie-mica, pozitionare in coltul din stanga sus, in zona de maxima vizibilitate, constrast bun
- pret – font marime medie-mica ce prin pozitionare si lipsa de continut in jurul sau iese in evidenta, culoare puternica, vizibilitate excelenta

Toate cele 3 exemple sunt construite pe o reteta de succes, combinand argumentele seo cu usability. Nu in ultimul rand, design-ul simplist si aerisit potenteaza cele 2 caractere principale, dandu-le putere si greutate in economia paginii. Altfel spus, facandu-le imposibil de ratat.

Important de retinut este ca la reteta in cauza s-a ajuns dupa multiple teste. Ca si cum ai face un casting pentru Starsky si Hutch, incercand sa gasesti cei mai buni actori pentru a interpreta cele 2 roluri.
Orice ai construi, testeaza pe useri. Intai cu 5, apoi fa eforturi si mareste numarul. Difersifica profilul userului si testeaza din nou.
Rezultatul va fi definitoriu.

tweet me

Asadar, unde ma duci din cart?

Emag.ro – indiferent de traseul pe care am ajuns in pagina de produs pentru a putea comanda, butonul “Ma intorc in magazin” ma retrimite in homepage.
Butonul respecta codul de culori, este plasat intr-un loc de vizibilitate buna, fiind aproape imposibil de ratat de catre user.

Pc-fun.ro – indiferent de traseul pe care am ajuns in pagina de produs pentru a putea comanda, butonul “Continua cumparaturile” ma retrimite in homepage.
Butonul este plasat intr-o zona cu vizibilitate crescuta dar din motive lesne de inteles se renunta la codul de culoare, folosindu-se varianta b&w.

Marketonline – butonul lipseste, userul obisnuit putand folosi doar meniul de navigatie al site-ului sau butoanele browserului.

Vexio.ro – indiferent de traseul pe care am ajuns in pagina de produs pentru a putea comanda, butonul “Continua cumparaturile” ma retrimite in homepage.
Butonul(text) respecta codul de culori, este plasat intr-un loc de vizibilitate buna, iar fontul are marime inferioara celui uzual din motive usor de intuit.
In plus, in cazul Vexio optiunea de a vizita cart-ul de-a lungul sesiunii de cumparaturi ii apartine exclusiv userului, site-ul in cauza oferind facilitatea de a adauga in cos fara a “vizita” obligatoriu cosul de de cumparaturi.

Amazon.com – butonul lipseste, userul obisnuit putand vizita unul din multiplele produse recomandate in subsolul cosului. Etailer-ul in cauza prefera de redirectioneze userul pe o cale bine prestabilita afisand atat produse din istoria navigatiei userului in cauza precum si produse din aceeasi clasa/categorie. In plus, chiar sub tag-ul Shopping Cart este afisat un buton ce sugereaza vizitarea unei zone de produse similare.

Target.com – prefera sa sugereze directia in care ar putea naviga userul, oferind multiple optiuni printre care se numara homepage, o zona de produse similare sau o zona de oferte speciale.

Exemplele de mai sus nu sunt intamplator selectionate. Toate sunt modele de succes intr-un fel sau altul si subliniaza diverse abordari ale arhitecturii unui magazin online.
Zona de cart este una sensibila, in care se poate profita enorm de mult dar se si poate gresi. Fiecare model ales se bazeaza pe observarea obiectiva si atenta a nisei in cauza si implementarea ca atare.
Subiectiv vorbind, eu nu vad ratiunea transportarii userului in cart(un pas in plus), atata timp cat ii poti comunica printr-un popup (rezident pe ecran 10sec.) ca a adaugat un produs in cos. Este o parere bazata pe argumente logice la fel ca si antiteza ei. Depinde de abordare.

Ideea principala este insa ca odata ce ai hotarat sa trimiti cumparatorul in cart, ar fi bine sa si stii ce anume ii dai mai departe, incotro il trimiti.
Orice operatiune te decizi sa implementezi in timpul procesului de cumparare afecteaza uzabilitatea magazinului tau si acesta e punctul de la care trebuie sa pornesti.

tweet me

Prima pagina a unui magazin online este vitrina, punctul de plecare al relatiei cu potentialul cumparator. Orice imbunatatire a acestei zone prin evidentierea elementelor cheie ii va creste gradul de utilizare si implicit valoarea business-ului.

La prima vedere, sa construiesti prima pagina a unui ecommerce este usor. Asa ar raspunde, poate 70% din managerii de astfel de proiecte daca i-ai suna.
Nimic mai corect, caci aparent daca ai o structura bine definita, e la indemana sa afisezi vandabilul, promotiile sau un program de fidelizare in zona cea mai fierbinte – mare, vizibil si eventual indeajuns de colorat incat sa indemne userul sa faca ceva…
Problema majora in ceea ce priveste gradul de utilizare este ca oferta ta este imensa si incluzand cate un mic preview la sectiunile importante, vei sfarsi prin a avea o insiruire verticala de produse, promotii, comentarii …samd.
E ca si cum te-ai uita la o vitrina inalta de 5m.

Si fie ca optezi pentru un homepage bazat in mare parte pe vizual sau pe altul ce pune accent pe listing-uri din arii bine delimitate, in termeni de usability, constructia primei pagini ar trebui sa faca uz de elementele de mai jos, tinand cont in acelasi timp ca un user rareori citeste mai mult de 20% din textul afisat pe prima pagina, zonele intens focusate  ‘desenand’ un tipar in F.

homepage usability

• logo-ul este asezat intr-o zona distincta, de maxima vizibilitate
• motto-ul este afisat in titlul paginii
• motorul de cautare este vizibil si indeajuns de mare pentru a cuprinde minim 25 de caractere
• categoriile sunt vizibile, structura arborescenta fiind evidentiata signalistic
• ofertele importante sunt afisate in zona de maxima vizibilitate cu mesajul cheie livrat in clar
• tot continutul dinamic este focalizat pe definitia de call to action
• linkurile text incep cu un cuvant cheie
• imaginile folosite ca vector de comunicare sunt relevante (recomandat este sa folosesti imagini din viata reala a unui produs)
• proportia dintre imagine si text este relativ egala
• numarul de fonturi folosite este maxim 3
• numarul de culori folosite este de maxim 3
• continutul este afisat pe verticala in ordinea importantei
• toata informatia corporatista este grupata intr-o singura zona(contact, despre…)
• design-ul are o tenta explorativa, incurajand userul sa navigheze
• ansamblul nu este aglomerat si reprezinta o previzualizare a continutului
• navigarea este intuitiva, userul putand sa-si dea seama rapid cum ajunge in zona dorita
• homepage nu inseamna pagina de categorie, deci listing-ul de produse ar trebui sa fie rezonabil [3-4 din fiecare categorie aleasa este suficient]
• elementele de securitate (daca exista) sunt afisate
• dimensiunea redusa permite o incarcare rapida
• coordonatele de contact direct sunt vizibile, afisate intr-o zona cu vizibilitate buna

Lista de mai sus este doar un punct de start pentru tot ce inseamna homepage usability. Realitatea cu siguranta cere mai mult, asa ca nu te rezuma la a decora sau a umple prima pagina cu o insiruire de produse.

tweet me

Si chiar daca design-ul are un rol major in estetica raftului, functionalitatea este cea care de cele mai multe ori iti pastreaza vizitatorul pe site, elementele cheie din pagina de categorie fiind cele care cresc gradul de utilizare.

• titlu pagina – titlul paginii trebuie sa fie scurt si concis, reflectand exact numele categoriei – o topica excelenta ar fi {nume categorie: nume magazin}
• numar de produse pe pagina – numarul de produse afisat in mod implicit; intrucat mai toate conexiunile internet din ziua de azi depasesc un anumit standard, modul ideal de afisare ar trebui sa contina cat mai multe produse pe pagina
• imagine – clara, indeajuns de mare {100×100px, 200×200px} pentru a permite o vizualizare decenta la nivel de detaliu; un mic script java de preview poate fi un instrument extrem de util
• pret – pretul trebuie sa fie clar, vizibil, de marime medie si culoare contrastanta; atunci cand este cazul, aceasta este zona in care se va afisa si pretul precedent sau discount-ul
• adauga in cos – desi se prezinta ca un element cheie, nu este imperativa folosirea butonului in cauza; totusi, in cazul utilizatorilor focusati, este un plus binevenit
• sortare dupa pret – posibilitatea de sortare a produselor din pagina in functie de pretul afisat – cum pretul este poate cel mai important amanunt urmarit de potentialul cumparator, concluzia fireasca este sa ii dai posibilitatea aranjarii in ordine crescatoare sau descrescatoare a produselor din categorie
• sortare dupa gradul de noutate – posibilitate de sortare a produselor dupa data introducerii – peste 50% din vizitatorii magazinului tau sunt cumparatori pasivi; rasfoiesc continutul cautand deal-uri de ultim minut, oferte speciale si nu in ultimul rand noutati
• sortare dupa rating – sortare dupa nota obtinuta – in cazul in care ai implementat un sistem de notare a produselor, sortarea dupa rating poate fi un instrument de marketing extrem de folositor, multi dintre potentialii cumparatorii asociindu-se unui  comportament de grup
• sortare alfabetica – sortare alfabetica a produselor – desi aparent inutila, este uimitor cati de multi vizitatori folosesc acest mic tool
• filtrare dupa brand – filtrarea produselor in functie de brandul pe care il reprezinta – un shortcut util pentru cei care au o afinitati pentru o marca anume
• filtrare dupa atribute – filtrarea produselor in functie de atributele detinute – marime, culoare …etc. ; folosind acest filtru ii scurtezi cumparatorului distanta dintre dorinta si achizitie – desi se materializeaza cu precadere in anumite nise, majoritatea cumparaturilor sunt finalizate pe astfel de atribute; probabil cel mai important filtru pentru un magazin online de dimensiune medie sau mare
• breadcrumb – sistem de navigatie ce indica exact locul in care se afla user-ul
• vezi toate produsele – posibilitatea de a vizualiza toate produsele intr-o singura pagina; nu stiu daca este o dorinta universala, dar eu unul sunt inamicul declarat al next-urilor sau al numerelor de pagini; prefer sa astept 5 secunde in plus dar sa am totul intr-o pagina
• vezi X produse pe pagina – posibilitatea de a vizualiza un numar finit de produse intr-o pagina
• navigare paginata – sistem de impartire si afisare a produselor in pagini – daca optezi pentru un numar finit de produse pe o pagina, un element cheie este afisarea intregului sistem de navigatie(numerele de pagini), excluzand butoanele de inainte-inapoi
• pozitionare optiuni de filtrare – afisarea filtrelor atat in partea de sus a paginii de categorie cat si in zona apropiata footer-ului
• noutati – prezentarea noutatilor pentru categoria in cauza – pe langa semnalizarea nominala la nivel de produs, un bun procedeu cu rezultate excelente este crearea unei zone speciale, de noutati, in partea de sus a listing-ului
• cel mai bine vandut – prezentarea topului de vanzari pentru categoria in cauza – la fel ca in cazul noutatilor, afisarea celor mai bine vandute produse nu poate fi decat un plus de marketing
• recomandari – recomandari de produse – deloc de neglijat, o zona concreta de recomandari bazate pe review-uri profesionist construite poate da un boost vanzarilor

Combinand toate elementele cheie de mai sus cu un design estetic, orientat catre o navigare cat mai usoara, vei creste substantial uzabilitatea paginii de categorie, dinamizand si scurtand drumul catre cosul de cumparaturi.

tweet me