Filtrace a vyhledávání na e-shopu: UX, který pomáhá prodávat

Zákazník na e-shopu hledá dvěma způsoby. Buď prochází kategorie a zužuje výběr filtry, nebo rovnou napíše, co chce, do vyhledávání. Když ani jedna cesta nefunguje, odejde. A nezáleží na tom, jak dobrou máte cenu nebo jak pěkný detail produktu, protože se k němu vůbec nedostane.

Baymard Institute, který použitelnost e-shopů testuje s uživateli už přes deset let, ve výzkumu výpisů produktů popisuje velký rozdíl: na webech s průměrnou použitelností výpisů opouštělo úkol 67–90 % testovaných uživatelů, na webech s jen mírně vylepšenými nástroji pro filtrování 17–33 % uživatelů hledajících stejný typ produktu. Jde o výsledky laboratorního testování, ne o průměr trhu, ale směr je jasný. Filtry a vyhledávání patří k místům, kde UX přímo rozhoduje o tržbách.

Jak na tom e-shopy jsou

Baymard pravidelně hodnotí velké americké a evropské e-shopy podle stovek pravidel. Několik čísel z jejich aktuálních benchmarků:

• 56 % e-shopů má podle benchmarku vyhledávání pro rok 2026 použitelnost vyhledávání „průměrnou nebo horší“.
• 69 % e-shopů špatně zvládá překlepy v našeptávači, takže zákazník může nabýt dojmu, že produkt nevedete.
• Téměř polovina e-shopů nenabízí rozumnou cestu dál ze stránky bez výsledků.
• 38 % e-shopů nemá filtry pro všechny údaje, které ukazuje ve výpisu produktů.
• 28 % e-shopů neukazuje přehled použitých filtrů.

Jde o velké zahraniční obchody s vlastními UX týmy. U menších českých e-shopů na stejné problémy při UX auditu narážíme na stejné typy problémů.

Filtry: podle čeho se zákazník opravdu rozhoduje

Nejčastější chyba je sada filtrů převzatá z šablony: cena, výrobce, dostupnost. Pro trička to může stačit, pro vrtačky nebo matrace ne. Zákazník vybírá podle vlastností typických pro danou kategorii: u matrace tvrdost a rozměr, u vrtačky napětí baterie a typ sklíčidla, u krmiva věk a velikost psa.

Co funguje:

• Filtry podle kategorie. Každá kategorie má vlastní sadu parametrů. Předpokladem jsou kvalitní a jednotná data o produktech, bez toho filtr nemá z čeho brát.
• Filtr pro každý údaj ve výpisu. Pokud ve výpisu ukazujete barvu, hodnocení nebo termín doručení, zákazník podle nich chce i filtrovat. Baymard tuhle chybu uvádí jako přímou příčinu odchodů.
• Nejdůležitější filtry nahoře. Baymard doporučuje vytáhnout klíčové filtry nad výpis, typicky jako rychlé volby. Podle jejich benchmarku to 61 % webů nedělá.
• Počet výsledků u hodnot. „Dub (24)“ říká zákazníkovi, co ho čeká. Hodnoty, které by vedly k nule výsledků, schovejte nebo zašeďte.
• Srozumitelné názvy hodnot. „Rozměr 90 × 200 cm“ místo interního kódu. Jednotky u čísel a rozsah místo desítek zaškrtávátek.
• Více hodnot v jednom filtru. Zákazník chce vidět modrá i černá trička najednou. Kombinace hodnot uvnitř filtru se má sčítat, ne vylučovat.

Přehled použitých filtrů a řazení

Po třech kliknutích zákazník často neví, proč vidí jen pět produktů. Proto potřebuje přehled použitých filtrů nad výpisem: každý filtr jako štítek s křížkem a tlačítko „Zrušit vše“. Baymard ve výzkumu uvádí, že takový přehled zrychluje hledání a pomáhá orientaci.

Řazení je samostatný nástroj, ne náhrada filtrů. Nabídněte volby, které dávají smysl: doporučené, nejprodávanější, cena, nejnovější, u sortimentu s recenzemi i hodnocení. Výchozí „doporučené“ řazení by mělo opravdu doporučovat, ne jen řadit podle data vložení.

Po použití filtru se nesmí stránka posunout nahoru, ztratit zvolené hodnoty ani rozbít tlačítko Zpět. Krátká zpětná vazba, že se výsledky aktualizují, je přesně ten typ mikrointerakce, která dává jistotu.

Filtry na mobilu

Na mobilu se filtry obvykle skrývají za tlačítko a otevírají v samostatné vrstvě. To je v pořádku, pokud:

1. Je tlačítko „Filtrovat“ vidět hned nad výpisem a ukazuje počet aktivních filtrů.
2. Vrstva má stále viditelné tlačítko pro potvrzení, ideálně s počtem výsledků („Zobrazit 48 produktů“).
3. Jde odejít bez změn a jednotlivé filtry jde snadno smazat.
4. Nejdůležitější filtry jsou dostupné i bez otevření vrstvy, například jako vodorovný pás rychlých voleb.

Baymard u samostatného filtračního rozhraní doporučuje výrazné a stále viditelné tlačítko pro potvrzení. Filtrace, která po každém ťuknutí přenačte celý výpis a posune stránku, je na mobilu frustrující. Víc k mobilu v článku Mobilní UX pro e-shopy.

Nezapomeňte na přístupnost: filtry musí jít ovládat klávesnicí, zaškrtávátka musí mít popisky a změnu počtu výsledků by měla oznámit i čtečka obrazovky.

Vyhledávání: co lidé opravdu píšou

Baymard rozlišuje několik typů dotazů. Pro e-shop jsou klíčové čtyři:

Pro česká data přidejte vlastní vrstvu. Lidé píšou bez diakritiky, v různých pádech („židli“, „židle“), hovorově („mikina s kapucí“ vs. „hoodie“) a s překlepy. Vyhledávání, které najde jen přesnou shodu s názvem produktu, tady selhává.

Co kontrolovat:

• Diakritika a skloňování. „zidle“ a „židli“ musí vrátit stejné výsledky jako „židle“.
• Synonyma a slang. Slovník synonym plňte z reálných dotazů, ne od stolu.
• Kódy a parametry. EAN, kód výrobce, rozměry.
• Filtry i ve výsledcích vyhledávání. Výsledky hledání jsou výpis jako každý jiný a potřebují filtry a řazení.

Když standardní fulltext platformy nestačí, přichází na řadu specializované nebo sémantické vyhledávání. Kdy to dává smysl, rozebíráme v článku AI sémantické vyhledávání na e-shopu.

Našeptávač a stránka bez výsledků

Nielsen Norman Group uvádí, že našeptávač byl dřív u vyhledávání na webu volitelný, dnes ho uživatelé čekají. Jeho úkol je ušetřit psaní a nasměrovat, ne jen doplnit pár písmen. Dobrý našeptávač:

• ukazuje kategorie i produkty s obrázkem a cenou,
• toleruje překlepy a chybějící diakritiku,
• nenabízí víc než zhruba deset návrhů,
• funguje stejně dobře na mobilu, kde nesmí zakrýt pole pro psaní.

Stránka bez výsledků je podle NN/g i Baymard místo s vysokým rizikem odchodu. Místo „Nic jsme nenašli“ nabídněte opravu dotazu, podobné výrazy, hlavní kategorie a kontakt. A pravidelně procházejte seznam dotazů bez výsledků. Je to nejlevnější zdroj informací o tom, co zákazníci hledají a nenacházejí.

Filtry a SEO

Každá kombinace filtrů může vytvořit novou URL. Z pár desítek parametrů tak vzniknou tisíce stránek, které vyhledávač prochází a které spotřebovávají crawl budget. Některé kombinace ale mají hodnotu i pro vyhledávání („pánské trekové boty Gore-Tex“). Rozhodnout, které indexovat a které ne, je samostatné téma. Podrobně ho řeší článek Faceted navigation a SEO. S UX filtrů to souvisí úzce, proto je dobré obojí navrhovat společně.

Jak na to prakticky: checklist filtrů a vyhledávání

• Má každá hlavní kategorie filtry podle vlastností, podle kterých se v ní rozhoduje?
• Jde filtrovat podle všech údajů, které ukazujete ve výpisu?
• Jsou nejdůležitější filtry vidět nad výpisem bez rozbalování?
• Ukazujete přehled použitých filtrů s možností jednotlivě i hromadně je zrušit?
• Funguje na mobilu stále viditelné tlačítko s počtem výsledků?
• Najde vyhledávání dotaz bez diakritiky, v jiném pádu a s překlepem?
• Vrací dotaz na typ produktu celou kategorii a ne náhodný mix?
• Nabízí stránka bez výsledků cestu dál?
• Procházíte jednou měsíčně dotazy bez výsledků a doplňujete synonyma?
• Máte vyřešené, které kombinace filtrů se indexují?

Kde začít? Změřte, kolik lidí používá vyhledávání a filtry a jak konvertují, a projděte top 50 dotazů ručně. Pokud chcete nezávislý pohled, v UX auditu filtry a vyhledávání testujeme na reálných úkolech a výstup máme hotový do 10 dnů. Když je problém v samotném vyhledávači, navazuje AI vyhledávání. Související téma struktury kategorií rozebírá článek Navigace a struktura kategorií.