Siirry pääsisältöön

Verk­ko­si­vu­jen saa­vu­tet­ta­vuus

Verkkopalvelujen saavutettavuus kannattaa huomioida jo suunnittelu- ja toteutusvaiheessa.
Nuori nainen istuu sohvalla, hymyilee ja kuuntelee kuulokkeilla, älypuhelin käsissään.

Tällä sivulla

Saavutettavuuden testaaminen

Tehokkain tapa edistää verkkopalvelujen saavutettavuutta ja helppokäyttöisyyttä on huomioida saavutettavuus jo palvelun suunnittelu- ja toteutusvaiheessa.

Asiantuntijoiden mukaan verkkosisältöjen teknisen toteutuksen saavutettavuutta määrittävä WCAG-standardi kattaa noin puolet kaikista saavutettavuuteen liittyvistä ongelmista. Erilaisten koneellisten työkalujen avulla tavoitetaan keskimäärin 15–20 prosenttia kaikista puutteista. Siksi pelkkä koneellinen sivujen läpikäynti ei riitä takaamaan palvelun saavutettavuutta, vaikka erilaisten työkalujen avulla voidaan helposti tunnistaa selkeitä ja tyypillisiä puutteita palvelun teknisessä toteutuksessa.

Yhdistämällä kehitysprosessin aikaiseen testaukseen sekä saavutettavuuden testaustyökalujen käytön että manuaalisen läpikäynnin voidaan havaita useita ongelmia, joiden korjaaminen julkaisuvaiheessa tai sen jälkeen on vaikeaa tai mahdotonta.

Koneellinen testaus

Erilaisten työkalujen avulla voidaan selvittää lähinnä verkkopalvelun tekniseen toteutukseen liittyviä puutteita.  Yleisesti nämä testausrobotit vertaavat sivun lähdekoodia WCAG-esteettömyysstandardin vaatimuksiin ja raportoivat havaitut poikkeamat.

Lisäksi tarjolla on työkaluja tekstien ja taustavärien välisen kontrastin tarkistamiseen sekä värisokeuteen liittyvien ongelmallisten väriyhdistelmien käyttöön.

Teknisen toteutuksen testaustyökaluja

Achecker on Kanadan liittovaltion kehittämä testaustyökalu. Se vertaa lähdekoodia WCAG-esteettömyysstandardiin ja raportoi havaitut poikkeamat ja puutteet. Työkaluun voi joko syöttää julkisen verkko-osoitteen tai liittää HTML-koodia, jolloin sitä voi käyttää myös kehitysvaiheessa olevien sivujen koodin arviointiin.

Wave-selainlaajennus

Firefox- ja Chrome-selaimille on saatavilla Wave-laajennus, jonka avulla voi tutkia selaimeen ladatun verkkosivun saavutettavuuteen liittyviä ongelmia. Pelkkää lähdekoodia tarkastelevaan robottiin verrattuna Wave-laajennuksen avulla voi selvittää esimerkiksi erilaisten dynaamisten sisältöjen ja toiminnallisuuksien saavutettavuutta.

Kontrastien ja värimääritysten tarkistus

Verkossa on runsaasti työkaluja, joilla voi tarkistaa tekstien ja taustavärien riittävän kontrastin.

Vision Australian kehittämän Color Contrast Analyser –sovelluksen etuna on, että sillä voi arvioida tekstien ja taustavärien välistä kontrastia myös esimerkiksi näyttökuvista tai visuaalisista suunnitelmakuvista. Lisäksi sovellus tarkistaa, aiheutuuko väriyhdistelmästä värisokeuteen liittyviä ongelmia.

Manuaalinen testaus

Verkkopalvelun koneellisen tarkistuksen lisäksi erityisesti erilaiset vuorovaikutteiset toiminnot tulee käydä läpi manuaalisesti. Testaus on hyvä suorittaa käyttämällä sekä pelkkää näppäimistöä että jotain ruudunlukuohjelmaa.

Testaus ilman hiirtä

Käyttämällä palvelua ilman hiirtä voi tarkistaa, ovatko kaikki toiminnallisuudet saavutettavissa näppäimistöllä. Samalla voi selvittää, onko sivustolla käytettävä WCAG-standardin vaatimusten mukainen näkyvä fokus riittävä eli pystyykö käyttäjä havaitsemaan koko ajan, mikä käyttöliittymän elementti kulloinkin on kohdistettuna.

Testaus ruudunlukuohjelmalla

Kun suunnittelet ja rakennat verkkosivuja, kannattaa työn edetessä kokeilla, toimivatko valitut ratkaisut myös näkövammaisten käyttämillä ruudunlukuohjelmilla. Ruudunlukuohjelmien tehokas hyödyntäminen vaatii käyttäjältään perehtymistä, mutta jo muutamalla perustoiminnolla pystyy tekemään suuntaa-antavan tarkistuksen ja hyödyntämään ruudunlukuohjelmaa osana kehitys- ja ylläpitotyötä.

Ruudunlukuohjelma on apuväline, joka kertoo käyttäjälle puheena ruudulla visuaalisesti esitettävää informaatiota. Käyttämällä ruudunlukuohjelmaa voi varmistaa, että kaikista käyttöliittymän ja sisällön elementeistä välittyy tarpeellinen tieto käyttäjälle.

Ruudunlukuohjelmalla verkkosivuja testattaessa tulee ymmärtää näkövammaisen käyttökokemus, jossa henkilöllä ei sivulle tullessaan muodostu kerralla yleiskäsitystä sivun rakenteesta tai sisällöstä. Vaikutelma syntyy vähitellen sivulla liikkuessa, missä tärkeänä osana on muun muassa sivun oikea rakenne.

Ruudunlukuohjelman käyttö eroaa tavanomaisesta sivujen käytöstä näppäimistöllä siten, että sivulla liikutaan yleensä nuolinäppäimien ja erilaisten pikanäppäimien avulla. Nuoli alas- ja nuoli ylös –näppäimet siirtävät ruudunlukijan kohdistusta seuraavaan tai edelliseen elementtiin mukaan lukien sivun tekstisisällöt, jotka ohitetaan liikuttaessa sivulla sarkainnäppäimellä.

Sekä iOS- että Android-laitteissa on valmiina erilaisia esteettömyysasetuksia, joiden avulla esimerkiksi näkövammaiset voivat käyttää kosketusnäytöllisiä mobiililaitteita. iOS-järjestelmän ruudunlukuohjelman nimi on VoiceOver, ja Android-laitteissa ruudunlukuohjelma on nimeltään TalkBack. Windows-järjestelmässä testaukseen voi käyttää ilmaista NVDA-ruudunlukuohjelmaa.

Olemme kirjoittaneet sekä iOS-järjestelmän VoiceOver-ruudunlukijan että Android-järjestelmän TalkBack-ruudunlukijan käyttöä ohjeistavat tekstit. Nämä ohjeet on tarkoitettu työkaluiksi sovellusten kehittäjille ja verkkopalveluiden parissa työskenteleville.

Tekstin koko

Mahdollisuus muuttaa sivuston leipätekstin ja otsikoiden kokoa selaimen asetusten avulla voi olla merkittävä apu monille lievemmistä näköongelmista kärsiville. Myös WCAG-standardin vaatimuksiin kuuluu mahdollisuus mukauttaa tekstin kokoa aina 200 prosenttiin asti ilman erityisiä apuvälineitä.

Mahdollisuus muuttaa tekstin kokoa on helppo tarkistaa esimerkiksi Internet Explorer -selaimella valitsemalla Näytä-valikosta "Tekstin koko" ja verrata tekstin kokoa suurimmalla ja pienimmällä asetuksella. Referenssinä voi käyttää esimerkiksi Googlen hakukoneen tulossivua, jolla tekstin koko on muutettavissa asianmukaisesti.

Huomioitavaa on, että tekstin koon muuttamisella ei tarkoiteta samaa kuin selaimen koko näkymän zoomaaminen esimerkiksi näppäinyhdistelmällä Ctrl ja +, jolloin myös graafisten elementtien koko kasvaa.

Tekstin koon suurentaminen tai pienentäminen ei saa myöskään tehdä sivun asettelusta tai rakenteesta vaikeaa ymmärtää, vaan asettelun tulee mukautua tekstin koon muutoksiin.

Helppokäyttöisyyden arviointi

Palvelun teknisen toteutuksen testauksen lisäksi tulee arvioida sen kognitiivista saavutettavuutta eli helppokäyttöisyyttä. Tässä arvioinnissa tarkastellaan muun muassa toiminnallisuuksien ja sisällön määrää yksittäisellä sivulla, käyttöliittymän ymmärrettävyyttä, visuaalisen suunnittelun selkeyttä ja tekstisisältöjen selkeyttä.

Arviointiin voi käyttää Kehitysvammaliiton Papunetin pikaopasta.

Lue lisää