Kysy yrittäjältä, mitä hän odottaa hyvältä verkkosivustolta, ja kuulet selkeästä ulkoasusta, nopeasta latautumisesta ja helposta navigoinnista. Harvoin mainitaan sitä, löytävätkö kävijät oikeasti tarvitsemansa ja saavatko he tehtyä sen, mitä varten tulivat. UX-suunnittelu on ala, joka vastaa tähän kysymykseen, ja se on ominaisuus, joka tekee kaikista muista merkityksellisiä.
UX-suunnittelu eli käyttökokemuksen suunnittelu (user experience design) on verkkosivustojen suunnittelua sen mukaan, miten ihmiset niitä käyttävät. Mitä UX-suunnittelu on yrityssivustolle? Se on joukko päätöksiä, jotka ratkaisevat, voiko kävijä löytää etsimänsä, suorittaa toiminnon, jonka vuoksi tuli, ja poistua selkeän käsityksen kanssa siitä, mitä yritys tarjoaa.
Verkkosivusto voi olla visuaalisesti viimeistelty ja silti huonosti UX:ltään. Kävijä, joka ei kymmenessä sekunnissa etusivulle saapumisestaan ymmärrä, mitä yritys tekee, joka eksyy etsiessään hintasivua tai joka hylkää yhteydenottolomakkeen, koska virheilmoitukset eivät selitä, mikä meni pieleen, kokee huonon käyttökokemuksen. Sivun visuaalinen laatu on tämän lopputuloksen kannalta merkityksetöntä.
Mitä eroa on UX-suunnittelulla ja UI-suunnittelulla?
UX-suunnittelu ja UI-suunnittelu ovat toisiinsa liittyviä mutta erillisiä. UI-suunnittelu eli käyttöliittymäsuunnittelu (user interface design) kattaa visuaalisen kerroksen. Värit, typografia, painikkeet, kuvakkeet ja sivun yleisilme ovat kaikki UI-päätöksiä. UX-suunnittelu kattaa käyttäytymiskerroksen. Se, miten tieto on järjestetty, miten navigointi etenee, mitä tapahtuu, kun käyttäjä tekee virheen, ja onko sivun tärkein toiminto heti ilmeinen, ovat kaikki UX-päätöksiä.
Käytännössä nämä kaksi menevät päällekkäin. Painike, jonka väri on väärä visuaalisessa hierarkiassa, on UI-ongelma, joka luo UX-ongelman. Lomake, joka on asetettu loogisesti mutta jossa ei ole virheopastusta, on UX-ongelma, jonka UI-suunnittelija saattaa huomata. Pienissä tiimeissä ja sivustorakentimissa yksi ihminen hoitaa usein molemmat. Ero on tärkeä, koska ne vaativat erilaista ajattelua: UI kysyy "näyttääkö tämä oikealta?" ja UX kysyy "toimiiko tämä sitä käyttävälle ihmiselle?"
Artikkeli mitä web-suunnittelu on käsittelee laajempaa alaa, jonka sisällä sekä UX- että UI-suunnittelu ovat, mukaan lukien se, miten visuaaliset ja rakenteelliset päätökset yhdessä muovaavat kävijäkokemusta.
Mitkä ovat UX-suunnittelun perusperiaatteet?
UX-suunnittelua ohjaa joukko periaatteita, jotka pätevät kaikentyyppisille verkkosivustoille toimialasta tai koosta riippumatta.
Käytettävyys
Käytettävä verkkosivusto antaa kävijöiden suorittaa tehtäviä tehokkaasti sekaannuksetta. Navigointinimikkeet käyttävät sanoja, joita kävijät odottavat. Tärkeille sivuille pääsee kahdella tai kolmella klikkauksella. Vuorovaikutteiset elementit, kuten painikkeet ja lomakkeet, käyttäytyvät ennustettavasti. Käytettävyys ei tarkoita sivuston tekemistä niin yksinkertaiseksi, että se on karu. Kyse on kitkan poistamisesta polulta kohti lopputulosta, jonka kävijä haluaa.
Selkeys
Selkeys tarkoittaa, että jokainen sivu viestii tarkoituksensa heti. Kävijän pitäisi ymmärtää sekunneissa, mistä sivu kertoo, mitä siellä voi tehdä ja mikä on seuraava askel. Sivut, jotka hautaavat tärkeimmän tiedon tiheiden kappaleiden alle tai käyttävät monitulkintaisia otsikoita ja epämääräisiä toimintakehotteita, epäonnistuvat selkeydessä riippumatta siitä, kuinka hyvin ne on visuaalisesti suunniteltu. Artikkeli mitä visuaalinen hierarkia on selittää, miten sivun elementtien järjestys ja paino muokkaavat sitä, mitä kävijät ymmärtävät ensin.
Johdonmukaisuus
Johdonmukainen suunnittelu tarkoittaa, että kävijöiden tarvitsee oppia sivuston toiminta vain kerran. Jos ensisijainen toimintakehotepainike on sininen etusivulla, sen pitäisi olla sininen kaikkialla. Jos navigointi on työpöydällä sivun yläosassa, sen pitäisi olla tavoitettavissa samasta paikasta jokaisella sivulla. Epäjohdonmukaisuus rikkoo mentaalisen mallin, jonka kävijät rakentavat liikkuessaan sivustolla, ja aiheuttaa sekaannusta juuri niinä hetkinä, kun selkeä polku eteenpäin on tärkeintä.
Palaute
Käyttäjien täytyy tietää, että heidän toimintonsa on rekisteröity. Painike, joka ei näytä muutosta klikattaessa, lomake, joka lähetetään ilman vahvistusta, tai hakukenttä, joka palauttaa tuloksia ilman merkintää siitä, mitä haettiin, luovat kaikki epävarmuutta. Palaute voi olla yhtä yksinkertaista kuin painikkeen värin muutos osoittimen alla, latauskuvake lomakkeen lähetyksen aikana tai vahvistusviesti onnistuneen toiminnon jälkeen. Ilman sitä kävijät eivät tiedä, pitäisikö odottaa, yrittää uudelleen vai olettaa, että jokin meni pieleen.
Virheistä toipuminen
Käyttäjät tekevät virheitä. Hyvä UX ennakoi ne ja tekee toipumisesta helppoa. Lomakkeen validointi, joka tunnistaa tietyn ongelmallisen kentän ja selittää, millainen oikea muoto on, on parempi kuin yleinen "jokin meni pieleen" -viesti. Haku, joka ei tuota tuloksia mutta ehdottaa vaihtoehtoja, on parempi kuin umpikuja. Mitä helpompaa virheestä on toipua, sitä epätodennäköisemmin kävijä hylkää tehtävän kokonaan.
Miten UX-suunnittelu vaikuttaa liiketoiminnan tuloksiin?
UX-suunnittelulla on suora yhteys tuloksiin, joista yritykset välittävät. Kävijä, joka löytää hintasivun nopeasti, päätyy todennäköisemmin ostopäätökseen. Kassaprosessi, jossa on mahdollisimman vähän vaiheita ja selkeät virheilmoitukset, konvertoi enemmän kävijöitä kuin sellainen, jossa täytyy arvailla. Yhteydenottolomake, jonka täyttäminen on helppoa, saa enemmän lähetyksiä kuin sekava tai aikaa vievä.
UX:n ja konversioasteiden välinen suhde on hyvin dokumentoitu. Pienet parannukset sivun selkeyteen, lomakkeen suunnitteluun ja navigoinnin kulkuun tuottavat mitattavia lisäyksiä niiden kävijöiden osuuteen, jotka tekevät tavoitellun toiminnon. Päinvastainen pätee yhtä lailla. Sivu, jolla ensisijaista toimintakehotetta on vaikea löytää, jolla arvolupaukseen pääsee kolmen kappaleen jälkeen tai jonka mobiiliasettelu romahtaa käyttökelvottomaksi, menettää konversioita jokaisessa vaiheessa.
UX vaikuttaa myös siihen, miten kävijät mieltävät sivuston takana olevan yrityksen. Hyvin toimiva verkkosivusto tuntuu ammattimaiselta ja luotettavalta. Verkkosivusto, jonka toimintapolut ovat rikki, navigointi sekava ja viestintä epäselvää, viestii huolimattomuudesta riippumatta siitä, miten muu yritys toimii. Artikkeli miten suunnittelet toimivan etusivun käsittelee tärkeimmät UX-päätökset sivulla, jonka kävijät näkevät ensimmäisenä.
Mitkä ovat yleisimmät UX-ongelmat yrityssivustoilla?
Selkeän hierarkian puute sivulla on yleisin UX-virhe yrityssivustoilla. Kun useat elementit kilpailevat huomiosta yhtä lailla, kävijöillä ei ole lähtökohtaa. He silmäilevät lukematta, eivät löydä toimintakehotetta ja lähtevät. Visuaalinen hierarkia ja asetteluratkaisut, jotka luovat selkeän lukujärjestyksen, ratkaisevat tämän ongelman suoraan.
Navigointi, joka vaatii arvailua, pakottaa kävijät tutkimaan päämäärätietoisen liikkumisen sijaan. Valikkonimikkeet, jotka merkitsevät jotain sisäisesti mutta eivät mitään uudelle kävijälle, alasvetovalikot, jotka piilottavat hyödyllisimmät sivut, ja navigointirakenteet, jotka eivät vastaa sitä, miten kävijät ajattelevat yrityksestä, luovat kaikki kitkaa. Artikkeli mitä verkkosivuston navigointi on käsittelee, miten rakennetaan valikoita, jotka ohjaavat sekoittamisen sijaan.
Lomakkeet ilman ohjausta ovat toinen yleinen ongelma. Pakolliset kentät, joita ei ole selvästi merkitty, syötteet, jotka hylkäävät kelvollisia muotoja selittämättä miksi, ja lomakkeet, jotka tyhjentävät kaikki merkinnät epäonnistuneen lähetyksen jälkeen, ovat kaikki esteitä, jotka vähentävät täyttöastetta merkittävästi.
Mobiili-UX, joka ei vastaa työpöydän tarkoitusta, on aukko, joka maksaa yrityksille käyntejä jokaisessa istunnossa. Työpöytäsivu, joka on suunniteltu useilla sarakkeilla ja tiivistyy mobiilissa yhdeksi sarakkeeksi elementit väärässä järjestyksessä, tarjoaa eri kokemuksen kuin oli tarkoitettu. Artikkeli miten teet verkkosivustosta mobiiliystävällisen käsittelee asettelu- ja vuorovaikutuspäätökset, jotka ratkaisevat, toimiiko mobiilikokemus yhtä hyvin kuin työpöytäkokemus.
Miten UX-suunnittelu liittyy SEO:hon?
Hakukoneet mittaavat käyttäjien käyttäytymistä arvioidakseen, tuottaako sivu arvoa. Sivu, jolla on huono UX, tuottaa yleensä korkean poistumisprosentin ja lyhyen sivulla vietetyn ajan, jotka molemmat viestivät hakukoneille ajan myötä, etteivät kävijät löydä etsimäänsä. Sivu, jolla on vahva UX, pitää kävijät pidempään ja saa aikaan enemmän vuorovaikutusta, mikä tuottaa sijoituksia tukevat käyttäytymissignaalit.
Sivun saavutettavuus, joka liittyy läheisesti UX:ään, vaikuttaa myös siihen, kuinka luotettavasti hakukoneet voivat indeksoida sivun. Sivu, jolla voi liikkua näppäimistöllä ja joka on rakennettu semanttisella HTML:llä, on helpompi indeksoida tarkasti kuin sivu, jolla on rakenteellisia ongelmia. Artikkeli mitä SEO on käsittelee, miten käyttökokemussignaalit vaikuttavat hakusuorituskykyyn ja mitkä käyttäytymistekijät ovat tärkeimpiä.
Miten WEMASY hoitaa UX-suunnittelun
WEMASYn sivustorakentimen mallipohjat on rakennettu UX-periaatteet lähtökohtana. Otsikkohierarkia, toimintakehotteiden sijoittelu, navigointirakenne, lomakkeiden suunnittelu ja mobiiliasettelut on asetettu oletuksiin, jotka heijastavat sitä, miten kävijät todella käyttävät yrityssivustoja. Visuaalisella editorilla voit säätää jokaista elementtiä ja nähdä tuloksen reaaliajassa sekä työpöydällä että mobiilissa ennen julkaisua. Asettelun muutokset eivät vaadi sivun rakentamista alusta.
Katso, mitä kuuluu mukaan, osoitteesta WEMASYn sivustonrakentaja tai tutustu vaihtoehtoihin hintasivulla.
Usein kysytyt kysymykset
Tarvitsenko UX-suunnittelijaa hyvän verkkosivuston rakentamiseen?
Et välttämättä. Sivustorakennin, jossa on hyvin suunnitellut mallipohjat, hoitaa yleisimmät UX-päätökset mallipohjatasolla, joten et aloita nollasta tietoarkkitehtuurin, otsikkohierarkian tai mobiiliasettelun kanssa. UX-suunnittelija tuo eniten arvoa ymmärtämällä, miten tietty yleisö käyttäytyy, ja testaamalla, toimivatko tietyt polut tarkoitetulla tavalla. Useimmille pienyritysten sivustoille UX-periaatteiden soveltaminen hyvin rakennetun mallipohjan kautta tuottaa merkittävästi parempia tuloksia kuin UX:n sivuuttaminen kokonaan, vaikka ilman erikoisosaajaa. WEMASYn sivustorakentimellavoit toteuttaa tämän suoraan omalla sivustollasi.
Mitä on käytettävyystestaus?
Käytettävyystestaus tarkoittaa oikeiden käyttäjien tarkkailua, kun he yrittävät suorittaa tehtäviä verkkosivustolla. Tavoite on tunnistaa, missä kävijät hämmentyvät, missä he epäröivät ja missä he eivät saa tehtyä sitä, mitä varten tulivat. Se voi olla niin yksinkertaista kuin työkaverin pyytäminen löytämään hintasivu ja sen seuraaminen, mihin hän klikkaa, tai niin jäsenneltyä kuin tallennettu istunto ruudunjaolla ja moderaattorilla. Jo epävirallinen testaus kahden tai kolmen ihmisen kanssa, jotka eivät ole koskaan nähneet sivustoa, paljastaa merkittävimmät käytettävyysaukot.
Mitä eroa on UX-suunnittelulla ja web-suunnittelulla?
Web-suunnittelu on laajempi ala, joka kattaa sekä sen, miltä verkkosivusto näyttää, että sen, miten se toimii. UX-suunnittelu on web-suunnittelun osajoukko, joka keskittyy nimenomaan sivustoa käyttävän ihmisen kokemukseen. Web-suunnittelija tekee päätöksiä väristä, typografiasta, asettelusta ja visuaalisesta hierarkiasta sekä navigoinnista, tietoarkkitehtuurista ja vuorovaikutussuunnittelusta. Kun näihin vuorovaikutukseen keskittyviin päätöksiin kiinnitetään erityistä huomiota ja ne testataan oikeaa käyttäjäkäyttäytymistä vastaan, tätä käytäntöä kutsutaan UX-suunnitteluksi.
Mistä tiedät, onko verkkosivustollasi UX-ongelmia?
Selkeimmät signaalit tulevat käyttäjien käyttäytymisdatasta. Korkeat poistumisprosentit tärkeillä sivuilla, matala lomakkeiden täyttöaste, lyhyt sivulla vietetty aika sisällölle, jonka lukemiseen pitäisi mennä pidempään, ja korkeat keskeyttämisasteet kassaprosesseissa viittaavat kaikki UX-ongelmiin. Ensikertalaisen kävijän seuraaminen sivustolla ilman opastusta paljastaa, missä sekaannus syntyy. Suora palaute asiakkailta, jotka mainitsevat vaikeuden löytää jotain tai luovuttavat tehtävän kesken, on yhtä diagnostista. Analytiikkatyökalua ei tarvita aloittamiseen. Yhden ihmisen seuraaminen, kun hän yrittää käyttää sivustoa, riittää usein merkittävimpien ongelmien tunnistamiseen.
Mikä yhteys UX-suunnittelulla on konversioasteeseen?
Konversioaste mittaa niiden kävijöiden prosenttiosuutta, jotka tekevät halutun toiminnon, kuten täyttävät lomakkeen, tekevät oston tai varaavat puhelun. UX-suunnittelu vaikuttaa tähän lukuun suoraan, koska se ratkaisee, kuinka helppoa tai vaikeaa toiminnon suorittaminen on. Tarpeettomien vaiheiden poistaminen kassaprosessista, ensisijaisen toimintakehotteen tekeminen visuaalisesti erottuvaksi, lomakekenttien yksinkertaistaminen ja virheilmoitusten parantaminen lisäävät kaikki todennäköisyyttä, että kävijä, joka aikoo konvertoitua, myös konvertoituu. Yhteys on suora: parempi UX vähentää kitkaa, ja vähemmän kitkaa tuottaa korkeampia konversioasteita.