Mobilní webdesign: 10 tipů pro lepší použitelnost

Při procházení mobilních webů uživatelé očekávají především jednoduchost. Náročnost na mobilní weby roste s šířícím se trendem chytrých mobilních telefonů a tabletů. Mít použitelný web nejen pro PC, ale i pro smartphony a tablety tak může být velkou konkurenční výhodou. Webová architektura pro mobilní zařízení musí být jednodušší, než pro běžné webové stránky. 

Při tvorbě webu pro mobilní zařízení je potřeba brát v úvahu, že byste měli zobrazovat jen ten nejnutnější obsah, který však bude zajímavý pro vaše mobilní uživatele. Vyvarujte se velkým obrázkům i flashovým animacím – funkčnost je v tuto chvíli důležitější než vzhled. Zvažujete-li vytvoření webu, který bude optimalizovaný pro mobilní telefony a tablety, nebo vytvoření mobilní verze vašeho aktuálního webu, měli byste dbát na použitelnost a rozvržení prvků tak, aby se uživatelům mobilní web dobře používal.

Pomůžeme vám vytvořit stránky, které budou přístupné nejen na stolních počítačích, ale i mobilních zařízeních. Co tedy zvažovat, na co se zaměřit, co můžete ignorovat a co rozhodně neopomenout?

1. Rozlišení obrazovky

V mobilním světě se vyskytuje nespočet variací a designů telefonů a tabletů s různými velikostmi displejů. Cestou je nalézt řešení, které se bude zobrazovat konzistentně na všech zařízeních. Vývojáři hledají způsoby jak vyhodnotit, které rozlišení displeje je nejpoužívanější a podle toho vytvářejí svoje mobilní aplikace. Při vytváření webu, který se přizpůsobuje všem zařízením, je možnost využít responsive webdesignu. Zde je seznam rozlišení obrazovek na mobilních zařízeních k únoru 2011 zveřejněné uxbooth.com.

2. Rozdělení webových stránek na menší části

Dlouhé texty mohou být pro uživatele nepoužitelné při zobrazení ve sloupcích. Držte se jednoho sloupce textu, který případně obtéká obrázky, ale tak aby nedocházelo k horizontálnímu rolování.

3. Zjednodušený návrh webu

Jednoduchost rovná se použitelnost. Vyhněte se tabulkám, rámům a jiným druhům formátování. Používáte-li odsazení, pamatujte, že minimální vzdálenost je nižší než u běžných stránek. Je potřeba pamatovat, že uživatelé po klinknutí na odkaz v mobilním webu nechtějí příliš dlouho čekat, očekávají dokonce, že se jim mobilní web načte rychleji, než u běžného webu. Musíte tedy počítat s co nejjednodušším variantou, kde bude vyvážen obsah, grafika i navigace.

4. Možnost zobrazení originálu webu

Poskytněte uživatelům odkaz na full verzi vašich webových stránek, kde najdou další obsah a funkcionality.

5. Umístění navigace

Zjistěte si, jaké stránky webu vaši návštěvníci používají nejčastěji. Vytvořte navigační menu mobilního webu právě dle analýz webu pro standardní rozlišení. Vaši uživatelé mobilní verze webu se na stránkách chtějí pohybovat rychle. Není potřeba jim zobrazovat dlouhé obsahy, stačí je jen rychle dovést k obsahu, který hledají.

6. Používání odkazů

Webové stránky mívají různá zpracování odkazů např. v hlavním navigačním menu pomocí java skriptu. Mobilní prohlížeče však tyto druhy odkazů nemají moc rády. Je potřeba si uvědomit, že dynamické prvky stránky a grafické odkazy ovlivňují množství stažených dat.

7. Rozlišení důležitosti odkazu

Uživatelé při pohybu na mobilním webu mohou nabít dojmu jednotnosti odkazů. Zobrazujte uživatelům odkazy dle důležitosti. Odkazy můžete odlišit jak velikostí písma, nebo barvou pozadí tlačítek, případně přidáním grafiky kolem odkazu.

8. Vyvážení odkazů a obsahu

Každá znovu načtená stránka bere čas a stažená data. Při vytváření informační architektury mobilního webu se snažte, aby se uživatel dostal co nejrychleji k požadované informaci. Je tedy potřeba nalézt rovnováhu mezi počtem odkazů na každé stránce a kam vede.

9. Snižování nutnosti zadávat text

Pamatujte, že mobilní telefony nemají možnost přístupu k běžné klávesnici a myši. Nahrazujte pole pro vkládání textu radio buttony a select boxy. Využívejte pro stránky zkrácené URL odkazy pro snadnější zadávání do mobilních prohlížečů.

10. Pop-up okna

Webové mobilní prohlížeče obvykle nepodporují pop-up okna. K zobrazení pop-up okna má prohlížeč omezený prostor. Vyhněte se jejich používání, abyste zabránili nežádoucímu chování.

Co říci závěrem?

Buďte kreativní a nechte si navrhnout mobilní web novým způsobem. Vytvořte dostatečně přesvědčivý a použitelný obsah. Dejte uživatelům, co chtějí a kdy to chtějí. 

Kontaktní formulář

Newsletter