Formuláře: Zásady pro návrh fungujících formů

a proto musí být vyladěný tak, aby nebránil oběma stranám v tom, co potřebují, ale aby jim naopak tento proces zjednodušil. Proto je třeba se nad jejich návrhem dobře zamyslet. 

Proč vůbec ztrácet čas s takovou obyčejnou věcí?

• Špatný formulář uživatele naštve, ten následně odejde.
• Špatný formulář může uživatele zmást, ten následně odejde.
• Špatný formulář snižuje zisky našim klientům.

 Představte si klasickou situaci na internetových stránkách. Co práce nám dá přesvědčit návštěvníka, že právě ten náš produkt (navlas stejný jako stovky dalších produktů od konkurence) je ten nejlepší a ten jediný, který si má uživatel koupit. Přesvědčíme ho, že produkt opravdu CHCE, že se na něj dokonce strašně těší, je nedočkavý, až mu domů dorazí krabička s jeho novou modlou. Pracně ho přesvědčíme, aby stiskl tlačítko „Objednat”, a co se nestane? Něco se nepovede a uživatel odejde kvůli špatnému formuláři.

Čeho se při návrhu vyvarovat?

• Mnoha zbytečných údajů, které po uživatelích chceme.
• Položkám formuláře, které nejsou zorganizovány.
• Položkám formuláře, které nejsou uspořádány.

Jak navrhnout dobrý formulář?

• Chtějte po uživatelích jen nezbytně nutné informace.
• Zarovnávejte text i formulářová pole do sloupců.
• Informujte uživatele o tom, v jakém stavu se formulář nachází.
• V případě chyby ponechte vyplněna všechna pole (i ta špatně zadaná).
• Pokud se jedná o formulář typu kalkulačky nebo konfigurátoru, měl by mít nastavené takové implicitní hodnoty, aby uživatel korektně prošel celým formulářem bez vyplnění jediné hodnoty. Uživatel v tomto případě potřebuje vědět, co jsou „normální” hodnoty a napoprvé si form jen otestuje. Teprve poté je ochotný u něj strávit delší čas.
• Zvýrazněte hlavní tlačítko ("Pokračovat v nákupu", "Odeslat") oproti ostatním tlačítkům.
• Informujte uživatele o tom, co se stane po odeslání.
• Shrňte vše do emailu, který uživateli pošlete na uvedenou adresu.
• Označujte viditelně a srozumitelně povinné údaje.
• Vysvětlujte důkladně význam málo zřejmých položek. Související položky rozdělte do skupin.
• Používejte dostatečnou velikost fontů a formulářových polí.
• Napovězte korektní formát dat, která od uživatele chcete (např. datum, adresu).
• Pozor na zvýrazňování.
  • Červenou barvu používejte pouze pro zvýraznění chyb. Jinde ne. Červenou barvu má uživatel spojenou s upozorňovacím textem.
  • Povinné informace zvýrazňujte pomocí standardních metod, neexperimentujte.
    • Když je všechno povinné, nemusíte označovat (jen někde oznamte, že je všechno povinné).
    • Tučné písmo.
    • Hvězdička.
    • Vytvořit dvě viditelně oddělené skupiny údajů (povinné, nepovinné).
  • Informační a nápovědné texty.
    • Ikona otazníku.
    • Kurzíva.
    • Menší velikost písma v nápovědném prostoru.
    • Menší šedivé písmo pod daným polem (jako nejposlednější možnost, zhoršuje to přehlednost formu).

Vychytávky, které hodně pomůžou

• Kontrolujte údaje v reálném čase a nabízejte uživatelům okamžitou odezvu o správnosti vyplněných údajů.
• Dovolte uživatelům vyplňovat infromace v různých formátech. Často nečtou nápovědné texty.
  • Když potřebujete desetinné číslo, umožněte použití desetinné čárky i desetinné tečky.
  • U telefonního čísla umožněte formát s „+420” i bez něj. Dále umožněte psaní mezer mezi číslicemi, pokud je někdo z uživatelů zvyklý psát telefonní číslo po trojicích či dvojicích.
• Při špatně vyplněných údajích nabídněte alternativu, která bude korektní. Oznamte to co nejdříve uživateli.
  • Chcete údaj zaokrouhlený na desítky a uživatel zadal 55,32? Nejedná se o uživatelovu chybu, údaj stačí zaokrouhlit automaticky na 60. Jedná se o vaši chybu, pokud takový případ neošetříte a neopravíte.
• Zapamatujte si vyplněné údaje na delší dobu (cca na 14 dní) do Cookies. Uživatelé se často vracejí na stránky třeba po týdnu a dokončí objednávkový proces.

Každé pole musí mít smysl

Při návrhu formuláře by každá požadovaná informace měla projít testem. Pokud neprojde, je zbytečné se na ni ptát. Výsledkem bude zjednodušený formulář, čímž zvýšíme počet uživatelů, kteří ho použijí. Jak zjistit, že je dané pole nezbytné? Zkuste následující postup.

Testovací otázky

• Kdo použije informaci?
• K čemu ji použije?
  • Typicky špatná odpověď: „Tohle bychom někdy v budoucnu mohli potřebovat”.
  • Nepotřebujete informaci dnes, ale možná někdy v budoucnu? Odstraňte ji z formuláře.
• Je poskytnutí informace povinné?
  • Pokud je povinná, co se stane, když uživatel vyplní chybné údaje, jen aby se dostal přes políčko vyplňování?

Vyhodnocení otázek

• Po zodpovězení otázek vyřadit ty, které jsou nadbytečné.

Důsledky ponechání zbytečných formulářových polí

• Pro uživatele
  • Mnoho otázek:
    • Uživatel odejde
    • Menší konverze, menší prodeje, méně blbých dotazů. Pokud je to form s žádostí o informace, zvýší se náklady na provoz neinternetových kanálů (telefon, pošta apod.)
  • Nedůležité otázky:
    • Uživatel odejde
    • Uživatel zadá nesprávné informace
    • Místo skutečného jména uživatelé vyplňují Jára Cimrman, který bydlí v Praha 1, Václavské náměstí? Tato data se musí vyčistit, nemají žádnou vypovídající hodnotu, přidají ve výsledku více práce a žádný užitek.
  • Osobní otázky bez důvodu:
    • Uživatel odejde
    • Uživatel zadá nesprávné informace
    • Náklady na čištění dat, menší konverze apod.
  • Naštvaný uživatel
    • I když se uživatel prokouše spoustou zbytečných otázek a udělá to, co chcete, bude podrážděný, že vám dal více času, než musel nebo než si zasloužíte.
• Pro klienta
  • Náklady na uložení dalšího údaje
  • Čas na vytvoření každého políčka ve formu

Závěrem

Na internetu jsou kvanta různých formů k vyplnění. Pokud máte čas, pár si jich vyplňte a sledujte, jak reagují. Na špatných příkladech si nejlépe uvědomíte, které kroky Vás otravují a které Vám naopak připadají důležité. Na základě takových poznatků se i my snažíme navrhovat formuláře, které se zbytečných chyb vyvarují.

Další články autora:

2