Verkkosivujen helppokäyttöisyys

Mies istuu sohvalla kannettava tietokone sylissä.

Verkkosivujen helppokäyttöisyys on keskeinen osa saavutettavuutta. Helppokäyttöisyydestä on hyötyä kenelle tahansa, mutta siitä hyötyvät erityisesti käyttäjät, jotka eivät ole tottuneita verkon käyttäjiä tai joilla on haasteita esimerkiksi oppimisessa, hahmottamisessa, muistissa tai tekstien ymmärtämisessä – siis erilaisissa kognitiivissa taidoissa. Usein puhutaankin kognitiivisesta saavutettavuudesta erotuksena tekniseen saavutettavuuteen. 

Tälle sivulle on koottu ohjeita siitä, miten sivuista voi tehdä helppokäyttöisiä ja kognitiivisesti saavutettavampia. Lisäksi Papunet on kehittänyt kriteerit selkokielisten sivustojen helppokäyttöisyyden arviointiin. Kriteerejä voi hyödyntää sivustojen kehittämisessä ja arvioinnissa myös tilanteissa, joissa sivusto ei ole selkokielinen. 

1. Ulkoasun ymmärrettävyys

Muotoile ja sijoittele elementit niin, että ulkoasu kertoo niiden merkityksestä ja suhteesta toisiinsa

Otsikkojen, leipätekstien, navigaatiovalikkojen, linkkien, lomake-elementtien, painikkeiden ynnä muiden sivuston elementtien tulee olla tunnistettavissa ja erotettavissa toisistaan ulkoasun perusteella. Elementit, joilla on sama tarkoitus tai jotka toimivat samalla lailla, on hyvä muistuttaa toisiaan myös visuaalisesti.

Myös elementtien sijoittelu kertoo niiden tarkoituksesta ja suhteesta toisiinsa. Jos elementit liittyvät toisiinsa, niiden tulisi olla myös lähellä toisiaan. Elementtiin liittyviä toimintopainikkeita etsitään usein lähietäisyydeltä.

Jos sivulla on peräkkäin esimerkiksi tekstiä ja kuvia, tekstin mielletään liittyvän lähimpänä tekstiä olevaan kuvaan riippumatta siitä, onko teksti kuvan ylä- vai alapuolella.

Muotoile teksti niin, että se on helppolukuista. Kirjasintyypin tulee olla kirjainmuodoiltaan selkeä ja ilmava. Tehokeinoja, kuten lihavointia tai kursivointia, kannattaa käyttää harkiten. Rivivälin tulee olla riittävä. Tekstirivit eivät saa olla liian pitkiä, ja teksti tulee olla tasattu vasempaan reunaan.

2. Informaation määrä

Pidä kerralla näkyvissä olevan informaation määrä kohtuullisena

Näytöllä on samaan aikaan näkyvillä vain kohtuullinen määrä eri elementtejä, esimerkiksi tekstiä, linkkejä tai kuvia. Liian suuri määrä tietoa vaikeuttaa silmäilemistä ja kohteita on vaikea erottaa toisistaan.

Näytä vain kontekstin kannalta tärkeä informaatio ja toiminnot

Näytöllä on hyvä olla näkyvillä vain kuhunkin kontekstiin liittyvä informaatio. Muu tulisi piilottaa (esimerkiksi linkin tai toimintopainikkeen taakse) tai poistaa kokonaan. Esimerkiksi sisältötekstin viereen ei kannata sijoittaa sisältöön liittymättömiä kuvia tai linkkejä muualle sisältöön.

3. Sivustolla liikkuminen

Tee sivustolla liikkumisesta selkeää, jotta sisältö on helppo löytää

Sivuston rakenteen eli sivujen välillä liikkumisen ja sivujen luokittelujärjestyksen tulee olla loogisia ja ymmärrettäviä. Monen rinnakkaisen navigaatiorakenteen käyttämistä tulee välttää. Sivuhierarkia ei saa olla liian monitasoinen tai muulla tavoin hankala hahmottaa.

Tee sivuston toiminnasta ennakoitavaa

Kun klikataan linkkiä tai toimintopainiketta, sen ei saa aiheuttaa suurta muutosta sivupohjan rakenteessa – tai muutoksesta tulee informoida käyttäjää etukäteen tai sen on oltava muuten ennakoitavissa. Sivuston eri osioiden tulee olla ulkoasultaan riittävän yhtenäisiä ja sivun perusosien sijainnin tulee säilyä samana linkin klikkaamisen jälkeen.

Myöskään toimintopainikkeen klikkaaminen ei saa aiheuttaa odottamattomia muutoksia.

Linkkitekstin olisi hyvä vastata sen sivun otsikkoa, jolle linkistä siirrytään.

4. Palaute käyttäjälle

Näytä käyttäjälle hänen sijaintinsa sivustolla

Käyttäjän nykyinen sijainti sivustolla tulee ilmaista selkeästi esimerkiksi navigaatiovalikon linkin korostusvärillä tai niin sanotun murupolun avulla.

Ilmoita monivaiheisen toiminnon vaiheet

Jos toimintoon liittyy monta vaihetta, käyttäjälle tulee ilmoittaa selkeästi, montako eri vaiheita on, missä vaiheessa ollaan ja mikä on seuraava askel.

Kerro lomakekenttien yhteydessä, mitä kenttään tulisi syöttää ja missä muodossa

Otsikkotekstien tulee kuvata selkeästi ja käyttäjän tuntemin termein, mitä lomakekenttään tulisi kirjoittaa. Jos edellytetään tiedon syöttämistä tarkasti määritellyssä muodossa, tätä tulee havainnollistaa esimerkeillä lomakekentän yhteydessä.

Ilmoita toiminnon onnistumisesta tai virheestä

Kun toiminto (esimerkiksi lomakkeen lähettäminen) on onnistunut, siitä tulee ilmoittaa käyttäjälle selkeästi. Jos toiminnon suorittaminen epäonnistuu, käyttäjälle tulee ilmoittaa virheestä selkeästi ja kertoa, miten ongelman voi korjata. Tämä onnistuu osoittamalla virheen paikka, esittämällä korjausehdotus tai kertomalla vaihtoehtoisista menettelytavoista.

5. Kieli ja terminologia

Käytä selkokieltä tai selkeää yleiskieleltä

Kaikissa sivuston teksteissä tulisi käyttää konkreettista ja käyttäjälähtöistä selkeää yleiskieltä tai selkokieltä, jos se on kohderyhmän kannalta perusteltua. Pitkiä tekstimassoja kannattaa välttää ja suosia lyhyitä kappaleita, väliotsikoita, listoja, kuvia ja videoita.

Tärkein asia tulee sijoittaa tekstin alkuun tai korostaa sitä muilla keinoin. Myös linkkien ja toimintopainikkeiden teksteissä tulee käyttää käyttäjälle tuttua kieltä. 

Ohjeita selkokielen kirjoittamiseen on Selkokeskuksen sivuilla. 

Lisätietoa