Nielsen Norman Group přišli v článku „Date-Input Form Fields: UX Design Guidelines“ se stručnými tipy, jak z pohledu uživatelského vylepšit vstup data.

Vybral jsem pro vás ty nejzajímavější:

  1. Hlašte chyby způsobem, který pomáhá. Například „Chybný formát data“ nepomůže. „Datum prosím vložte ve formátu den. měsíc. rok.“ je už lepší.
  2. Odstraňte nelogické volby data. Například data narození před 130 lety a o podobně.
  3. Zachovejte práci uživatelů. Pokud udělá chybu a vy mu ještě vymažete formulář, asi vám uteče. Uživatelský vstup dejte třeba do uložiště prohlížeče.
  4. Snažte se vyhnout rozbalovacím nabídkám (<select>). Obzvlášť, pokud je dělíte na tři pro měsíc, den a rok. Pro uživatele to je fakt hodně zbytečných kroků.
  5. Pokud má uživatel jen omezený počet možností pro výběr datumu, vypište jen je a žádné jiné.
  6. Nevyžadujte, aby uživatelé museli vkládat speciální znaky. Například lomítka nebo pomlčky v mezinárodních formátech.

V článku pak kromě toho najdete i pomoc s výběrem s pravného návrhového vzoru.

Související:

  • O nativním vstupu data (<input type="date">) technicky píše JeČas.cz.
  • Firefox konečně ohlásil blížící se podporu nativního vstupu data (Can I Use). Takže jediný aktuální prohlížeč, který to nebude umět je desktopové Safari. To má ale na trhu v Česku jen malinký podíl.
  • Peter-Paul Koch v článku „Making input type=date complicated“ situaci s nativním vstupem data shrnuje a podivuje se, proč ho ještě webaři běžně nepoužívají. Zároveň přiznává, že s ním problémy jsou. Já si ale myslím, že přišel čas to zase začít zkoušet.

Komentáře

comments powered by Disqus

Podobné články

zařazené v kategoriích HTML, Netechnické.

Zanikající část webařiny: obyčejné weby a CMS na míru

23. 7. 2017 na blogu

Pokud vyvíjíte vlastní řešení na míru každému klientovi za desítky tisíc korun, zpozorněte, protože v mnoha případech to přestalo dávat smysl.

Vydal jsem novou knihu: „Vzhůru do (responzivního) webdesignu“

„Vzhůru do (responzivního) webdesignu“

Kniha „Vzhůru do (responzivního) webdesignu“
Jak navrhovat a implementovat responzivní UI?

Více informací