Saavutettavuus on asiakaskokemuksen peruspilari

Saavutettavuus tarkoittaa sitä, että kuka tahansa pystyy käyttämään sivustoa helposti ja vaivattomasti – riippumatta vammoista (esim. näkö-, kuulo- tai liikuntavamma) tai muista rajoitteista.

Saavutettavuudesta hyötyvät jollain tavoin vammautuneiden henkilöiden lisäksi ne, joilla on lukivaikeus, afasia tai jokin muu kognitiivinen häiriö.

Saavutettavuutta on myös se, että sivustoa on helppo käyttää ympäröivistä olosuhteista huolimatta. Se toimii niin valoisassa kuin hämärässäkin, eikä sen teksti ole liian pientä tai värivalinnat huonoja (esim. valkoisella pohjalla on vaaleaa tekstiä). Sivusto on myös suunniteltu visuaalisesti niin, ettei siinä ole päänsärkyä aiheuttavia elementtejä (esim. kirkuvia väriyhdistelmiä tai liikkuvia kuvioita).

Saavutettavuuteen liittyy yhtenä tekijänä sivujen selkeys, joka toteutuessaan auttaa ketä tahansa palvelua käyttävää ihmistä. Jos käyttöliittymä on helposti omaksuttavissa ja käytettävissä, on siitä hyötyä ihan kaikille käyttäjille.

Yritysten kannattaa siis satsata saavutettavuuteen eikä käännyttää potentiaalisia asiakkaita pois sivustolta.

Mikä saavutettavuudessa maksaa?

Saavutettavuudessa ei ole kyse pelkästään siitä, että sitä testataan jollain työkalulla ja kehittäjä korjaa saavutettavuusongelmat. Itse asiassa kehittäjien vastuulla olevat saavutettavuusongelmat voivat paikka paikoin olla hankalasti korjattavissa, koska järjestelmät koostuvat useista osista.

Yksi osa voi hoitaa muuttumattomien sivujen näyttämisen käyttäjälle. Toinen saattaa hakea tietoja jostain tietokannasta. Kolmas taas huolehtii siitä, että sivun käyttäjien antamat palautteet menevät eteenpäin – olivat ne sitten julkisia, sivuilla nähtäviä palautteita tai yksityisiä.

Näitä osia ei kannata alusta alkaen kirjoittaa uudestaan saavutettavuus edellä. Useimmiten päästään paljon vähemmällä, jos saavutettavuuspuutteet korjataan tai käytetään järjestelmää saavutettavammin.

Saavutettavuus voidaan toteuttaa eri järjestelmillä joko hyvin tai huonosti – ja monella eri tavalla. Saavutettavuuden varmistamiseen saattaa kulua hyvinkin paljon aikaa.

Jos törmätään saavutettavuusongelmaan, joka on monitahoinen, saavutettavan version tekeminen ja testaus voivat olla iso puristus. Ja tämän toteuttaminen tietysti vaatii rahaa ja muita resursseja.

Saavutettavuusongelman ratkaisemisesta koituvat kustannukset kuitenkin kannattavat: on parempi, että ongelma havaitaan ja saadaan korjattua ennen kuin sen löytää tyytymätön asiakas – joka on pahimmassa tapauksessa kyllästynyt tappelemaan ongelman kanssa ja on jo entinen asiakas.

Aina saavutettavuus ei vaadi koodin kirjoittamista tai isoja muokkauksia nettisivun toimintalogiikkaan. Osa saavutettavuusongelmista on helposti sisällöntuottajan korjattavissa.

Tällaista pientä viilausta ovat esimerkiksi kuvien oikeaoppiset alt-tekstit, joita ruudunlukija lukee kuvien asemesta. Koska näitä on tarkoitus tehdä merkitys edellä, sisällöntuottaja tietää useimmiten parhaiten, mitä kuvien pitäisi ilmaista.

Myös sisältöön liittyvät asiat kuten oikeaoppinen otsikointi ja ladattavien tiedostojen saavutettavuus ovat sisällöntuottajan vastuulla.

Lue lisää: Sisältöä ei voi sivuuttaa pikkujuttuna, kun tavoitteena on saavutettavuus

Saavutettavuustestaamisessa on monta vaihetta

Yksi saavutettavuusauditoinnin vaiheista on testaus saaavutettavuustyökaluilla. Näitä voivat olla esimerkiksi Siteimprove tai komentokehotteestakin toimiva selaimen lisäosa axe.

Toinen vaihe on testata saavutettavuutta todellisilla ruudunlukuohjelmilla käyttämällä eri käyttöjärjestelmiä (tietokoneella Mac tai Windows, mobiilissa Android ja iOs). Joissain tapauksissa jompikumpi saattaa riittää, usein testataan molemmat. Joskus testejä tehdään vain tietokoneella tai vain mobiiliympäristössä – tämä riippuu ongelman laadusta.

Ruudunlukuohjelmat saattavat joissain tilanteissa toimia eri lailla eri selaimilla. Yksi testattavista asioista on loogiset otsikkotasot.

Testaustyökalut varoittavat, jos eri otsikkotasoja jää välistä pois. Ne eivät kuitenkaan ymmärrä, jos otsikointi on sisällön näkökulmasta epälooginen. Esimerkki tästä voisi olla vaikkapa se, että koko sivun ykköstason otsikon pitäisi olla Uutiset, ja kakkostasolla on sitten eri uutisten otsikoita. Logiikka pettää, jos ykköstason otsikkona onkin jonkin yksittäisen uutisen otsikko.  

Milloin sivun saavutettavuus tulisi tarkistaa?

Sivun saavutettavuus tulee tarkistaa ainakin seuraavissa tapauksissa:

  • Jos sitä ei ole vielä tarkistettu.

Jos saavutettavuus on kunnossa, siitä hyötyvät kaikki käyttäjät: ihmiset, joilla on jokin vamma, joka vaikeuttaa sisällön lukemista, ja kaikki, joilla on hidas nettiyhteys, huono valaistus tms.

Saavutettavuus hyödyttää tietyissä tapauksissa myös hakukoneita. Jos sivun otsikointi on selkeä ja sisältö on erotettu navigointivalikosta oikeaoppisesti, se näkyy halukoneissakin paremmin.

  • Kun sivulle tulee uudenlaista sisältöä.
  • Kun järjestelmä, jolla sivu on tehty, päivitetään uudempaan versioon.
    Uusien ominaisuuksien myötä saattaa tulla uusia saavutettavuusongelmia.
    Saavutettavuus saattaa pahimmassa tapauksessa rikkoutua, kun sivustoa käytetään uudemmalla selainversiolla. Siksi ei ole ainakaan pahitteeksi testata sivujen saavutettavuutta, kun jostain selaimesta tulee uusi versio.

    Onneksi usein tapahtuu aivan toisin päin ja uudemmissa selainversioissa on korjattu saavutettavuusongelmia.​

Haluatko varmistaa saavutettavuuden? Älä tee näin!

Seuraavassa on mainittu todellisia esimerkkejä erilaisista saavutettavuuteen liittyvistä ongelmista.

Sivulla voidaan valita asioita mutta se, onko jokin kohde valittu ei näy mitenkään ruudunlukijoille.

Tämä on iso ongelma varsinkin, jos valittavissa olevia elementtejä on paljon. Silloin ruudunlukijan käyttäjän pitää muistaa, mitä on valittu.

Sivulla oleva kuva on kyllä selitetty alt-tekstillä mutta siten, ettei tarpeellinen informaatio välity.

Jos esimerkiksi määritettävät asetukset on näytetty kuvana, jonka alt-teksti on "kuva asetuksista", ei sokea käyttäjä pysty sen perusteella seuraamaan ohjeita. Korjauksena tähän jos alt-teksti halutaan säilyttää suurin piirtein sellaisenaan voisi olla se, että kerrotaan, mistä ohjeet löytyvät tekstimuodossa.

Sivulla painettavaksi tarkoitettuja elementtejä ei ole merkitty asianmukaisesti.

Oletetaan, että sivulla on kohta, jota on tarkoitus klikata mutta jota ei ole määritetty nappulaksi ruudunlukijan kannalta. Tämä johtaa tilanteeseen, jossa ruudunlukijan käyttäjä joutuu varmuuuden vuoksi painamaan sivun kaikkia elementtejä ja katsomaan mitä tapahtuu.

Klikattavalla kohdalla ei ole mitään ruudunlukijalla havaittavaa yksiselitteistä tekstiä.

Tämä on iso ongelma varsinkin, jos kohtaa ei ole edes merkitty painettavaksi. Tällöin joutuu klikkailemaan kaikkea mahdollista, pahimmassa tapauksessa tyhjää.

Olen ihan äskettäin itsekin joutunut jollain sivulla tilanteeseen, jossa yritin klikata kuvaa ja odotetun toiminnallisuuden sijasta onnistuin mykistämään videosisällön audion.

Sivulla on liikaa tavaraa ennen pääsisältöä.

Joillain sivuilla on liian paljon toistuvaa sisältöä ennen kuin päästään varsinaiseen sisältöön: mainoksia, viittauksia muuhun sisältöön ynnä muuta. Tämä voi olla iso tai pieni ongelma riippuen siitä, miten sivu on toteutettu.

Onneksi monilla sivustoilla on sivun alussa linkki, joka hyppää suoraan pääsisältöön. Tosin ihan kaikilla järjestelmillä linkit eivät aina toimi oletetusti.

Takaa saavutettavuus näillä vinkeillä

Kuvat on selitetty oikein alt-tageissa

Ruudunlukijan käyttäjälle on tärkeää, että kuvat on selitetty oikein alt-tageissa. Hyvä kuvan selitys kertoo kontekstissaan, mikä on kuvan funktio. Jos kuvan sisältö on tärkeä, se kuvaillaan välttäen kuvan laatua kuvaavia adjektiiveja. Esimerkiksi "hieno maisemakuva" tulisi korvata kuvan lyhyellä kuvauksella maisemasta (”mutkaisella hiekkatiellä on punaisia ja oransseja vaahteranlehtiä”).

Asioiden tekemiseen on useita vaihtoehtoja.

Tämä voi olla enemmänkin käytettävyys- kuin saavutettavuusasia. Omassa tekemisessäni nämä kaksi liittyvät aika lailla toisiinsa eikä niitä aina voi erottaa.

Jos käyttöliittymä ei ole kannaltani käytettävä, ei se myöskään ole saavutettava. Toki minä voin opetella ulkoa sen, mistä nimeämättömästä napista tapahtuu mitäkin, mutta en totisesti toivo, että kukaan peruskäyttäjä – varsinkaan sellainen, joka arastelee tietokoneita tai kännyköitä – joutuisi sitä tekemään. Tässä auttaa, jos sivulla voidaan valita asioita valikon kautta tai toisena vaihtoehtona käyttää hakutoimintoa asioiden etsimiseen.

Sivuston rakenteellisuus on kunnossa, mikä näkyy esim. otsikointina ja maamerkkien käytössä.

​Ruudunlukijoilla pystyy selaamaan sivua eri elementtien mukaan. Näitä elementtejä ovat esimerkiksi:

  • Otsikot
  • Linkit
  • Taulukot
  • CTA-painikkeet
  • Lomake-elementit
  • Maamerkit, kuten kuten navigointivalikko, sivun varsinainen sisältö ja haku

Minkä tahansa näiden elementtien oleminen sivulla voi helpottaa sivun käyttöä – sivun rakenteesta riippuu tietysti, miten paljon.  

Saavutettavuus on kaikkien etu

No niin. Siinäpä oli melkoinen tietöpläjäys saavutettavuudesta. Toivottavasti opit jotain uutta ja sain sinut ajattelemaan, miten monitahoinen asia saavutettavuus on.

Kuten jo alussa mainitsin, koskettaa saavutettavuus ihan kaikkia käyttäjiä – ei vain sellaisia, joilla on jokin vamma. Kun huolehdit siitä, että sivusi on kaikille saavutettavissa, osoitat, että kaikki asiakkaat ovat sinulle tärkeitä. Et varmaan halua, että yksikään asiakas karkaa kilpailijalle niin turhasta syystä, ettei hän löydä sivustoltasi tarvitsemaansa tietoa?

Lue lisää: Saavutettavuuden sanastoa

Blogin kirjoittaja Markku Yli-Pentilä on täysin sokea kokemusasiantuntija, joka kohtaa saavutettavuusongelmia päivittäin.