Mikä on WCAG 2.1. eli verkkosisällön saavutettavuusohjeistus? 

Ei ole lain­kaan tuu­les­ta tem­mat­tua, että val­koi­sel­la taus­tal­la ole­tuk­se­na teks­tin väri on mus­ta. Kaik­ki ne asiat, jot­ka meis­tä monis­ta tun­tu­vat ainoas­taan jär­keen­käy­väl­tä suun­ni­te­lul­ta, ovat esi­mer­kik­si näkö- tai kuu­lo­vam­mai­sil­le ehto ver­kos­sa asioi­mi­sel­le. Tämän takia on ole­mas­sa WCAG 2.1 saavutettavuusohjeistus.

Verk­ko­si­vus­toa suun­ni­tel­taes­sa on otet­ta­va huo­mioon verk­ko­si­säl­lön saa­vu­tet­ta­vuus­oh­jeis­tus eli WCAG, jot­ta myös ne sadat tuhan­net suo­ma­lai­set, jot­ka elä­vät jon­kin vam­man tai rajoit­teen kans­sa, pys­ty­vät käyt­tä­mään verk­ko­pal­ve­lui­ta. On arvioi­tu, että pel­käs­tään Suo­mes­sa saa­vu­tet­ta­via verk­ko­pal­ve­lui­ta tar­vit­see yli mil­joo­na ihmistä.

Esi­mer­kik­si näkö­vam­mais­ten tai lii­kun­ta­ra­joit­teis­ten jou­kos­sa on taa­tus­ti yri­tyk­se­si poten­ti­aa­li­sia asiak­kai­ta, jot­ka eivät voi asioi­da sivus­tol­la, joka ei nou­da­ta verk­ko­si­säl­lön saa­vu­tet­ta­vuus­oh­jeis­tus­ta. Voi olla, että asiak­kaal­ta­si on mur­tu­nut vaik­ka­pa käsi, jol­la hän käyt­tää pöy­tä­ko­neen hiir­tä. Mikä­li sivus­toa­si on vai­ke­aa tai jopa mah­do­ton­ta käyt­tää, kan­nat­taa ongel­ma­koh­dat kor­ja­ta välit­tö­mäs­ti – tar­vit­taes­sa me autam­me kyllä.

Mikä on WCAG 2.1. -ohjeistus?

WCAG (Web Con­tent Acces­si­bi­li­ty Gui­de­li­nes) on verk­ko­si­säl­lön saa­vu­tet­ta­vuus­oh­jeis­tus, jol­la pyri­tään hel­pot­ta­maan eri­lais­ten vam­mo­jen kans­sa elä­vien ihmis­ten verk­ko­si­vus­to­jen ja -pal­ve­lui­den käyt­töä. Tätä ohjeis­tus­ta päi­vi­te­tään sään­nöl­li­ses­ti, sil­lä tavat ja lait­teet ver­kos­sa asioi­mi­seen muut­tu­vat jat­ku­vas­ti. Väliot­si­kon kysy­myk­seen yksin­ker­tai­ses­ti vas­ta­ten on WCAG 2.1. vii­mei­sin ver­sio verk­ko­si­säl­lön saavutettavuusohjeistuksesta.

Verk­ko­si­säl­lön saa­vu­tet­ta­vuus­oh­jeis­tus tekee verk­ko­si­säl­lön saa­vu­tet­ta­vak­si niil­le, joil­la on esimerkiksi:

• oppi­mis­vai­keuk­sia
• lii­kun­ta­ra­joit­tei­ta
• puhe­vam­mo­ja
• valo­herk­kyyt­tä
• sokeut­ta tai heikkonäköisyyttä
• kuu­rout­ta tai huonokuuloisuutta

Tämän ohjeis­tuk­sen nou­dat­ta­mi­nen paran­taa verk­ko­si­säl­lön saa­vu­tet­ta­vuut­ta ja verk­ko­si­vu­jen käy­tet­tä­vyyt­tä tie­to­ko­neil­la, table­teil­la sekä mobiililaitteilla.

WCAG 2.1 -ohjeistuksen pääkategoriat

Verk­ko­pal­ve­lun saa­vu­tet­ta­vuus koos­tuu hyväs­tä tek­ni­ses­tä toteu­tuk­ses­ta, sel­keäs­tä käyt­tö­liit­ty­mäs­tä sekä ymmär­ret­tä­väs­tä sisäl­lös­tä. Tutus­tum­me nyt WCAG 2.1 -ohjeis­tuk­sen nel­jään pää­ka­te­ko­ri­gaan, joi­ta nou­dat­ta­mal­la verk­ko­pal­ve­lus­ta on mah­dol­lis­ta raken­taa saa­vu­tet­ta­va ja help­po­käyt­töi­nen kai­ken­lai­sil­le kävi­jöil­le – sil­lä ei voi­da olet­taa, että sivus­ton kävi­jä näkee, kuu­lee tai kyke­nee toi­mi­maan normaalisti.

1. Havaittavuus

Suo­mes­sa on esi­mer­kik­si kym­me­niä tuhan­sia heik­ko­nä­köi­siä ihmi­siä, jot­ka tar­vit­se­vat avus­ta­via luku­lait­tei­ta sivus­tol­la ole­van infor­maa­tion havait­se­mi­seen. Havait­ta­vuus tar­koit­taa sitä, että sivus­ton ele­men­tit, kuten pai­nik­keet, kuvat, teks­tit ja lomak­keet ovat hel­pos­ti havait­ta­vis­sa eri tavoil­la. Voi­ko vaik­ka­pa kuu­lo­vam­mai­nen asia­kas kat­soa sivus­tol­le­si upo­te­tun esit­te­ly­vi­deon ilman ään­tä niin, että hän ymmär­tää videon viestin?

2. Hallittavuus

Täl­lä tar­koi­te­taan sivus­ton käyt­tö­liit­ty­män hal­lit­ta­vuut­ta. Jokai­sen toi­min­non on olta­va käy­tet­tä­vis­sä eri­lai­sil­la apu­vä­li­neil­lä, kuten esi­mer­kik­si ruu­dun­lu­kuoh­jel­mal­la – sokean on pääs­tä­vä pai­na­maan pai­ni­ket­ta yhtä hel­pos­ti kuin hen­ki­lön, jon­ka näkö­ais­ti on nor­maa­li. Toi­min­nois­ta kan­nat­taa teh­dä yksin­ker­tai­sia ja sel­kei­tä, jol­loin hal­lit­ta­vuus helpottuu.

3. Ymmärrettävyys

Häm­men­tyi­sit­kö, jos sivus­ton navi­gaa­tio oli­si­kin ylä­reu­nan sijaan ala­reu­nas­sa, jos­ta et edes osai­si etsiä sitä? Ymmär­ret­tä­vyy­del­lä tar­koi­te­taan sivus­ton loo­gis­ta toi­min­taa. Käyt­tä­jän tuli­si pys­tyä liik­ku­maan sivus­tol­la hel­pos­ti eri­lai­sia reit­te­jä pit­kin niin, että hän on aina tie­toi­nen sii­tä, mis­sä koh­taa sivus­toa on ja kuin­ka pää­see esi­mer­kik­si etusi­vul­le takaisin.

4. Toimintavarmuus

Toi­min­ta­var­muus tun­ne­taan myös ter­mi­nä luja­te­koi­suus. On tär­ke­ää, että kaik­ki sivus­ton toi­min­nat ovat yhteen­so­pi­via avus­ta­vien ohjel­mien kans­sa. Nämä kri­tee­rit täyt­ty­vät oikean­lai­sel­la koo­dauk­sel­la, sil­lä ainoas­taan vir­heet­tö­mät koo­din­pät­kät takaa­vat toi­min­ta­var­muu­den eri­lais­ten tek­no­lo­gioi­den kanssa.

WCAG 2.1. -ohjeistuksen onnistumiskriteerit (A, AA ja AAA)

Onnis­tu­mis­kri­tee­rit ker­to­vat, kuin­ka hyvin sivus­to­si on saa­vu­tet­ta­vis­sa. Osaa yri­tyk­sis­tä ja jär­jes­töis­tä kos­kee myös laki, jon­ka mukaan verk­ko­si­vus­ton saa­vu­tet­ta­vuu­den on olta­va vähin­tään WCAG 2.1 -ohjeis­tuk­sen AA-tason eli kes­ki­ta­son mukai­nen. Käy­dään nyt yhdes­sä läpi nämä kol­me onnis­tu­mis­kri­tee­riä, joi­ta aiem­min myös prio­ri­tee­teik­si kutsuttiin.

A (minimitaso)

A-tason sivus­to ei pal­ve­le kaik­kia käyt­tä­jiä. Mikä­li sivus­to on tasol­taan A, voi siel­lä asioi­des­saan esi­mer­kik­si lii­kun­ta­ra­joit­tei­nen hen­ki­lö vahin­gos­sa suo­rit­taa toi­min­non, kuten pois­taa jon­kin asian, vaik­ka hän ei oli­si halun­nut sitä toi­min­toa tehdä.

AA (keskitaso)

AA-tason sivus­to pal­ve­lee suu­rin­ta osaa käyt­tä­jis­tä. Mikä­li sivus­to on tasol­taan AA, huo­mioi se muun muas­sa teks­tin koon luet­ta­vuu­den ja ymmär­ret­tä­vyy­den kan­nal­ta sekä esi­mer­kik­si lomak­keen kent­tien erot­tu­mi­sen taus­tas­ta tar­peek­si hyvin.

AAA (paras taso)

AAA-tason sivus­to pal­ve­lee lähes jokais­ta käyt­tä­jää. Mikä­li sivus­to on tasol­taan AAA, huo­mioi se kat­ta­vas­ti kai­ken­lai­set tar­peet. Kävi­jää esi­mer­kik­si varoi­te­taan sil­loin, kun täy­te­tyt tie­dot katoa­vat esi­mer­kik­si tie­tyn ajan kuluttua.

Siteimprove, ja muut saavutettavuuden arviointityökalut

Vaik­ka sivus­to näyt­täi­si sil­min­näh­den hyväl­tä, kan­nat­taa verk­ko­si­säl­lön saa­vu­tet­ta­vuus tar­kas­taa sii­hen suun­ni­tel­lul­la työ­ka­lul­la. Saa­vu­tet­ta­vuu­den arvioin­ti­työ­ka­lut hel­pot­ta­vat sivus­ton vie­mis­tä AA- ja AAA-tasol­le, jot­ka teke­vät sivus­ton käyt­tä­mi­ses­tä miellyttävää.

Me Kublal­la suo­sit­te­lem­me työ­ka­lua nimel­tä Siteim­pro­ve. Se nimen­sä mukai­ses­ti aut­taa sinua kehit­tä­mään sivus­toa­si parem­mak­si. Kysei­sen työ­ka­lun avul­la voit tar­jo­ta kai­kil­le saa­vu­tet­ta­van brän­di­ko­ke­muk­sen sekä luo­da vir­hee­tön­tä ja luo­tet­ta­vaa sisäl­töä sivus­to­si jokai­sel­le kävi­jäl­le kykyi­hin katsomatta.

Siteim­pro­ve on mie­les­täm­me kai­kis­ta toi­mi­vin koko­nai­suus sivus­ton saa­vu­tet­ta­vuu­den kehit­tä­mi­seen, mut­ta mui­ta­kin vaih­toeh­to­ja toki on:

• AChec­ker
• axe Tools
• Google Light­house
• Web Acces­si­bi­li­ty Eva­lu­tion Tool

Verk­ko­si­säl­lön saa­vu­tet­ta­vuut­ta voi tes­ta­ta myös itse. Kokei­le käyt­tää ruu­dun­lu­kuoh­jel­maa, tar­kis­ta sivus­ton saa­vu­tet­ta­vuus eri­lai­sil­la pää­te­lait­teil­la, selai­mil­la sekä selain­ver­sioil­la ja mus­ta­val­koi­se­na otta­mal­la pois verk­ko­se­lai­men värit. Sivus­ton kehit­tä­mi­nen on huo­mat­ta­vas­ti hel­pom­paa, kun kat­se­let sivus­toa esi­mer­kik­si näkö­vam­mai­sen silmin.

Vink­ki: Vaik­ka saa­vu­tet­ta­vuu­den arvioin­ti­työ­ka­lut ovat tär­keäs­sä ase­mas­sa, on fik­sua käyt­tää saa­vu­tet­ta­vuu­den arvioin­tiin myös ihmis­tä. Tee siis alkuun arvioin­ti sii­hen tar­koi­te­tul­la työ­ka­lul­la, pyy­dä käyt­tö­ko­ke­mus­ta sit­ten esi­mer­kik­si huo­no­nä­köi­sel­tä hen­ki­löl­tä, tee muu­tok­set ja tar­kis­ta saa­vu­tet­ta­vuus vie­lä ker­ran arviointityökalulla.

Saavutettavuus vaikuttaa kokonaisvaltaiseen käyttömukavuuteen

Kun pai­nik­keis­ta on help­po kli­ka­ta, sivus­to on loo­gi­nen ja teks­ti sel­ke­ää, tun­tuu verk­ko­si­vuil­la tai -kau­pas­sa asioin­ti muka­vam­mal­ta, oli kävi­jäl­lä sit­ten vam­ma tai ei. Saa­vu­tet­ta­vuu­den paran­ta­mi­nen vai­kut­taa usein myös sivus­ton koko­nais­val­tai­seen käyt­tö­mu­ka­vuu­teen, mikä puo­les­taan näkyy tyy­ty­väi­si­nä asiakkaina.

Saavutettavat verkkosivut ammattilaisen tekemänä

Verk­ko­si­säl­lön saa­vu­tet­ta­vuus­oh­jeis­tus on laa­dit­tu syys­tä. Mikä­li koet, että tasa-arvo ja oikeu­den­mu­kai­suus ovat yri­tyk­sel­le­si tär­kei­tä arvo­ja, etkä halua raja­ta verk­ko­pal­ve­lusi ulko­puo­lel­le sato­ja tuhan­sia suo­ma­lai­sia, kan­nat­taa verk­ko­si­vus­ton saa­vu­tet­ta­vuu­teen kiin­nit­tää eri­tyis­tä huo­mio­ta. Meil­tä saat tar­vit­taes­sa ammat­ti­tai­dol­la teh­dyt saa­vu­tet­ta­vat verk­ko­si­vut, jois­sa jokai­nen tär­keä yksi­tyis­koh­ta on huomioitu.