Saa­vu­tet­ta­vuus huo­mioi­tu -lei­man au­di­toin­tik­ri­tee­rit

Auditointikriteerit on jaettu kahteen; WCAG 2.0 -standardin mukaisiin kriteereihin sekä muihin lisäkriteereihin.

WCAG 2.0

Tarkastuskohta WCAG-prioriteetti
WCAG 2.0.  
Periaate 1: Havaittava – Informaatio ja käyttöliittymäkomponentit pitää esittää tavoilla, jotka käyttäjä voi havaita.  
Ohje 1.1 Tekstivastineet: Tarjoa tekstivastineet kaikelle ei-tekstuaaliselle sisällölle siten, että sisältö voidaan muuttaa muihin tarvittaviin muotoihin, kuten isokokoiseksi tekstiksi, pistekirjoitukseksi, puheeksi, symboliksi tai yksinkertaisemmaksi kieleksi.  
1.1.1 Ei-tekstuaalinen sisältö: Kaikki käyttäjälle esitettävä ei-tekstuaalinen sisältö on varustettu saman tarpeen täyttävällä tekstivastineella, pois lukien alla luetellut tapaukset (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). A
Ohje 1.2 Aikasidonnainen media: Tarjoa vastine aikasidonnaiselle medialle.  
1.2.1 Pelkkä audio tai pelkkä video (tallennettu): Seuraava pätee tallennetulle pelkälle audiomedialle ja tallennetulle pelkälle videomedialle, paitsi kun audio tai video on tekstin mediavastine ja selvästi merkitty sellaiseksi (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). A
1.2.2 Tekstitys (tallennettu): Kaikelle synkronoidussa mediassa olevalle tallennetulle audiosisällölle on tarjolla tekstityksiä, paitsi kun media on tekstin mediavastine ja selvästi merkitty sellaiseksi. A
1.2.3 Ääniselite tai mediavastine (tallennettu): Synkronoidulle medialle on tarjolla aikasidonnaisen median vastine tai ääniselite tallennetusta videosisällöstä, paitsi kun media on tekstin mediavastine ja selvästi merkitty sellaiseksi. A
Ohje 1.3 Mukautettava: Tuota sisältöä, joka voidaan esittää eri tavoin (esimerkiksi yksinkertaisemman asettelun avulla) informaatiota tai rakennetta menettämättä.  
1.3.1 Informaatio ja suhteet: Esitystavassa välittyvät informaatio, rakenne ja suhteet voidaan selvittää ohjelmallisesti tai ne ovat saatavilla tekstinä. A
1.3.2 Merkitykseen vaikuttava järjestys: Kun sisällön esitysjärjestys vaikuttaa sisällön merkitykseen, oikea lukemisjärjestys voidaan selvittää ohjelmallisesti. A
1.3.3 Aistinvaraiset ominaispiirteet: Ohjeet sisällön ymmärtämiseksi ja hallitsemiseksi eivät riipu yksinomaan komponenttien aistinvaraisista ominaispiirteistä kuten muoto, koko, visuaalinen sijainti, suunta tai ääni. A
Ohje 1.4 Erottuva: Helpota käyttäjiä näkemään ja kuulemaan sisältö lisäämällä taustasta erottuva etuala.  
1.4.1 Värien käyttö: Väriä ei käytetä ainoana visuaalisena keinona välittämään informaatiota, esittämään toimintoa, pyytämään vastausta tai korostamaan visuaalista elementtiä. A
1.4.2 Audion kontrollointi: Jos jokin ääni verkkosivulla soi automaattisesti kauemmin kuin kolme sekuntia, käytettävissä on joko mekanismi äänen keskeyttämiseen tai pysäyttämiseen tai mekanismi äänen voimakkuuden säätämiseen koko järjestelmän äänenvoimakkuuden säädöstä riippumatta. A
1.4.3 Kontrasti (minimi): Tekstin visuaalisella esityksellä ja tekstiä esittävissä kuvissa kontrastisuhde on vähintään 4,5:1, paitsi seuraavissa tapauksissa (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). AA
1.4.4 Tekstin koon muuttaminen: Lukuun ottamatta tekstitystä ja tekstiä esittäviä kuvia tekstin kokoa voidaan muuttaa ilman avustavaa teknologiaa aina 200 prosenttiin asti ilman sisällön tai toiminnallisuuden menettämistä.  AA
1.4.5 Tekstiä esittävät kuvat: Jos käytetty teknologia voi tuottaa visuaalisen esityksen, käytetään informaation välittämiseen ennemmin tekstiä kuin tekstiä esittäviä kuvia, paitsi seuraavissa tapauksissa (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). AA
Periaate 2: Hallittava – Käyttöliittymäkomponenttien ja navigoinnin pitää olla hallittavia.  
Ohje 2.1 Käytettävissä näppäimistöltä: Toteuta kaikki toiminnallisuus siten, että se on käytettävissä näppäimistöltä.  
2.1.1 Näppäimistö: Kaikki sisällön toiminnallisuus on hallittavissa näppäimistörajapinnan välityksellä ilman vaatimusta yksittäisten näppäinpainallusten erityisestä ajoittamisesta, paitsi kun alla oleva toiminnallisuus vaatii syötettä, joka riippuu käyttäjän liikkeiden polusta eikä vain päätepisteistä. A
2.1.2 Ei näppäimistöä -ansa: Jos näppäimistön fokus voidaan siirtää sivun komponentille näppäimistörajapintaa käyttämällä, niin fokus voidaan siirtää myös pois kyseiseltä komponentilta pelkästään näppäimistörajapintaa käyttämällä. Mikäli tämä vaatii enemmän kuin muuttumattomia nuoli- tai tab-näppäimiä tai muita standardinmukaisia poistumismenetelmiä, käyttäjälle neuvotaan menetelmä fokuksen poissiirtämiseksi. A
Ohje 2.2 Tarpeeksi aikaa: Anna käyttäjille tarpeeksi aikaa lukea ja käyttää sisältöä.  
2.2.1 Säädettävä ajoitus: Jokaiselle sisällön asettamalle aikarajalle ainakin yksi seuraavista pitää paikkansa (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). A
2.2.2 Keskeytä, pysäytä, piilota: Kaikki seuraavat pitävät paikkansa liikkuvalle, vilkkuvalle, vierivälle tai automaattisesti päivittyvälle informaatiolle (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). A
Ohje 2.3 Sairauskohtaukset: Älä suunnittele sisältöä tavalla, jonka tiedetään aiheuttavan sairauskohtauksia.  
2.3.1 Kolme välähdystä tai alle -raja-arvo: Verkkosivut eivät sisällä mitään, joka milloinkaan välähtäisi useammin kuin kolme kertaa sekunnissa, tai välähdys on alle yleisen välähdyksen ja punaisen välähdyksen raja-arvojen.  A
Ohje 2.4 Navigoitava: Tarjoa käyttäjille tapoja navigoida, etsiä sisältöä ja määrittää sijaintinsa.  
2.4.1 Ohita lohkot: Tarjolla on mekanismi sellaisten sisällön lohkojen ohittamiseen, jotka toistuvat useilla verkkosivuilla. A
2.4.2 Sivuotsikot: Verkkosivuilla on otsikot, jotka kuvailevat aiheen tai merkityksen. A
2.4.3 Fokusjärjestys: Jos verkkosivu voidaan navigoida järjestyksessä ja navigointijärjestykset vaikuttavat merkitykseen tai toimintoon, fokusoitavissa olevat komponentit vastaanottavat fokuksen merkityksen ja toimivuuden säilyttävässä järjestyksessä. A
2.4.4 Linkin tarkoitus (kontekstissa): Jokaisen linkin tarkoitus voidaan selvittää yksin linkkitekstistä tai linkkitekstistä yhdessä ohjelmallisesti selvitettävissä olevan linkkikontekstin avulla, paitsi tilanteissa, joissa linkki olisi yleisesti ottaen epäselvä käyttäjille. A
2.4.5 Useita tapoja: Käytettävissä on enemmän kuin yksi tapa paikallistaa yksi verkkosivu verkkosivujen joukosta, paitsi silloin kun verkkosivu on prosessin lopputulos tai vaihe. AA
2.4.6 Otsikot ja nimilaput: Otsikot ja nimilaput kuvailevat aiheen tai merkityksen. AA
2.4.7 Näkyvä fokus: Kaikilla näppäimistöltä käytettävillä käyttöliittymillä on käyttömoodi, jossa näppäimistön fokusindikaattori on näkyvissä.  AA
Periaate 3: Ymmärrettävä - Informaation ja käyttöliittymän toiminnan pitää olla ymmärrettävää.  
Ohje 3.1 Luettava: Tee tekstisisällöstä luettavaa ja ymmärrettävää.  
3.1.1 Sivun kieli: Jokaisen verkkosivun oletusarvoinen luonnollinen kieli voidaan selvittää ohjelmallisesti. A
3.1.2 Osien kieli: Sisällön jokaisen tekstikatkelman tai ilmaisun luonnollinen kieli voidaan selvittää ohjelmallisesti, paitsi seuraavien osalta: erisnimet, tekniset termit, määrittämättömän kielen sanat sekä sanat tai ilmaisut, jotka ovat muuttuneet läheisen tekstiympäristön kielen murteelliseksi osaksi. AA
Ohje 3.2 Ennakoitava: Tee verkkosivuista sellaisia, että niiden ilmiasu ja toiminta ovat ennakoitavissa.  
3.2.1 Fokusointi: Kun mikä tahansa komponentti vastaanottaa fokuksen, se ei aiheuta kontekstin muutosta. A
3.2.2 Syöte: Minkään käyttöliittymäkomponentin asetuksen muuttaminen ei automaattisesti aiheuta kontekstin muutosta, ellei käyttäjää ole ohjeistettu tällaisesta toiminnosta ennen komponentin käyttöä. A
3.2.3 Johdonmukainen navigointi: Verkkosivujen joukon useilla verkkosivuilla toistuvat navigointimekanismit esiintyvät aina samassa suhteellisessa järjestyksessä, ellei käyttäjä toisin valitse. AA
3.2.4 Johdonmukainen tunnistaminen: Komponentit, joilla on sama toiminnallisuus verkkosivujen joukossa, tunnistetaan johdonmukaisesti.  AA
Ohje 3.3 Syötteen avustaminen: Auta käyttäjiä välttämään ja korjaamaan virheitä.  
3.3.1 Virheen tunnistaminen: Jos syötevirhe havaitaan automaattisesti, virheellinen kohta tunnistetaan ja virhe kuvataan käyttäjälle tekstimuotoisena. A
3.3.2 Nimilaput tai ohjeet: Kun sisältö edellyttää käyttäjän syötettä, tarjolla on nimilappuja tai ohjeita.  A
3.3.3 Virheen korjausehdotus: Jos syötevirhe havaitaan automaattisesti ja korjausehdotukset tunnetaan, ehdotukset esitetään käyttäjälle, paitsi jos tämä vaarantaisi tietoturvan tai sisällön merkityksen. AA
3.3.4 Virheiden ennaltaehkäisy (lakiin perustuva, taloudellinen, data): Verkkosivuille, joista seuraa käyttäjälle lakiin perustuvia sitoumuksia tai taloudellisia transaktioita, jotka muokkaavat tai poistavat käyttäjän hallinnoimaa dataa tietovarastossa tai jotka lähettävät käyttäjän testivastauksia, ainakin yksi seuraavista pitää paikkansa (ks. tarkemmin http://www.w3.org/Translations/WCAG20-fi/). AA
Periaate 4: Lujatekoinen – Sisällön pitää olla riittävän lujatekoinen, jotta se voidaan luotettavasti tulkita laajalla joukolla asiakasohjelmia, mukaan lukien avustavat teknologiat  
Ohje 4.1 Yhteensopiva: Maksimoi yhteensopivuus nykyisten ja tulevien asiakasohjelmien kanssa, mukaan lukien avustavat teknologiat.  
4.1.1 Jäsentäminen: Kun sisältö on toteutettu merkkauskieliä käyttämällä, elementeillä on täydelliset alku- ja lopputagit, elementit on järjestetty sisäkkäin määritystensä mukaan, samaa attribuuttia ei ole annettu elementeille moneen kertaan ja kaikki ID-tyyppiset tunnisteet ovat yksilöllisiä paitsi tilanteissa, joissa määritykset sallivat tämänkaltaiset ominaisuudet. A
4.1.2 Nimi, rooli, arvo: Kaikkien käyttöliittymäkomponenttien (mukaan lukien lomake-elementit, linkit ja skriptien tuottamat komponentit) nimi ja rooli voidaan selvittää ohjelmallisesti; tilat, ominaisuudet ja arvot, jotka käyttäjä voi asettaa, voidaan myös asettaa ohjelmallisesti; ja tieto näiden muutoksista on asiakasohjelmien saatavissa, mukaan lukien avustavat teknologiat. A

Lisäkriteerit

1. Ulkoasun ymmärrettävyys

1.1 Eri elementtien merkitys ja suhteet on helppo ymmärtää ulkoasun ja asettelun perusteella

Otsikot, navigaatiovalikko, linkit, lomakeelementit, yms. sivuston elementit ovat tunnistettavissa ja erotettavissa toisistaan ulkoasun perusteella.Sivuston elementit on muotoiltu ja sijoiteltu niin, että ulkoasu kertoo niiden merkityksestä ja suhteesta toisiinsa.

Klikattavat elementit ovat riittävän isoja, erillään toisistaan ja sivun laidoista, ja koko aktiiviselta näyttävä alue on aktiivinen.

Samalla rivillä olevat linkit on erotettu jollakin erotinmerkillä.

Täytettävät lomakekentät ovat allekkain ja niihin liittyvät ohjetekstit ovat ennen täyttökenttää joko yläpuolella tai vasemmalla.

Elementit, joilla on sama tarkoitus tai ne toimivat samalla lailla, on sijoitettu loogisesti lähelle toisiaan ja niiden visuaalinen ilme muistuttaa myös toisiaan.

1.2 Tekstin oletuskoko on riittävä/ ja se on muotoiltu niin, että se on helppolukuista

Käytetty kirjasintyyppi on kirjainmuodoiltaan selkeä ja ilmava. Tehokeinoja (esim. kursiivi, lihavointi, versaali) ei käytetä tai niitä käytetään perustellusti. Riviväli on riittävä. Tekstirivit eivät ole liian pitkiä. Teksti on tasattu vasempaan reunaan (jos tekstiä luetaan vasemmalta oikealle).

1.3 Linkin teksti ja kohdesivun otsikko vastaa toisiaan

Kun käyttäjä klikkaa linkkiä, kohdesivun otsikko vastaa linkin tekstiä. Jos tämä ei ole mahdollista, niin käyttäjälle tehdään selväksi, että on tultu sivulle, jolle on ollut tarkoituskin tulla.

2. Informaation määrä ja kontekstuaalisuus

Tärkeä tieto on HTML-muodossa, ei esimerkiksi ainoastaan PDF- tai Word-muodossa. Näytöllä on samaan aikaan näkyvillä vain kohtuullinen määrä eri elementtejä, esimerkiksi tekstiä, linkkejä, kuvia jne.

Kontekstin kannalta on näkyvissä vain olennainen informaatio ja toiminnot. Muu informaatio on linkin tai toimintopainikkeen takana.

3. Sivustolla navigointi

3.1 Sivustolla on helppo liikkua ja sisältö on helppo löytää

Sivuston navigointi ja rakenne on looginen ja ymmärrettävä, eikä se ole liian monitasoinen tai jollain muulla tavalla hankalasti ymmärrettävä/hallittava.

Linkin tai toimintopainikkeen klikkaaminen ei aiheuta suurta muutosta sivustolla tai se on ennakoitavissa

Kun klikataan linkkiä tai toimintopainiketta, se ei aiheuta suurta muutosta sivupohjan rakenteessa. Jos suuri muutos on pakollinen, se on käyttäjän ennakoitavissa. Linkin tai toimintopainikkeen klikkaamisen jälkeen eri osiot säilyvät ulkoasultaan riittävän yhtenäisinä ja sivun perusosien sijainti säilyy samana. Huomio ei kiinnity uudelleenorientoitumiseen.

3.2 Käyttäjän sijainti sivustolla ilmaistaan

Käyttäjän sijainti ilmaistaan vähintään yhdellä tavalla. Jos sivustolla käytetään navigaatiorakennetta, näytetään käyttäjälle hänen sijaintinsa tässä rakenteessa.

4. Palaute käyttäjälle

4.1 Monivaiheisen toiminnon vaiheet ilmoitetaan

Jos toimintoon liittyy monta vaihetta, käyttäjälle ilmoitetaan selkeästi montako eri vaihetta on, missä vaiheessa ollaan ja mikä on seuraava vaihe.

4.2 Palaute käyttäjän toiminnoista ilmoitetaan

Onnistumisesta ja epäonnistumisesta informoidaan käyttäjää selkeästi (esim. lomakkeen lähettämisen jälkeen). Käyttäjä saa tiedon, mitä pitää tehdä virhetilanteen korjaamiseksi, esimerkiksi osoittamalla virheen paikka, esittämällä korjausehdotus tai kertomalla vaihtoehtoisista menettelytavoista.

5. Sisällön ymmärrettävyys ja sivustolla käytettävä kieli

5.1 Lomakekenttien otsikot kertovat tarkasti mitä kenttään syötetään ja missä muodossa

Jos edellytetään tiedon syöttämistä tarkasti määritellyssä muodossa, tämä osoitetaan esimerkein lomakekentän yhteydessä. Mikäli lomake on käyttäjän kannalta hankalasti ymmärrettävä tai monitulkintainen, siihen on olemassa ohje.

5.2 Sisältö on kirjoitettu selkeällä yleiskielellä tai selkokielellä käyttäen käyttäjäryhmälle tuttua kieltä.

Linkkien ja toimintopainikkeiden teksteissä käytetään käyttäjälle tuttua kieltä. Linkkien nimet eroavat toisistaan riittävästi, kun ne luetaan ääneen, eikä niissä ole pitkää yhtenevää alkuosaa.

Kaikissa sivuston teksteissä käytetään konkreettista ja käyttäjälähtöistä selkeää yleiskieltä tai selkokieltä, mikäli se on kohderyhmien takia perusteltua.

Sisältöteksteissä ei ole pitkiä tekstimassoja, ja suositaan lyhyitä kappaleita, väliotsikoita, listoja, kuvia ja videoita. Tärkein asia on sijoitettu tekstin alkuun tai korostettu muilla keinoin. Tekstissä ei käytetä selittämättömiä lyhenteitä.

6. Käytettävyys

Merkittävät käytettävyyshavainnot tehdään yleisten käytettävyysheuristiikkojen perusteella (esim. Nielsen).