Ota mikä tahansa lomake, jossa kävijää pyydetään valitsemaan vaihtoehto listasta, niin huomaat jotain. Lomake ei epäonnistu siksi, että se kysyy liikaa. Se epäonnistuu, koska kysymykselle on valittu väärä kenttätyyppi. Pudotusvalikko, vaikka valintanapit olisivat nopeammat. Valintaruudut, vaikka vain yksi vastaus on järkevä. Valintanapit, vaikka pudotusvalikko säästäisi puolet näytön tilasta.
Nämä eivät ole pieniä yksityiskohtia. Tutkimusten mukaan kenttätyypin valinta on yksi tärkeimmistä syistä, miksi kävijät keskeyttävät lomakkeen. Yksi väärä valinta pudotusvalikon, valintanapin ja valintaruudun välillä voi nostaa lomakkeen keskeytysastetta 15 % tai enemmän. Kävijä ei ole hämmentynyt siksi, ettei osaisi päättää. Hän on hämmentynyt, koska valitsemasi kenttätyyppi antaa väärän signaalin siitä, mitä lomake odottaa.
Tässä artikkelissa käydään läpi käytännön säännöt pudotusvalikon, valintanappien ja valintaruutujen valintaan. Opit, mikä kenttätyyppi toimii parhaiten eri tilanteissa, mitä kukin viestii kävijälle ja miten vältät virheet, jotka saavat kävijät keskeyttämään lomakkeen. Kun hallitset nämä päätökset, ymmärrät, miksi jotkin brändit saavat samalla lomakkeella huomattavasti korkeamman täyttöasteen vaihtamalla vain yhden kenttätyypin.
Miksi valitsemasi kenttätyyppi vaikuttaa lomakkeen täyttöön enemmän kuin useimmat tajuavat
Pudotusvalikko, valintanappi ja valintaruutu keräävät kaikki valinnan listasta. Pinnalta ne näyttävät vaihtokelpoisilta. Erot ovat hienovaraisia. Vaikutus ei ole.
Kun kävijä näkee pudotusvalikon, hän tietää, että vaihtoehtojen näkemiseen täytyy napsauttaa. Vaihtoehdot ovat piilossa, kunnes hän napsauttaa. Se vie ylimääräisen vaiheen. Kun hän näkee valintanapit, vaihtoehdot ovat heti näkyvissä. Hän voi silmäillä ne kaikki kerralla ja tehdä valintansa napsauttamatta ensin. Kun hän näkee valintaruudun, hän ymmärtää, että voi valita useita kohteita, ei vain yhtä.
Nämä erot muuttavat sitä, miten kävijät käyttävät lomakettasi. Ne muuttavat kognitiivista kuormitusta. Ne muuttavat sitä, kuinka nopeasti joku pystyy päättämään. Ne muuttavat sitä, tuntuuko lomake yksinkertaiselta vai ylivoimaiselta. Kun teet tämän oikein, harvempi keskeyttää lomakkeesi. Kun teet sen väärin, kävijät lähtevät, koska lomake ei tunnu intuitiiviselta, vaikka se teknisesti toimisi.
Pahin virhe on väärän kenttätyypin käyttö tilanteeseen. Pudotusvalikko kahdelle vaihtoehdolle tuntuu liialta. Valintanapit 15 vaihtoehdolle tuntuvat sotkuisilta ja ylivoimaisilta. Valintaruudut, kun kävijän pitäisi valita vain yksi vaihtoehto, aiheuttavat sekaannusta siitä, mitä hän voi valita. Jokainen väärä valinta maksaa konversioita.
Pudotusvalikot sopivat parhaiten pitkiin listoihin, joissa oletusarvolla ei ole väliä
Pudotusvalikko on kenttä, joka piilottaa vaihtoehdot, kunnes joku napsauttaa sen auki. Valinta on napsautuksen takana. Siksi pudotusvalikot sopivat täydellisesti yhteen tilanteeseen. Sinulla on paljon vaihtoehtoja ja näytön tila on tiukalla.
Käytä pudotusvalikkoa, kun vaihtoehtoja on yli seitsemän. Siinä vaiheessa kaikkien vaihtoehtojen näyttäminen valintanappeina tai valintaruutuina tekee lomakkeesta sotkuisen. Pudotusvalikko tiivistää kaikki vaihtoehdot yhteen kenttään, joka vie lähes yhtään pystytilaa. Siksi pudotusvalikot ovat vakiovalinta mobiililomakkeissa. Puhelimen näyttö on kapea. Pudotusvalikot säästävät tilaa.
Pudotusvalikot sopivat hyvin myös silloin, kun valinta on ilmeinen ja kävijällä on selvä vastaus mielessä. Ajattele maan tai osavaltion valintaa. Useimmat tietävät heti, minkä haluavat. He voivat kirjoittaa ensimmäisen kirjaimen hypätäkseen vaihtoehtoon tai napsauttaa ja vierittää löytääkseen sen. Vuorovaikutus on nopeaa, koska kysymys on helppo.
Pudotusvalikot epäonnistuvat kuitenkin tässä: kun kävijöiden täytyy verrata vaihtoehtoja ennen päätöstä. Kun lista on lajiteltu tavalla, jota kävijät eivät odota. Kun oletusarvoa ei ole ja kävijän täytyy napsauttaa vain nähdäkseen, mitä vaihtoehtoja on.
Esimerkki: lomake pyytää kävijää valitsemaan ruokatoiveen pudotusvalikosta. Vaihtoehdot ovat sekaisin (merenelävät, kasvisruoka, kana, naudanliha, vegaaninen, gluteeniton). Kävijä ei tiedä, mitä vaihtoehtoja on, ennen kuin napsauttaa. Kun hän napsauttaa ja näkee listan, hänen täytyy käydä kaikki läpi päättääkseen. Hän ei näe niitä kaikkia kerralla vertaillakseen. Se kestää kauemmin kuin jos vaihtoehdot olisivat näkyvillä valintanappeina. Käytettävyystutkimus osoittaa, että pudotusvalikot hidastavat päätöksentekoa, kun käyttäjän täytyy arvioida useita vaihtoehtoja.
Käytä pudotusvalikkoja, kun kävijät tietävät, mitä etsivät, ja vaihtoehtoja on paljon. Vältä niitä, kun kävijöiden täytyy verrata vaihtoehtoja tai kun valintoja on alle seitsemän.
Valintanapit sopivat, kun vaihtoehtoja on kahdesta viiteen
Valintanappi näyttää pyöreän ruudun jokaisen vaihtoehdon vieressä. Kun joku napsauttaa yhtä, muut poistuvat valinnasta automaattisesti. Kerrallaan voi valita vain yhden vaihtoehdon. Siksi niitä kutsutaan "radio"-painikkeiksi englanniksi, kuten vanhoissa autoradioissa, joissa uuden aseman painike vapautti edellisen.
Valintanapit toimivat erinomaisesti, kun kävijällä on selkeä, pieni joukko vaihtoehtoja. Jos lomake pyytää kävijää valitsemaan tilauspaketin ja tarjoat kolme tasoa, valintanapit ovat täydellinen valinta. Kävijä näkee kaikki kolme kerralla. Hän voi verrata hintoja, ominaisuuksia ja hyötyjä mielessään heti. Hän napsauttaa yhtä. Valmis. Ei piilotettuja vaihtoehtoja. Ei sekaannusta.
Valintanapit toimivat hyvin myös, kun yksi vaihtoehto on selvästi oletus tai suosituin. Kuvittele lomake, joka kysyy kävijöiltä, mistä he kuulivat brändistäsi. Tarjoat viisi vaihtoehtoa ja useimmat valitsevat "Google-haku". Kun valintanapit ovat näkyvillä, Googlella hakeneet näkevät vastauksensa heti ja napsauttavat sitä. Heidän ei tarvitse avata pudotusvalikkoa ja miettiä, onko heidän vastauksensa listalla.
Käytettävyystutkimus on selkeää. Kun vaihtoehdot ovat näkyvillä, ihmiset päättävät nopeammin. Kun ihmiset näkevät kaikki valinnat ilman ylimääräistä napsautusta, täyttöaste nousee. Siksi valintanapit toimivat pudotusvalikoita paremmin pienemmissä listoissa.
Valintanapit alkavat tuntua sotkuisilta noin viiden tai kuuden vaihtoehdon kohdalla. Kun vaihtoehtoja on yli seitsemän, lomake näyttää ylivoimaiselta. Jokainen valintanappi vie pystytilaa. Lomake, jossa on kahdeksan valintanappia kysymykselle "Mikä on pääasiallinen kiinnostuksesi?", näyttää paljon pidemmältä kuin tarpeen. Siinä vaiheessa pudotusvalikko on järkevämpi.
Käytä valintanappeja, kun vaihtoehtoja on kahdesta viiteen ja kävijät hyötyvät niiden vertailusta. Vältä niitä, kun vaihtoehtoja on yli seitsemän.
Valintaruudut ovat valintoihin, joissa useampi vastaus on oikein
Valintaruutu näyttää pieneltä neliöltä. Kun sitä napsautetaan, siihen tulee valintamerkki. Toisin kuin valintanappien, saman ryhmän useita valintaruutuja voi valita samaan aikaan. Tämä on keskeinen ero. Valintaruudut eivät ole vaihtoehtoja toisilleen. Ne ovat itsenäisiä valintoja.
Valintaruudut toimivat, kun kysymys sallii useamman vastauksen. Lomake, joka kysyy "Mitkä näistä ominaisuuksista kiinnostavat sinua?", käyttää valintaruutuja, koska kävijä voi valita tuoteanalytiikan, asiakaspalautteen ja automaatiointegraation kaikki kerralla. Jokainen valintaruutu on oma itsenäinen valintansa, ei vaihtoehto muille.
Valintaruudut toimivat myös hyväksymislauseisiin. "Hyväksyn käyttöehdot" on valintaruutu, koska se on kyllä tai ei -väittämä. Kävijä joko hyväksyy tai ei. Samoin "Lähettäkää minulle sähköpostipäivityksiä" on yksittäinen valintaruutu, koska se edustaa yhtä valintaa.
Sekaannus syntyy, kun valintaruutuja käytetään siellä, missä pitäisi käyttää valintanappeja, tai päinvastoin. Lomake, joka kysyy "Minkä paketin haluat?", ei saisi käyttää valintaruutuja. Kukaan ei voi haluta kaikkia kolmea pakettia. Valinnat sulkevat toisensa pois. Tässä oikea ratkaisu on valintanapit.
Valintaruuduissa on sama ryhmittymisongelma kuin valintanapeissa. Yli seitsemän tai kahdeksan valintaruutua yhdessä ryhmässä tekee lomakkeesta ylivoimaisen. Visuaalisesti monet valintaruudut näyttävät paljolta työltä, vaikka kävijän tarvitsisi valita vain yksi tai kaksi kohtaa.
Käytä valintaruutuja vain, kun kävijät voivat perustellusti valita useita vaihtoehtoja samaan aikaan. Vältä niitä yhden vastauksen kysymyksissä ja ryhmittele suuret määrät valintaruutuja pienempiin, toisiinsa liittyviin luokkiin.
Miten päätät, kun et ole varma kenttätyypistä
Päätös on usein selvä. Joskus kysymys on kuitenkin harmaalla alueella. Sinulla on viisi vaihtoehtoa etkä ole varma, tuntuuko valintanapit vai pudotusvalikko oikealta. Tässä päätöspuu, joka toimii.
Vaihe 1. Voiko kävijä valita useamman kuin yhden vastauksen? Jos kyllä, käytä valintaruutuja. Jos ei, siirry vaiheeseen kaksi.
Vaihe 2. Montako vaihtoehtoa on? Alle kuusi vaihtoehtoa, siirry vaiheeseen kolme. Yli seitsemän vaihtoehtoa, käytä pudotusvalikkoa.
Vaihe 3. Tarvitseeko kävijän verrata vaihtoehtoja päättääkseen? Jos kyllä, käytä valintanappeja, jotta kaikki vaihtoehdot ovat näkyvillä kerralla. Jos ei ja vastaus on ilmeinen, joko valintanapit tai pudotusvalikko toimii, mutta valintanapit ovat hieman nopeammat.
Tämä yksinkertainen päätöspuu ratkaisee 90 % kenttätyyppikysymyksistä, joita lomakkeita suunnitellessa tulee eteen. Niissä tapauksissa, joissa olet silti epävarma, testaa molempia vaihtoehtoja oikeilla kävijöillä. Aja lomakettasi viikon valintanapeilla ja mittaa täyttöaste. Vaihda pudotusvalikkoon, aja toinen viikko ja vertaa. Kävijöiden oikea data voittaa minkä tahansa suunnittelusäännön, koska juuri kävijäsi täyttävät lomakkeesi.
Yleisiä virheitä, jotka laskevat täyttöastetta ilman että kukaan tajuaa syytä
Ensimmäinen virhe on pudotusvalikon käyttö kahdelle tai kolmelle vaihtoehdolle. Näin käy useammin kuin luulisi. Lomake kysyy "Miten löysit meidät?" ja vaihtoehdot ovat "Hakukone", "Sosiaalinen media" ja "Suositus". Pudotusvalikko piilottaa nämä vaihtoehdot. Kävijän täytyy napsauttaa pudotusvalikkoa nähdäkseen vaihtoehdot. Hän ei tiedä, mitä vaihtoehtoja on, ennen kuin napsauttaa. Tämä lisää kitkaa turhaan. Valintanapit ovat tässä nopeampia ja tuntuvat intuitiivisemmilta.
Toinen virhe on kahdeksan tai yhdeksän valintanapin näyttäminen, kun pudotusvalikko veisi kymmenesosan näytön tilasta. Lomake pyytää kävijää valitsemaan maansa 195 maan listasta. Valintanapit vierittyisivät loputtomiin. Pudotusvalikko, jossa on automaattitäydennyshaku, ratkaisee tämän heti. Jotkin suunnittelijat pitäytyvät valintanapeissa, koska ne tuntuvat intuitiivisemmilta, tajuamatta, että intuitiivisuus katoaa, kun 50 vaihtoehtoa pitää vierittää läpi.
Kolmas virhe on valintaruutujen käyttö yhden vastauksen kysymyksessä. Lomake kysyy "Mikä on tilaustasosi?" ja näyttää kolme valintaruutua, yhden jokaiselle paketille. Kävijät hämmentyvät. Voivatko he valita kaikki kolme? Valintaruutu antaa väärän signaalin. Valintanapit ovat selvempiä, koska ne viestivät visuaalisesti, että vain yksi voidaan valita.
Neljäs virhe on se, ettei anneta selkeitä ohjeita siitä, mitä kenttä tarkoittaa. Valintaruuturyhmä näkyy otsikolla "Kiinnostuksen kohteet" ilman selitystä. Kävijä ei tiedä, pitääkö valita vain yksi vai niin monta kuin sopii. Kun on epäselvyyttä, täyttöaste laskee. Selkeät nimet korjaavat tämän. "Valitse kaikki sopivat" tai "Valitse yksi" kertoo kävijälle tarkalleen, mitä kenttä odottaa.
Viides virhe on oletusarvojen väärä käyttö. Pudotusvalikko, jonka oletuksena on "Valitse vaihtoehto", tuntuu rikkinäiseltä. Pudotusvalikko, jonka oletuksena on "Yhdysvallat", tuntuu hyödylliseltä, jos suurin osa kävijöistä on sieltä. Valintanapit, joissa mitään ei ole valittu valmiiksi, pakottavat kävijän napsauttamaan yhtä. Valintanapit, joissa yleisin vastaus on valittu valmiiksi, säästävät kävijältä napsautuksen. Nämä pienet oletukset kertautuvat koko lomakkeessa.
Mobiilin huomioiminen muuttaa kenttätyypin valintaa
Matkapuhelimet ovat pienempiä. Se muuttaa kenttätyypin valintaa merkittävästi.
Työpöydällä kolme valintanappia yksinkertaiseen valintaan tuntuu luontevalta ja nopealta. Mobiilissa samat kolme valintanappia on pinottu pystysuunnassa ja vievät enemmän tilaa kuin pudotusvalikko. Päätös voi kääntyä.
Mobiilikävijät myös käyttävät lomaketta eri tavalla. He napauttavat peukaloilla, eivät tarkoilla hiirenklikkauksilla. 44 x 44 pikselin valintaruutu on pienin mukava koko. Pienemmän napauttaminen tarkasti on vaikeaa. Valintanappien ja valintaruutujen ympärillä täytyy olla riittävästi tilaa, jotta yhden napauttaminen ei vahingossa osu viereiseen vaihtoehtoon.
Mobiilissa pudotusvalikot hoitaa yleensä laitteen oma valintavalikko. Kun kävijä napauttaa pudotusvalikkoa älypuhelimella, hän näkee mobiiliin optimoidun valitsimen. Se on usein nopeampi ja mukavampi kuin pitkän listan vierittäminen itse sivulla.
Mobiililomakkeissa pudotusvalikot muuttuvat houkuttelevammiksi, kun näytön tila käy kalliiksi. Valintanapit ovat edelleen hyviä kahdelle tai neljälle vaihtoehdolle, koska ne ovat nopeita napauttaa. Kuusi vaihtoehtoa valintanappeina tuntuu kuitenkin vierittämiseltä. Samat kuusi vaihtoehtoa pudotusvalikossa tuntuvat siistimmiltä ja nopeammilta puhelimella.
Testaa lomakkeesi mobiilissa. Päätös, joka tuntui oikealta työpöydällä, voi tuntua erilaiselta, kun joku täyttää lomakettasi nelituumaisella puhelimen näytöllä.
Saavutettavuusvaatimukset, jotka jokaisen kenttätyypin täytyy täyttää
Pudotusvalikoiden, valintanappien ja valintaruutujen täytyy kaikkien täyttää saavutettavuusstandardit, jotta ruudunlukijoita tai näppäimistönavigointia käyttävät voivat täyttää lomakkeesi onnistuneesti.
Jokaiselle valintanappi- tai valintaruuturyhmälle tarvitaan ryhmän otsikko (fieldset), joka selittää, mihin ryhmä on tarkoitettu. Kun ruudunlukijan käyttäjä siirtyy ryhmään sarkaimella, hän kuulee otsikon ja ymmärtää, mistä hän valitsee. Ilman sitä hän kuulee vain "Valintanappi yksi, valintanappi kaksi" ilman asiayhteyttä.
Jokaisella yksittäisellä vaihtoehdolla täytyy olla näkyvä, napsautettava nimi, ei pelkkä pieni valintanappi tai valintaruutu. Kun kävijän täytyy napsauttaa täsmälleen valintaruudun neliötä valitakseen sen, vähemmän tarkan motoriikan omaavilla on vaikeuksia. Kun voi napsauttaa valintaruudun vieressä olevaa nimeä, valinta helpottuu kaikilta. Tämä ei ole saavutettavuusominaisuus vain vammaisille. Se helpottaa lomakkeita kaikille.
Myös pudotusvalikot tarvitsevat selkeän nimen. Nimen pitäisi olla pudotusvalikkokentän yläpuolella tai vasemmalla puolella. Valittuna olevan vaihtoehdon pitäisi aina näkyä suljetussa pudotusvalikossa. Kun pudotusvalikko sulkeutuu valinnan jälkeen ja näyttää valitun arvon, kävijä tietää, että hänen valintansa tallentui.
Näppäimistön käyttäjien täytyy päästä lomakkeessa eteenpäin sarkain- ja nuolinäppäimillä. Valintanappien pitäisi sallia nuolinäppäimillä liikkuminen vaihtoehtojen välillä. Valintaruudut pitäisi voida valita välilyönnillä. Pudotusvalikoiden pitäisi avautua ja sulkeutua näppäinkomennoilla. Jos lomakkeesi vaatii hiiren napsautuksen mihin tahansa näistä, näppäimistön käyttäjät joutuvat esteeseen.
Pelkkä väri ei saa ilmaista valittua tilaa. Pudotusvalikko, jossa korostettu vaihtoehto käyttää väriä näyttämään valinnan. Se on hyödyllistä. Käyttäjien, jotka eivät erota värejä, pitäisi kuitenkin myös pystyä näkemään, mikä on valittuna, valintamerkin, kuvakkeen tai muun visuaalisen merkin avulla, joka ei riipu pelkästä väristä.
Miten lomakkeen kenttätyypit vaikuttavat brändikuvaan
Valitsemasi kenttätyyppi viestii kävijälle, kuinka hyvin ymmärrät häntä.
Pudotusvalikko kahdelle tai kolmelle vaihtoehdolle viestii, ettei lomakkeen suunnitellut ajatellut paljon käyttökokemusta. Se lisää turhan napsautuksen. Kävijä huomaa tämän. Se tuntuu kitkalta.
Valintanapit siellä, missä pudotusvalikko säästäisi puolet lomakkeen pituudesta, viestii samaa. Lomake tuntuu huonosti suunnitellulta.
Lomake, jossa käyttökokemus on selvästi mietitty, nopeat valinnat tuntuvat ilmeisiltä ja useat valinnat selviltä, viestii jotain muuta. Se viestii, että brändi välittää kävijän ajasta. Se viestii, että joku on miettinyt lomakkeen huolella. Tämä ei ole vain parempaa käytettävyyttä. Se on parempi brändikuva.
Tällaiset pienet päätökset kertautuvat. Kävijä täyttää lomakkeesi ja jokainen kenttä tuntuu intuitiiviselta. Hän valmistuu odotettua nopeammin. Hän tuntee olonsa hyväksi vuorovaikutuksen jälkeen. Se tunne siirtyy siihen, miten hän näkee brändisi.