Dotykové obrazovky fungují odlišně od klávesnic a myší
V prvních dnech navrhování webových stránek pro mobilní zařízení většina vývojářů rozdělila svou nabídku produktů. Oni vydali plně funkční verzi desktopu a pak "mobilní optimalizovanou" verzi, která oddělila mnoho značek a snímků, aby se přizpůsobily omezené kapacitě a rychlosti sítě telefonů s cukrovinkami a bezdrátových sítí 3G.
Současné smartphony však mohou vykreslovat webové stránky stejně efektivně jako stolní počítače prostřednictvím sítí, které jsou dobré nebo lepší než včerejší linky DSL.
Návrh pak konverguje zpět k jednomu uživatelskému rozhraní. Rizikem pro designéry však není to, že smartphone nebo tablet nedokáží poskytnout moderní webové stránky s citlivostí. Spíše je to, že metoda vstupu uživatele na dotykovém zařízení vyžaduje smysluplné změny základního návrhu webu. Dny vytvoření webové stránky za předpokladu, že návštěvníci mají klávesnici a myš jsou u konce.
Základní pravidla pro dotykový displej
Navrhování webového rozhraní s dotykovým displejem vyžaduje vývoj tradičního přístupu z minulosti, který je zaměřen na monitor a myš. Zejména je třeba se přizpůsobit interakci, jako jsou gesta, kohouty a multitouch vstup.
- Klepnutí není přesné. Pokud zákazník nemá prsty batole, dokonce s velmi přesnými ovládacími prvky softwaru, může být těžké klepnout a být přesný.
- Gesta se liší od kohoutků. Chcete-li procházet dlouhou stránku na dotykové obrazovce, uživatel posouvá jeden prst po okně prohlížeče. To se nemusí zdát významné, dokud si neuvědomíte, že procházíte myší, pohybujete myší dolů .
- Dvě (a více) prsty. Uživatel může používat více prstů na zařízení současně a řídit jej. Tyto dodatečné kohoutky mohou znamenat něco specifického v závislosti na operačním systému zařízení uživatele.
- Zařízení s vysokým oslněním. Obrazovky nejvíce dotykových tablet jsou vyrobeny z robustního skla. Tento materiál může být velmi těžké přečíst, s velkým oslněním, v situacích s jasným světlem. Navíc se všemi dotyky získávají otisky prstů a šmouhy na obrazovce, které mohou mít vliv na to, jak vypadají vaše stránky.
- Klávesnice na obrazovce. Zatímco někteří uživatelé mají bezdrátovou klávesnici, připojují se k tabletům, většina uživatelů tablet používá klávesnici na obrazovce pro zadávání dat. Vstup OSK může vést k nějakým veselým chybám, stejně jako k nepříjemnému používání po delší dobu.
Vzhledem k těmto vlastnostem zařízení by weboví návrháři měli zdůraznit několik základních zásad návrhu pro uživatele dotykové obrazovky:
- Neumísťujte položky, na které lze kliknout, příliš blízko sebe. Neexistuje žádné tvrdé a rychlé pravidlo, které by definovalo, jak blízko je příliš blízko, ale seznam odkazů, obzvláště v malé velikosti písma, může být obtížné procházet kliknutím (klepnutím) na tučný prst. Může to být nepříjemné, že se musíte přiblížit, jen zkusit a kliknout na odkaz. Tento princip platí i pro tlačítka a odkazy.
- Hierarchie mohou být těžko udržet otevřené. Jedna oblíbená forma dynamického menu používá JavaScript k otevření podnabídky, když uživatel klepne a podrží kurzor myši nad podnabídkou. Tyto stavy mohou být velmi obtížné nebo nemožné používat na dotykových obrazovkách, protože buď zůstávají otevřené, nebo se nebudou zavírat.
- Přesuňte odkazy a oblasti klepnutí mimo pravý okraj okna. Většina lidí má pravou ruku a má tendenci posouvat se na té straně obrazovky. Protože rolování probíhá pomocí gesta, někdy je možné omylem spustit přesunutí na odkaz. Uživatelé se mohou rozčarovat, pokud chtějí posunout stránku a místo toho skončit náhodným poklepáním na odkaz. Posunutím vazeb směrem od pravé strany jim můžete pomoci vyhnout se této nepříjemnosti.
- Neexistuje žádná myš. A to znamená, že neexistuje ukazatel myši . Neměli byste spoléhat na změnu ukazatele myši, což by mohlo znamenat, že je něco, na které lze kliknout.
- Styční body neexistují. Jako důsledek výše uvedeného, protože neexistuje žádná myš, není nic, na čem by se vznášel. Odkaz je buď klepnut (klepnut) nebo nikoli na dotykovém zařízení, takže uživatelé nemohou vyvodit žádné užitečné informace z takových stavů vznášení se jako změny barvy, tipy na nástroje nebo změny stavové lišty.
- Černé pozadí zvyšují oslnění. Místo s černým pozadím může být z důvodu oslnění velmi snadné číst na dotykovém zařízení. Černý způsobí, že otisky prstů na zařízeních se objeví jasněji a rozmazávají obrazovku. A černá může otočit obrazovku do zrcadla odrážejícího uživatele, že uživatelé často čelí víc než text na obrazovce.
- Dlouhé bloky textu ve formách jsou těžké psát. I když je možné psát celé romány na iPadu nebo tabletu se systémem Android nebo Windows, většina lidí nemá rád používání klávesnice na obrazovce pro dlouhé úseky textu. Čím více vašeho návrhu může být zadávání dat co nejkratší a snadnější, tím lépe.
Nejdůležitějším aspektem návrhu s dotykovými obrazovkami je otestovat vaše stránky na dotykovém zařízení . Zatímco je k dispozici řada emulátorů iPad a Android a spousta tablet Windows, stále neposkytují pocit dotykové obrazovky. Nemůžete říci, že odkazy jsou příliš blízko, nebo že tlačítka jsou příliš malá - nebo že oslnění způsobí, že je stránka příliš těžká na čtení - dokud se nedostanete do tabletu a nevyzkoušíte je dříve , než uvolníte nový návrh webových stránek.