Kun potentiaalinen asiakas ei pysty lukemaan hinnastoa puhelimellaan, täyttämään yhteydenottolomaketta näppäimistöllä tai erottamaan painiketta taustastaan, kauppa jää tekemättä. Kyse ei ole pelkästä teknisestä yksityiskohdasta. Yrityksen tärkeimmät verkkosivun saavutettavuusvaatimukset vaikuttavat siihen, kuinka moni ihminen voi käyttää sivustoasi ja kuinka paljon kitkaa jätät myyntipolulle.
Saavutettavuus mielletään usein julkisen sektorin velvollisuudeksi. Se on osittain totta, mutta yrityksellekin aihe on käytännössä paljon laajempi. Erityisesti silloin, kun yritys tarjoaa kuluttajille digitaalisia palveluja, verkkokauppaa tai ajanvarauksia, vaatimukset voivat tulla suoraan lainsäädännöstä. Vaikka lakisääteinen velvoite ei osuisi juuri sinun yritykseesi, huonosti saavutettava sivusto sulkee asiakkaita ulos aivan yhtä tehokkaasti.
Mitä saavutettavuus tarkoittaa yrityksen verkkosivulla?
Saavutettava verkkosivusto toimii myös silloin, kun käyttäjä ei käytä hiirtä, näkee heikosti, tarvitsee suurennettua tekstiä, käyttää ruudunlukijaa tai asioi vanhemmalla puhelimella ja epävarmassa verkkoyhteydessä. Se tarkoittaa selkeää rakennetta, ymmärrettävää sisältöä ja käyttöliittymää, joka ei vaadi käyttäjältä arvailua.
Teknisessä työssä saavutettavuutta arvioidaan yleensä WCAG-ohjeiston avulla. WCAG jakaa vaatimukset neljään periaatteeseen: sisällön pitää olla havaittavaa, hallittavaa, ymmärrettävää ja teknisesti yhteensopivaa avustavien teknologioiden kanssa. Käytännön tavoitetaso on useimmiten WCAG 2.1 AA, ja uudemmissa toteutuksissa WCAG 2.2 AA on järkevä lähtökohta.
Tämä ei tarkoita, että jokainen sivu pitäisi rakentaa raskaan tarkistuslistan ehdoilla. Tarkoittaa se kuitenkin sitä, että saavutettavuus otetaan huomioon suunnittelussa, sisällössä, koodissa ja jatkuvassa ylläpidossa. Jos asia jätetään viimeiseksi, korjaukset maksavat yleensä enemmän. Sama vanha sääntö pätee täälläkin: halvalla kiireessä tehty sivusto on usein kallis omistaa.
Milloin laki koskee yritystä?
Suomessa digipalvelulaki on pitkään kohdistunut pääosin viranomaisiin ja tiettyihin julkista tehtävää hoitaviin organisaatioihin. Yritysten kannalta merkittävä muutos on Euroopan saavutettavuussäädös, jonka vaatimuksia sovelletaan laajasti 28.6.2025 alkaen. Se koskee muun muassa tiettyjä kuluttajille suunnattuja verkkokaupan, pankki-, liikenne-, viestintä- ja sähköisen kaupankäynnin palveluja.
Rajaukset ovat tapauskohtaisia. Esimerkiksi mikroyrityksillä voi olla poikkeuksia joissakin palveluissa, eikä jokainen tavallinen esittelysivusto automaattisesti kuulu vaatimusten piiriin. Jos yrityksesi myy tuotteita tai palveluja kuluttajille verkossa, käsittelee varauksia, tarjoaa itsepalvelukanavan tai toimii säännellyllä toimialalla, asia kannattaa selvittää ammattilaisen kanssa. Arvaaminen ei ole compliance-strategia.
Lain minimitaso ei myöskään ole sama asia kuin hyvä asiakaskokemus. B2B-yritykselläkin kävijä voi käyttää näppäimistöä vamman, tilapäisen käsivamman tai työympäristön vuoksi. Moni ongelma osuu samalla tavoin ikääntyviin käyttäjiin, mobiilikävijöihin ja kiireisiin ostajiin. Saavutettavuus on usein käyttöliittymäsuunnittelua ilman turhaa egoilua.
Tärkeimmät verkkosivun saavutettavuusvaatimukset yritykselle
1. Tekstin, värien ja kontrastien on toimittava oikeasti
Vaalea harmaa teksti valkoisella taustalla voi näyttää suunnittelijan suurelta näytöltä hillityltä. Käyttäjälle se voi olla yksinkertaisesti lukukelvotonta. Tavalliselle tekstille tavoitellaan yleensä vähintään 4,5:1-kontrastisuhdetta taustaan nähden. Suurelle tekstille vaatimus on väljempi, mutta värin ei silti pidä olla ainoa tapa kertoa merkitystä.
Jos lomakekenttä on virheellinen, pelkkä punainen reunus ei riitä. Virhe on kerrottava myös tekstinä, selkeästi ja kentän yhteydessä. Sama koskee tilausprosessia, tarjouspyyntöä ja uutiskirjeen tilausta. Asiakas ei saa joutua metsästämään, mikä meni pieleen.
Tekstin on myös kestettävä suurentamista. Kun käyttäjä kasvattaa fonttia tai selaimen zoomausta, sisältö ei saa kadota, mennä päällekkäin tai pakottaa sivuttaisscrollaukseen. Tämä on yllättävän tavallinen ongelma valmisteemoissa ja huolimattomasti rakennetuissa komponenteissa.
2. Sivustoa pitää voida käyttää näppäimistöllä
Kaikki olennainen toiminnallisuus - navigointi, painikkeet, lomakkeet, valikot, varaukset ja ostaminen - pitää pystyä hoitamaan ilman hiirtä. Käyttäjän on nähtävä, missä kohtaa sivua näppäimistön kohdistus on. Jos fokuksen ilmaisin on poistettu tyylisyistä, sivusto voi näyttää siistiltä mutta muuttua käytännössä sokkeloksi.
Erityistä huomiota vaativat ponnahdusikkunat, evästeilmoitukset, monitasovalikot ja chat-ikkunat. Kun modaalinen ikkuna avautuu, kohdistuksen pitää siirtyä siihen. Kun ikkuna suljetaan, kohdistuksen pitää palata järkevään paikkaan. Muuten näppäimistökäyttäjä saattaa hypätä sivun alkuun tai jäädä loukkuun käyttöliittymään.
Automaattisesti käynnistyvät karusellit ja videot ovat toinen klassikko. Jos liikettä ei voi pysäyttää tai sisältö vaihtuu ennen kuin käyttäjä ehtii lukea sen, kyse ei ole modernista designista vaan huonosta käytettävyydestä.
3. Rakenne ja otsikot eivät ole pelkkää visuaalista muotoilua
Ruudunlukija ei näe sivua kuten ihminen. Se tulkitsee HTML-rakennetta. Siksi otsikkotasojen, linkkien, painikkeiden, lomakekenttien ja sivun alueiden pitää olla merkitty oikein.
Otsikko ei ole otsikko siksi, että se on iso ja lihavoitu. Sen pitää olla myös teknisesti otsikko. Sivulla tulee olla looginen pääotsikko ja selkeä hierarkia sen alla. Tämä auttaa ruudunlukijan käyttäjää siirtymään suoraan kiinnostavaan kohtaan, mutta hyödyttää myös kaikkia lukijoita, jotka silmäilevät sisältöä ennen päätöstä.
Linkkitekstin pitää kertoa, minne linkki vie. Toistuva "lue lisää" ei auta, jos sivulla on kuusi eri palvelua. Parempi on kirjoittaa esimerkiksi "Lue lisää verkkosivujen ylläpidosta". Painikkeiden kohdalla sama periaate on vielä tärkeämpi: "Lähetä tarjouspyyntö" kertoo toiminnon, "Klikkaa tästä" ei juuri mitään.
4. Kuvilla, videoilla ja dokumenteilla on oltava vaihtoehto
Informatiivisille kuville tarvitaan tekstivastine eli alt-teksti. Sen tehtävä ei ole luetella kuvan jokaista yksityiskohtaa, vaan välittää käyttäjälle olennainen tieto. Jos kuva on pelkkä koriste, se voidaan jättää ruudunlukijalta piiloon. Jos kuva sisältää olennaista tekstiä, sama tieto pitää löytyä myös varsinaisena tekstinä.
Video tarvitsee vähintään tekstitykset, kun puheessa on sisällön kannalta olennaista tietoa. Joissakin tilanteissa tarvitaan lisäksi kuvailutulkkausta tai tekstivastinetta. Äänitallenteelle tarvitaan tekstimuotoinen vastine.
PDF on usein saavutettavuuden heikoin lenkki. Skannattu esite, jonka tekstiä ei voi valita tai lukea ruudunlukijalla, ei muutu saavutettavaksi vain siksi, että tiedoston nimi sisältää sanan "saavutettava". Jos sisältö on tärkeä asiakkaan päätökselle, se kannattaa esittää ensisijaisesti verkkosivuna.
Lomakkeet ja verkkokauppa ratkaisevat eniten
Useimmat yrityssivustot eivät kaadu siihen, että yksi koristekuva on ilman alt-tekstiä. Ne kaatuvat siihen, että asiakas ei pysty lähettämään lomaketta, valitsemaan toimitustapaa tai ymmärtämään, miksi maksu epäonnistui.
Jokaisella lomakekentällä on oltava näkyvä nimi. Pelkkä kentän sisällä oleva haaleteksti ei riitä, koska se katoaa, kun käyttäjä alkaa kirjoittaa. Pakolliset kentät, virheilmoitukset ja syöttöohjeet pitää esittää selkeästi. Jos kysyt puhelinnumeroa tietyssä muodossa, kerro muoto ennen kuin käyttäjä tekee virheen.
Verkkokaupassa saavutettavuus ulottuu tuotesuodatuksiin, ostoskoriin, maksamiseen ja tilausvahvistukseen asti. Kolmannen osapuolen maksupalvelu tai ajanvarausjärjestelmä voi olla teknisesti erillinen, mutta asiakkaalle se on osa sinun palveluasi. Siksi integraatioita ei pidä lisätä sivulle sokkona. Niiden saavutettavuus, nopeus ja mobiilikäyttö on testattava ennen julkaisua.
Testaus: automaatti löytää osan, ihminen loput
Automaattiset tarkistimet ovat hyödyllisiä esimerkiksi puuttuvien alt-tekstien, kontrastien ja otsikkorakenteiden havaitsemisessa. Ne eivät kuitenkaan tiedä, onko alt-teksti järkevä, onko lomakkeen ohje ymmärrettävä tai onko ostopolku aidosti helppo käyttää.
Toimiva prosessi yhdistää teknisen tarkistuksen, näppäimistötestauksen ja manuaalisen läpikäynnin eri laitteilla. Käy läpi vähintään tärkeimmät polut: etusivu, palvelusivu, yhteydenotto, ajanvaraus, ostoskori ja maksaminen. Tee tämä jokaisen merkittävän julkaisun yhteydessä, ei vasta sitten kun asiakas ilmoittaa ongelmasta.
Jos sivusto rakennetaan jatkuvasti päivittyvän sisällön, lisäosien ja satunnaisten integraatioiden päälle, saavutettavuus voi heiketä huomaamatta. Siksi ylläpito kuuluu saavutettavuuteen. Netvoiman kaltaisessa jatkuvassa mallissa tämä tarkoittaa, että teknistä laatua seurataan myös julkaisun jälkeen - eikä vain projektin viimeisessä kokouksessa.
Saavutettava sivusto ei tarvitse fanfaareja eikä erillistä kiiltävää leimaa. Sen tunnistaa siitä, että asiakas pääsee asiaan, ymmärtää tarjouksen ja voi toimia ilman ylimääräistä kitkaa. Juuri niin verkkosivun pitäisi toimia: hiljaisesti, nopeasti ja ilman draamaa.