Komentáře k článku

E-shop z hlediska použitelnosti

U e-shopů jsme si zvykli na leccos a spoustu nepovedených detailů přehlížíme. Takové drobnosti mohou však nákup znepříjemnit, návštěvníka otrávit či dokonce poslat ke konkurenci. Na příkladu jednoho z nejlepších evropských e-shopů si ukažme, jak jej lze udělat, aby bylo nakupování příjemným zážitkem.

Zpět na článek

28 komentářů k článku E-shop z hlediska použitelnosti:

  1. Slávek

    Děkuji

    Díky za pěkný a kvalitně zpracovaný článek. Určitě pár věcí „obšlehneme“ a napravíme. Škoda že člověk nezná skutečná data a o konverzích a pod. Takhle není možný určit, jestli ten eshop fakt dobře funguje.

    1. Petr StaníčekAutor příspěvku

      Re: Děkuji

      Obzvlášť v případě e-shopů jsou na tohle ideální A/B testy. Tam je konverze poměrně dobře měřitelná a ověří se to nejlépe.

      1. Slávek Černý

        Re: Děkuji

        A/B testy máme v portfoliu, ale jejich použití je dost omezené vzhledem k tomu, jaké návštěvnosti eshopy v čechách dosahují. Konverze jednotlivých položek jsou v řádech jednotek a desítek (kromě těch největších). Takže to testování se skoro ani nevyplatí (trvá dlouho, výsledek neprůkazný).

    2. mka

      Re: Děkuji

      Díky, zajímavé počtení. Např. tu volbu odlišné dodací adresy bych opravdu hledal hned pod fakturační adresou a ne až na konci, obešlo by se to bez rolování, ať se to používá vzácně nebo často, zabere to jeden řádek na stránce, výhodu v odsunutí nějam dolů jsem nepochopil.

      Zabalení odeslaného zboží do krabic ve výpisu zpracované objednávky je opravdu pěkný nápad, na první pohled to ocením, na druhý to trochu ztěžuje orientaci — třeba když budu ve starších zakázkách hledat nějaké zboží, podle obrázku okamžitě vidím co je co, ani nemusím číst názvy. Když pak tam místo toho vidím X stejných krabic, moc mi to nepomůže.

      1. David Grudl

        Re: Děkuji

        To s tou fakturační adresou také vnímám jako řádný UX fail.

        V titulku stojí „Fakturační a dodací adresa“, ale žádná dodací v boxíku není. Její odsunutí na konec, pokud na e-shopu nakupují převážně fyzické osoby, je přeci zcela kontraproduktivní. Fyzickou osobu zajímá dodání, nikoliv fakturace. Formulář by měl být koncipován obráceně, tedy upřednostnit dodací adresu a nabídnout možnost změnit adresu fakturační. Viz třeba objednávkový formulář na http://www.vitalita.cz

  2. Borek Bernard

    Cena obrázkem

    Zaujala mě ta cenovka realizovaná obrázkem, používá toto řešení i nějaký jiný významný / úspěšný eshop? Intuitivně bych to okamžitě označil za chybu (nepřístupnost, nemožnost vybrat myší, na první pohled bych to považoval za reklamní box atd.), ale třeba je to řešení stojící za pozornost. Nemá k tomu někdo další příklady, argumenty či protiargumenty?

    1. Petr StaníčekAutor příspěvku

      Re: Cena obrázkem

      Taky mě to zajímá, praktické zkušenosti s tímto řešení uvítám. Osobně opravdu sázím na úmysl a znemožnění data miningu – ať už robotům vyhledáváčů, tak především od konkurence a cenových agregátorů.

      1. Borek Bernard

        Re: Cena obrázkem

        (Reakce i na Hds) Z ryze technického pohledu bych skoro řekl, že je obtížnější vysekat informaci o ceně z DOMu než z obrázku (DOM se může měnit, obrázek musí zůstat čitelný). Samozřejmě můžou měnit i polohu obrázku v DOMu, ale řekl bych, že to celé nijak zásadně scrapingu nebrání.

        Chtěl jsem se zeptat přímo autorů, proč cenu realizují obrázek, ale na webu tvůrců tohoto eshopu nějak nemůžu najít ani kontakt – docela druhý protipól použitelnosti :) http://www.netzmarkt.de/

    2. Hds

      Re: Cena obrázkem

      Prakticky to znemožňuje scraping. Jinak není velký problém udělat skript, který „projíždí“ jednotlivé stránky e-shopu a ukládá si název produktu (příp. jeho kód) a cenu, za kterou je prodáván. Na základě toho se dá udělat např. automatický price matching (i když praktická využitelnost takového skriptu je druhá věc…)

      1. manakmichal

        Re: Cena obrázkem

        využitelnost takové skriptu se hned nabízí. pokud máš velký obchod a vysoké marže, sleduješ konkurenci a při jejich snižování ceny také snížíš, protože si to stále můžeš dovolit. je to normální cenová válka.

      2. Sten

        Re: Cena obrázkem

        Na scraping úplně stačí, když obchod zaregistrujete do Zboží nebo Heuréky. IMO je praktický přínos takového obrázku mizivý.

    3. hobr

      Re: Cena obrázkem

      Mě napadá, že to je kvůli (ne)indexaci roboty. Když v obchodě změní cenu, tak vyhledávači nějakou dobu trvá, než změnu promítne do výsledků. A taky proto, aby návštěvník neviděl cenu ve výsledcích vyhledávání, ale přišel se na ni podívat do obchodu.

  3. Substance242

    Re: E-shop z hlediska použitelnosti

    Ako „hudobník“ (len amatérsky nadšenec do synťákov atď) po objavení Thomann.de už inam ani nechodím, ale až teraz pri čítaní článku som si uvedomil že fakt, aké je to premyslené!

    A sto bodov za: „Kdybychom se v supermarketu zapovídali s kamarádem a najednou přišel zřízenec a košík s nákupem nám odvezl, asi bychom pro něj neměli moc pochopení.“ :-)

  4. jan.a.janicek

    Použitelnost

    Článek se mi líbí. Myslím, že ukazuje mnoha vývojářům odlišný pohled na to, jak mají být rozloženy prvky v eshopu. Ovšem rád bych doplnil pár takových věcí, které se mi jeví jako zásadní. Ukážu na product detailu, ale podobné „chyby“ se objevují naskrz celými stránkami.

    Struktura stránky


    – Design s použitelností souvisí asi jako kytara s kytaristou, webdesign je nástroj, kterým lze některé informace potlačit, některé naopak zdůraznit. Co je tedy v product detailu to důležité?

    1. název produktu (s tím související popis produktu)
    2. fotografie
    3. cena
    4. tlačítko vložení do košíku
    5. dostupnost
    6. ostatní parametry

    Dále je třeba pátrat po souvislostech informací. Dostupnost by se měla zobrazovat někde poblíž ceny a poblíž ceny by mělo být také tlačítko pro vložení do košíků, aby člověk nemusel tolik kmitat očima sem a tam.

    Pěkná struktura jde vidět například tady: http://www.megapixel.cz/canon-eos-550d

    Na mém příkladu lze vidět, že uživatel nepotřebuje 1. příliš scrollovat, aby získal potřebné informace a za 2. nemusí zbytečně kmitat očima z jedné části na druhou, jelikož jsou informace, které spolu souvisí umístěny v těsné blízkosti.

    A teď k oněm chybám, které s výše zmíněnými informacemi souvisí. Na ukázce v článku jsou „další parametry“ (odrážky s informací o složení sady a prodejnosti) výše než cena a možnost vložit zboží do košíku. Možné by bylo tyto informace vložit do souvislého textu, který by tvořil popis zboží. I z hlediska SEO by to bylo přirozenější.

    Duplicita informací


    Každý na to může mít svůj názor, ale duplicitu jednotlivých částí na stránce vnímám jako projev špatné struktury. Proč by se jinak prvky musely opakovat? Autoři si totiž nebyli jistí, zda někdo ony prvky nepřehlédne. Tak proč je neudělat jasnější a výraznější? Opakování na různých místech akorát dělá stránku nepřehlednou. Je to jasný příklad tlačítka pro vložení do košíku, které by správně mělo být na stránce graficky nejvýraznějším prvkem, nebo zvukové ukázky, která je v pravém sloupci mimo kontext (odvádí pozornost) a varianta uprostřed je mezi nesouvisejícími informacemi.

    Rozdělní informací o ceně, kvantitě zboží a dopravě do dvou separovaných boxů dole je v tomto případě nešťastné a opět nutilo autory zcela zbytečně umistit dvakrát tlačítko přidání do košíku. Nevidím navíc žádnou sémantickou souvislost mezi číslem produktu v katalogu prodejce s cenou. Kód je většinou provázán s názvem zboží, tudíž by měl být umístěn někde poblíž.

    A jistě by se dalo pokračovat dál.. Svým komentářem jsem chtěl především ukázat, že je důležité nejen zkoumat to, co je na stránce umístěno, ale také to, kde a jakým způsobem :) V žádném případě mi nešlo o zpochybení informací ze článku.

    1. Petr StaníčekAutor příspěvku

      Re: Použitelnost

      S naprostou většinou vašich připomínek coby UI/UX designer velmi zásadně nesouhlasím. Nic osobního, ale směl bych vědět, co je vaší profesí? Jste odborník na UI/UX, nebo spíš vývojář? Jen abych věděl, na jaké úrovni odbornosti se bavíme a z jaké pozice argumentujete.

    2. panika

      Re: Použitelnost

      musim rict ze panove ux specialiste maji pravdu, z toho megapixelu me akorat bolej oci (coz je teda asi pozadim) a kdyz si projedu ocima stranku tak vidim sloupec nejakejch cisel a sirokej sloupec textu, co se blbe cte.

      u thomanna jsem teda taky cilovka a:
      duplicitnich prvku jsem si ani nevsiml, jsou tam kde je hledam a kde je nehledam mi nevadi, protoze tam nekoukam
      ocenuju ze me tam nezahlti informacema o produktu, ale spis daji linky na recenze, prijde mi to tak nejak duveryhodnejsi…

      kdyz nad tim tak premyslim, tak jsem snad lepsi eshop nevidel :)

  5. honzamac

    Re: E-shop z hlediska použitelnosti

    Já bych jen upozornil na krásné video o Nakupování v e-shopu a klasickémn obchodě.
    http://goo.gl/SkZ0t

    Skvělý článek! Nechť se všechny obchody inspirují a nám ostatním se bude dobře nakupovat bez zbytečného stresu.

  6. PMD

    Vysypávání košíku

    Vysypávání košíku při nečinnosti je zvěrstvo, ale anonymní košík je třeba po nějaké době vysypat ze zcela jasného důvodu: zboží v košíku chybí v nabídce.
    Když máte omezený počet kusů (třeba autorské věci apod.), nechcete, aby to někdo syslil půl roku. V tom případě bych zřízence chápal, že vám ten koš prostě vyklopí.
    Byl by to i snadný způsob jak poškodit konkurenci: vyházet jim zboží z regálů do košů a mua-ha-ha.

    1. Sten

      Re: Vysypávání košíku

      Stačí, když zboží v košíku nebude po nějaké době rezervované, nemusíte košík hned vyklápět.

      1. PMD

        Re: Vysypávání košíku

        A jaký je v tom rozdíl?
        Opravdu chcete mít v košíku věci půl roku, abyste potom při checkoutu zjistil, že to zboží už koupil někdo jiný?

    2. Oldisy3

      Re: Vysypávání košíku

      Tak zbozi v kosiku se nemusi hned rezervovat. Staci pred finalnim objednanim, nebo pri kazdem reloadu stranky kontrolovat jestli je tam toho dost, pripadne snizit pocet v kosiku, a uzivatele o tom nasledne informovat. Zbozi se rezervuje az pri dokoncene objednavce, nasledne se odecita ze skladu, v momente kdy je bud objednavka odeslana a nebo zaplacena. zalezi co se dela driv, podle zpusobu dodani ;)

  7. Lokutus

    No jo, tak já nesouhlasím

    Prošel jsem si ten e-shop a za sebe říkám, že se mi to z hlediska té moderní buzzkratky UX prostě nelíbí. Tady jsou mé důvody:

    1. Web je nudle, kde musím neustále skrolovat, a to i v detailu produktu. Musím skrolovat, abych se dostal k ceně, nebo k tlačítku vložit do košíku. Skrolování pro důležité prvky je IMO špatné.

    2. Web je neskutečně přeplácaný. Možná je vhodný pro ty nerozhodné a nadšené, kteří rádi stráví brouzdáním sem a tam, zkoušením různých fíčur (srovnávání, nabídky, vyhledávání apod.), ale pro člověka, který chce přijít, koupit, odejít, a to co nejrychleji, je to totální průser. Asi jako když jdu pro chleba a máslo a jediný obchod v okolí je dvouhektarové Tesco. Než tam tyhle dvě konkrétní komodity najdu, raní mě mrtvice.

    3. Různé související prvky jsou nelogicky rozházené po stránce. Do galerie se sice dostanu kliknutím na obrázek, ale samotná galerie je umístěna v extra boxu vpravo. Nad ní je možnost spustit interaktivní animaci, což je velice užitečná fíčura, ale je umístěná blbě. Třísloupcový layout je z informačního hlediska zahlcující a například já osobně pravý sloupec zpravidla ignoruji, protože tam očekávám marginální informace, popř. reklamu. Kdybych to nehledal, ani by mě nenapadlo, že to má i animaci. Tohle by IMO mělo být formou nějakých ikon, či thumbnailů přímo u hlavního obrázku. Popis produktu je zbytečně obsáhlý román, plný technických detailů, které bych čekal strukturovaně napsané v nějaké tabulce stranou – když to vidí laik, nečte to, když to vidí profesionál, musí vyzobávat technické detaily z nestrukturovaného textu.

    Já osobně jako ideál vnímám detail produktu, kde je v nějakém logickém celku, který je viditelný na první pohled a má dostatečně široké okraje, aby se odlišil od zbytku stránky, velkým písmenem napsán název, je tam přiměřeně velký náhled, popř. s jednoduchým náznakem galerie, výrazná barevná cena a dostupnost (slovy, ne ikonami), krátký popis max. na tři řádky s možností rozbalit zbytek, příp. srozumitelná tabulka s technickými detaily (ta už klidně pod viditelnou částí stránky), velké tlačítko ‚vložit do košíku‘ vedle ceny.

    Jinak struktura webu je OK, navigace srozumitelná, vyhledávání bezvadné. Jenom když přijdu na ten web dveřmi, tak na první pohled nepoznám, že jde o e-shop. Nabídka je skryta opět dole, pod viditelnou částí. Na první pohled to na mě působí spíš jako obskurní blog o nástrojích. Ale na druhou stranu, dveřmi žádní náhodní kupující zpravidla nechodí, tak to zase takový problém asi není.

  8. Lukáš Svoboda

    Praktický e-shop

    Tento e-shop, je z hlediska UI/UX(možností) velká fail. Podle mého je na tom snad lépe i OpenCart v defaultu. Ani nebudu mluvit o grafickém zpracování, které vypadá jak z roku 2000, což je první věc která mě odradí. Na druhou stranu článek psal programátor,. jinak si to neumím vysvětlit. Případně český pohled na UX je někde za hranicí MS Office 97

    1. Martin Malý

      Re: Praktický e-shop

      Článek psal UX/UI designer. Moc se těším, až „si to vysvětlíte“ a pustíte se místo prázdných frází do argumentace na úrovni hodné diskuse UX profesionálů…

  9. Lukáš

    Registrace

    Celkově se mi to líbí, ale vadila by mi hodně před-registrace typu: „Víme, že se u nás registrovat nechcete, psal jste to v objednávce, ale i tak si vaše údaje zapamatujeme a při případné další návštěvě vám je budeme vnucovat.“

Napsat komentář

Tato diskuse je již příliš stará, pravděpodobně již vám nikdo neodpoví. Pokud se chcete na něco zeptat, použijte diskusní server Devel.cz

Zdroj: https://www.zdrojak.cz/?p=3558