Jak navrhnout produktovou stránku, která konvertuje
Pět klíčových prvků, které zvyšují prodeje. Pozice fotografie, popis, cena, tlačítka a recenze.
Přečíst víceTéměř 70 % nákupů pochází z mobilů. Jak vytvořit verzi, kterou lidé skutečně používají — ne jen snižují.
Pamatujete si časy, kdy byl web primárně desktopový záležitostí? Ty jsou pryč. Teď je to opačně — mobilní zařízení dominují nákupům a není to jen tak něco. Pokud se podíváte na své analytiky, pravděpodobně tam uvidíte podobné čísla. U typického e-shopu v Česku je to 65–75 % všech návštěv ze smartphonů. A nejde jen o návštěvy. Ty nákupy? Převážně taky z telefonů.
Jenže tady je háček. Mnoho e-shopů má stále jen “zmenšenou” desktopovou verzi. Tlačítka jsou malá, formuláře nelogické, fotky pomalé. Výsledek? Lidé opouštějí nákupní košík. Často v poslední chvíli. Právě když jste si mysleli, že si to vezou. Tohle se dá změnit — a my vám ukážeme jak.
Zákazníci, kterým se na mobilu nakupuje hladce, utratí průměrně o 30 % více než ti, co musí zápasit s špatným designem.
Problém často spočívá v přístupu. Mnoho firem začíná s desktopem a pak prostě „zmenší” všechno. To je jako vařit jídlo pro 20 lidí a pak očekávat, že bude stejně dobré pro jednoho. Prostě ne.
Mobil má svá pravidla. Obrazovka je menší, připojení někdy pomalejší, pozornost uživatele rozptýlenější. Vy když jedete tramvají a chcete si koupit mikinu — nechcete scroll scroll scroll. Chcete to rychle. Jasně. Efektivně. Že jo?
Nejlepší řešení? Obrátit logiku. Navrhněte nejdřív pro mobil. Pak přidejte vylepšení pro tablet a desktop. Ne naopak. Proč? Protože mobilní verze bude nuceně jednoduchá a soustředěná. Žádné vychytávky, které lidem nejsou potřeba.
Prakticky to znamená: jednosloupcový layout, která se čte shora dolů. Velká tlačítka — minimálně 44 pixelů vysoká, aby vám to lidi stiskli hned. Jednoduché menu. Jednoduché formuláře. To, co vidíte, je to, co potřebujete. Bez zbytečností.
Víte, jaké je nejčastější zjištění při analýze, proč lidi opouštějí nákupní košík na mobilu? Pomalé stránky. Lidé čekají průměrně jen 3 sekundy. Když to trvá déle, půlka vám zmizí. Prostě si to vezou jinde.
Jak na to? Kompresujte fotky — na mobilu si nikdo neprohlíží 8 megapixelový obrázek. Použijte moderní formáty jako WebP. Minimalizujte CSS a JavaScript. Zbytečně velké soubory nikomu nepomohou. A proxy? Cachování? To jsou věci, které vám může pomoct provozovatel serveru.
“Nejrychlejší web je ten, který nemusí nic stahovat. Každý byte navíc je rozhodnutí koupit jinde.”
Tahle věc vás bude překvapovat: mnoho e-shopů má tlačítka příliš malá. Nebo příliš blízko u sebe. Když někdo kouká na mobil, jeho prst je poměrně velký. Pokud máte tlačítko vedle sebe bez prostoru, stiskne špatné. To se stane a pak si ho vezou jinde.
Minimálně 44 pixelů na 44 pixelů. To je doporučení od Applu a Googlu. Respektujte to. Navíc — hlavní akce (koupit, přidat do košíku) by měla být vždycky vidět. Když se scroll, měla by zůstat lepená nahoře nebo dole. Nejde o design, jde o chování. Chování, které prodává.
Formulář v checkout je poslední věc mezi zákazníkem a nákupem. Pokud ho uděláte špatně, zmáčknete zisky přímo v rukou.
Při emailu zobrazit @ klávesnici. Při telefonním čísle číselnou. Při PSČ čísla. Malá věc, velký dopad — lidé vyplňují formuláře 40 % rychleji.
Řekněte hned když je email špatně nebo je PSČ v špatném formátu. Ne až po kliknutí na odeslat. To šetří frustraci.
Email, pak heslo. Adresa, pak město. Pokud skáčete mezi okny, je to chaos. Logika je nejlepší design.
Psací pole s poznámkou “např. +420 775 555 666” šetří dotazy na support a snižuje chyby.
Fotografie produktu je nejdůležitější věc na stránce. Na mobilu jsou věci ještě intenzivnější. Lidi se nemohou dotknout věci, nemohou si ji koupit do ruky. Jedinou informací je fotka. Musí být ostrá. Musí být rychlá. A musí ukazovat to, co opravdu kupují.
Nepoužívejte jednu fotku. Dejte tam 3–5 obrázků z různých úhlů. Umožněte zoomování — prstem přiblížit. Pokud je to mikina, ukažte barvy. Ukažte, jak sedí. Zkrátka — dejte lidem to, co potřebují vidět, aby se rozhodli koupit. Bez fotky z mobilního pohledu nebudete prodávat.
Dnes, v roce 2026, je jasné: e-shop bez porádného mobilního designu je jako obchod bez okna. Lidi sice vejdou, ale koukat tam nechceme. Ale když si vezmete tyto principy a aplikujete je na váš e-shop, stane se něco zajímavého. Lidé nejen že budou koukat, ale budou kupovat. A budou se tam vracet.
Pamatujte — mobilní design není o tom, aby to vypadalo hezky. Je to o tom, aby to fungovalo. Aby lidé bez frustrací nakupovali. Aby vám nezůstávali v košíku nehotové nákupy. Aby vás volili místo konkurence. To je design, který prodává.
Tento článek poskytuje obecné informace a rady týkající se mobilního designu a e-commerce optimalizace. Každý e-shop je jedinečný a má své specifické potřeby. Výsledky se mohou lišit v závislosti na typu produktů, cílové skupině a technické infrastruktuře. Doporučujeme testovat změny na svém webu a sledovat výsledky prostřednictvím analytiky. Pro technickou implementaci se poraďte s vývojáři nebo web designéry se zkušenostmi s vašou platformou.