Miten verkkopalvelun saavutettavuus rakentuu?

  • Blogi

Kirjoitus on kolmas osa redandbluen Trendikatsaus – Mitä tapahtuu verkossa 2025? -kirjoitussarjaa, jonka sisällöt pohjautuvat 22.5.2025 olleen tapahtuman puheenvuoroihin.

Saavutettava verkkopalvelu aiheesta kertoi Petri Siltala redandbluen trendikatsauksessa

Vuonna 2025 verkkopalvelun saavutettavuus ei toteudu vieläkään itsestään edes tekoälyn avulla, vaan se on suunnittelun, teknisen toteutuksen ja sisällöntuotannon saumatonta yhteispeliä. Se siis edellyttää laaja-alaisesti saavutettavuuden osaamista ja johtamista toteutuakseen. Kerron tässä artikkelissa ytimekkäästi, miten verkkopalvelun saavutettavuus rakentuu. Voidaan tässä yhteydessä sopia, että verkkopalvelulla tarkoitetaan artikkelissani mitä tahansa verkkoselaimessa toimivaa palvelua, kuten perus verkkosivustoa, verkkokauppaa tai verkkosovellusta.

WCAG-vaatimukset konkreettisen esimerkin kautta

Kun saavutettavuudesta puhutaan verkkopalveluiden yhteydessä, viitataan yleisimmin WCAG-ohjeistoon (Web Content Accessibility Guidelines 2.1 ). Käytännössä verkkopalvelun saavutettavuus tarkoittaa, että kuka tahansa pystyy käyttämään verkkopalvelua – riippumatta siitä, käyttääkö hän hiirtä vai näppäimistöä, näkeekö sisällön ruudulta vai kuunteleeko sen ruudunlukijan kautta.

WCAG 2.1 -ohjeistossa A- ja AA-tason vaatimukset muodostavat lainsäädännössä määritellyn minimitason. Nämä vaatimukset voidaan tiivistää neljään perusperiaatteeseen: sisältöjen tulee olla havaittavia, hallittavia, ymmärrettäviä ja lujatekoisia. Konkreettisesti tämä näkyy esimerkiksi siinä, että verkkosivuston sisältö toimii näppäimistöllä, sivun kontrastit ovat riittävät, kuvilla on vaihtoehtoiset tekstit sekä sivun rakenne on looginen ja ennakoitava.

Otetaanpa esimerkiksi WCAG-vaatimus 2.1.2 Ei näppäimistöansaa A, joka tarkoittaa, että käyttäjä pystyy vaikkapa poistumaan näppäimistöllä navigoidessaan kaikista sivuston osista samalla tavoin kuin sinne on päässytkin. Jos esimerkiksi verkkokaupan hakukenttä tai chat-ikkuna ”vangitsee” näppäimistön fokuksen niin, ettei siitä pääse pois Tab-näppäimellä tai muilla tavanomaisilla näppäimistökomennoilla, näppäimistöä käyttävä henkilö (kuten moni näkövammainen tai liikuntarajoitteinen) jää jumiin eikä pääse jatkamaan ostosprosessia tai sivuston muiden toimintojen käyttöä.

Näin rakennetaan saavutettava verkkopalvelu

Verkkopalvelun suunnitteluvaihe

Verkkopalvelun suunnitteluvaiheessa saavutettavuuden huomioiminen tarkoittaa sitä, että sivurakenne, navigaatiot ja muut käyttöliittymät suunnitellaan selkeiksi ja toimiviksi kaikille käyttäjille. Näkyvin osa saavutettavuutta on usein visuaalinen ilme – värit, fonttikoot ja painikkeiden koko. Yhtä tärkeää on huomioida esimerkiksi näytönlukijoiden tarvitsemat HTML-rakenteet ja roolit. Myös sisältöjen suunnittelussa tulee huomioida saavutettavuus eli vaikkapa kuvien käyttäminen niin, ettei niiden päälle liimata tekstiä ilman, että käyttäjälle tarjotaan vaihtoehtoinen tekstivastine. Näistä monista syistä saavutettavuus ei ole pelkästään suunnittelijan tai kehittäjän vastuulla, vaan vaatii yhteistä ymmärrystä koko projektitiimiltä.

WordPress-verkkopalvelun saavutettavuus

WordPress-verkkopalvelun toteutuksessa saavutettavuuden huomioiminen lähtee oikeista valinnoista: käytetään saavutettavia teemoja ja komponentteja, testataan sisältölohkojen toimivuutta ruudunlukijalla ja varmistetaan, että kaikki sisältö toimii myös ilman hiirtä tai kosketuseleitä. Esimerkiksi valmisteemoja tai sivurakentajia käyttämällä et välttämättä täysin voi varmistua toteutuksen saavutettavuudesta.

Saavutettavuus syntyy hyvistä käytännöistä, kuten vaikkapa siitä, että sisältöeditoriin tehdään ohjeistukset sisältöjen ylläpitäjille muun muassa kuvien tekstivastineiden lisäämiseen tai loogisen otsikkorakenteen luomiseen H2–H3–H4-tasojen avulla. 

Verkkopalvelun sivujen otsikkorakenne on muuten saavutettavuusvaatimusten osalta suositus, eikä lain edellyttämä vaatimus. Yleisen käytettävyyden ja hakukonenäkyvyydenkin kannalta jokaiselta sivulta kannattaa löytyä korkeintaan yksi H1-tason otsikko ja muut otsikoinnit semanttisessa ja loogisessa järjestyksessä.

Saavutettavuuden testaaminen

Saavutettava verkkokauppa edellyttää saavutettavuuden testaamista, kertoo Petri Siltala, redandblue

Hyvin johdettu verkkopalvelu-uudistus huomioi saavutettavuuden varmistamisen koko projektin ajan ja se tarkoittaa saavutettavuuden testaamista eri muodoissaan. Saavutettavuutta voi ja kannattaa arvioida jo suunnitteluvaiheessa eli saavutettavuusasiantuntija katselmoi vaikkapa verkkopalvelun prototyypin ja siihen tehdään tarvittavat korjaukset ennen koodausvaihetta. Näin voidaan tehdä kustannustehokkaammin viilauksia saavutettavuuden osalta.

Itse toteutusvaiheessa saavutettavuuden testaaminen on tärkeä osa-alue, jottei projektin lopussa tehtävästä saavutettavuusauditoinnista tule isoa korjaustaakkaa tehtäväksi. Pahimmassa tapauksessa voidaan joutua palaamaan takaisin suunnittelupöydälle ja se vasta kustannuksia nostaakin.

Kirjoitan myöhemmin teille saavutettavuuden testaamisesta ja monitoroinnista tarkemmin, niin linkkaan sen artikkelin tähän. Sitä odotellessa tutustu redandbluen tarjoamaan saavutettavuusauditointipalveluun .

Kehittyvät saavutettavuusvaatimukset

Jo julkaistussa, mutta ei vielä lain edellyttämässä WCAG 2.2 -versiossa (https://www.w3.org/TR/WCAG22/ ) saavutettavuusvaatimuksia on täsmennetty entisestään. Erityishuomiota kiinnitetään nyt muun muassa siihen, että lomakkeiden käyttö on mahdollista ilman vedä ja pudota -toimintoja, että kirjautuminen ei edellytä muistinvaraisia toimintoja, ja että kohdistus ei saa jäädä muiden elementtien alle. Myös tärkeiden avustavien sisältöjen, kuten vaikkapa maksutapaehtojen, saavutettavuusselosteen tai käyttöohjeiden, on löydyttävä kiinteästä paikasta sivustolta. Uudet WCAG 2.2 -yksityiskohdat vaikuttavat etenkin mobiilikäytettävyyteen ja käyttäjien turvalliseen toimintaan palvelussa.

Tutustu redandbluen uutisessa WCAG 2.2 tärppeihin tarkemmin ja huomioi ne jo nyt verkkopalvelussasi.

Kokonaisvaltainen lähestymistapa verkkopalvelun saavutettavuuteen kannattaa

Lopulta saavutettavuus ei ole yksittäinen ratkaisu, vaan kokonaisvaltainen lähestymistapa. Kun saavutettavuus sisällytetään alusta asti suunnittelu- ja toteutusprosessiin, se maksaa itsensä takaisin parempana käytettävyytenä, laajempana asiakaskuntana ja vastuullisempana verkkopalveluna. Kustannussäästöjäkin sillä saa aikaan, kun kolmannen osapuolen toteuttaman saavutettavuusauditoinnin myötä ei paljastu isoa korjaustaakkaa. 

Oikeasti A/AA-tason täyttävä, saavutettava verkkopalvelu syntyy loppu viimein yllättävän pienellä lisäinvestoinnilla, mikäli sitä suunnittelevalla ja toteuttavalla tiimillä on osaamista ja kokemusta pitää saavutettavuusvaatimukset mukana koko prosessin ajan.

Miten voimme olla avuksi?

Saavutettava verkkopalvelu yhdenvertaistaa verkossa tapahtuvaa asiointia. Redandblue voi olla avuksi saavutettavuuden varmistamisessa sekä käytettävien työkalujen että verkkopalvelun rakentamisen osalta.

Kirjoitus on osa redandbluen Trendkatsaus – Mitä tapahtuu verkossa 2025? -kirjoitussarjaa, jonka sisällöt pohjautuvat 22.5.2025 olleen tapahtuman puheenvuoroihin.

Lue myös:

Verkkopalveluiden tietoturva murroksessa – miten suojata WordPress-sivusto muuttuvassa maailmassa?

Tekoälykuvat ovat täällä – uskallatko ostaa niitä?

Ollaan yhteyksissä!