Kontrastin tarkistaminen Wave-ohjelmalla

Värien ja kontrastien tarkistaminen käy helpoiten käyttämällä Wave-työkalua. Wave:a voi käyttää selaimella taikka asentamalla selain-laajennus (laajennus löytyy myös Chrome- ja Firefox-selaimille).

WCAG 2.0 tason AA kriteeriin mukaan kontrastisuhde pitää olla vähintään 4.5:1 normaali tekstillä ja otsikossa 3:1.

Kontrastin tarkistus Wave-työkalulla tapahtuu Contrast-välilehden kautta.

Kontrasti riittävän suuri

Kontrasti riittävän suuri

Kontrasti liian pieni (ei täytä WCAG 2.0 tason AA vaatimusta)

Kontrasti liian pieni

Värien valinta

Värien valinnassa kannattaa huomioida että tekstin ja taustan välillä on riittävät konstrasti ja tausta ei ole liian levoton. Kannattaa myös pyrkiä välttämään liian räikeitä värejä, etenkin jos se tekee tekstin hahmottamisesta hankalaa.

Linkkejä

Wave-työkalu: http://wave.webaim.org/ (tyylien ja värikontrastin tarkistus)

Axe-työkalu (vastaava kuin Wave-työkalu, hieman uudempi toteutus): https://www.axe-core.org/

Värikontrastin tarkistus: 

https://webaim.org/resources/contrastchecker/

https://developer.paciellogroup.com/resources/contrastanalyser/

http://contrast-grid.eightshapes.com/

NoCoffee vision simulator:

chrome.google.com/webstore -> NoCoffee (Chromen lisäosa)
addons.mozilla.org -> NoCoffee (Firefoxin lisäosa)

Väripaletin luominen: 

http://colorsafe.co/ 
https://color.adobe.com/

  • No labels