Další ze série zajímavých kapitol z knihy Martina Krupu E-shop od nápadu po úspěch shrnuje základní doporučení, resp. požadavky na vizuální design e-shopu.
Další ze série zajímavých kapitol z knihy Martina Krupy E-shop od nápadu po úspěch shrnuje základní doporučení, resp. požadavky na vizuální design e-shopu.
Požadavky na vizuální design
Návrh vizuálního designu zabezpečí webový grafický designér, který jako hlavní vstup použije navrženou informační architekturu pro e-shop, zejména skici a drátěné modely. Dalším důležitým vstupem pro jeho práci je design manuál společnosti nebo značky, která provozuje e-shop. Design manuál by měl minimálně obsahovat logo s detaily jeho použití, barvy a písmo.
V dnešní době by měl být design manuál připravený s přihlédnutím na jeho využití i na webu, který má jiné vlastnosti než tištěné materiály, pro které byly obvykle design manuály vytvořeny. Už by se nemělo stát, že navržené logo je při použití na webu malé a nečitelné nebo navržené barvy nemají adekvátní webové vyjádření.
Kromě design manuálu je důležitým vstupem i grafický design prodávaných produktů a očekávání zákazníků, které jsou zapsány při navržených persónách v informační architektuře.
Grafický design musí být adekvátní prodávaným produktům a jejich ceně. E-shop s levnými knihami z druhé ruky by měl mít bazarový design na rozdíl od luxusního designu e-shopu s drahými bibliofiliemi.
Základní funkcí grafického designu v e-shopu je podpořit nákup. Grafický design e-shopu nemá být prostorem na experimenty ve webovém designu. Výstupem práce webového grafického designéra jsou obrázky s detailním návrhem stránek e-shopu podle drátěných modelů stránek:
- stránka produktu,
- stránka se seznamem produktů,
- stránky s kroky nákupního košíku,
- hlavní stránka,
- stránka s výsledky vyhledávání,
- textová stránka,
- stránka s formulářem,
- e-mail s detaily o objednávce,
- e-mail s novinkami a produkty.
Weboví grafickí designéři obvykle pracují v softvarech Sketch nebo Adobe Photoshop a výstupní obrázky jsou například ve formátu PSD.
Požadavky na HTML/CSS
HTML s CSS a JavaScript jsou základní jazyky, ve kterých jsou vytvořeny webové stránky. V nich je připravená výsledná verze webových stránek e-shopu. Programátor HTML je naprogramuje podle obrázků navržených webovým grafickým designérem. Důležitým vstupem pro programátora HTML jsou verze HTML a CSS, ve kterých má webové stránky e-shopu připravit. Obvykle jde o nejnovější stabilní verze, výjimkou mohou být speciální požadavky, kdy např. víte, že většina vašich zákazníků používá starší prohlížeče, které nepodporují nejnovější verze. Otázka, kterou verzi HTML a CSS použít, je vlastně otázkou, jaké prohlížeče používají zákazníci. Aktuální verze jsou HTML 5 a CSS 4. V případě, že už e-shop máte, ve své webové analytice najdete přehled používaných prohlížečů a jejich verzí, z kterých se přistupuje na e-shop. Podle toho se snadno rozhodnete, pro které prohlížeče a které verze budete webové stránky připravovat.
Design podle šablony?
Návrhu grafického designu a následně programování HTML a CSS se vyhnete, pokud se rozhodnete využít nějakou hotovou šablonovou předlohu e-shopu, kterých je na webu k dispozici mnoho, mnohé jsou i zdarma. Je to běžný postup v případě využití jednoduchých e-commerce CMS vhodných na rozjezd e-shopu. Šablonové předlohy obvykle obsahují všechny potřebné stránky e-shopu. Někdy je potřebná úprava některých stránek kvůli detailům, na které nemohl být autor šablonové předlohy připravený. Např. počet vlastností produktů v e-shopu je mnohem větší, než je navrženo v šabloně, nebo v šabloně nejsou navrženy recenze k produktům. Někomu však uniformita designu šablonových e-shopů nevyhovuje. V případě rozjezdu menšího e-shopu, ve kterém chcete vyzkoušet online prodej, doporučujeme využít šablonu. Samozřejmě, ne v případě, kdy je grafický design součástí vaší značky a podporuje prodej.
