Saavutettavuus visuaalisessa suunnittelussa

Tälle sivulle on listattu saavutettavuuteen vaikuttavia visuaalisen suunnittelun huomioita.

Sivun sisällön asettelu (layout)

• Onko sivun sisältö jaettu selkeisiin, loogisiin kokonaisuuksiin, jotka voidaan esittää HTML- rakenne-elementeillä.
• Onko sivun sisällön järjestys looginen ja visuaalisesti helposti hahmotettavissa kaikissa erikokoisissa näytöissä
• Onko elementtien välinen etäisyys riittävä erottamaan ne toisistaan
• Onko yhteenkuuluvien elementtien etäisyys riittävän pieni osoittamaan sisältöjen kuuluvan yhteen
• Onko merkitykseltään eritasoiset sisältöelementit myös visuaalisesti erotettavissa
• Noudattaako elementtien sijoittelu yleisiä totuttuja suunnitteluratkaisuja
• Onko elementtien sijoittelu yhdenmukainen kaikilla sivuilla

Värit ja kontrastit

• Ovatko käytetyt värit selkeitä ja (toisistaan) erottuvia
• Värit eivät ole räikeän voimakkaita
• Värit erottuvat toisistaan myös värisokeuden eri muodoissa
• Edusta ja taustavärien keskinäinen kontrasti on riittävä
• Linkit erottuvat muusta tekstistä myös visuaalisesti, ei pelkällä värillä
• Aktiivinen (focus) elementti on visuaalisesti korostettu, kun sivustoa käytetään näppäimistöllä
• Mikään informaatio ei ole osoitettu pelkästään värillä

Typografia

• Käytetty kirjasintyyppi on selkeä ja helppolukuinen
• Käytetty kirjasinkoko on riittävän suuri
• Tekstikappaleiden rivipituus ei kasva yli 80 merkin mittaiseksi
• Riviväli on vähintään 1,5 kertaa kirjasinkoko
• Kappaleväli on vähintään 2 kertaa kirjasinkoko – tekstin ja taustan värien keskinäinen kontrasti on normaalille tekstille vähintään 4,5 ja suurelle tekstille 3
• Teksti on tasattu vasempaan reunaan – kaikki HTML-otsikkotasot huomioitu suunnittelussa

Kuvat ja kuvakkeet

• Jos kuvilla on kuvateksti, se on esitetty selkeästi kuvan yhteydessä
• Koristelutarkoituksessa olevat kuvat ja kuvakkeet ovat hyödyllisiä ja informatiivisia
• Valitut kuvat palvelevat tarkoitustaan ja ovat sisällöltään sekä värimaailmaltaan toimivia (myös värisokeille mikäli mahdollista)

Lomakkeet

• Kaikilla lomakekentillä on otsikkoteksti, joka on aina näkyvissä
• Lomakekenttien otsikot ovat syötekentän sisältöä kuvaavia
• Otsikon ja syötekentän keskinäinen etäisyys osoittaa niiden yhteenkuuluvaisuuden
• Lomakkeen painikkeet on sijoitettu selkeästi lomakkeen tai toiminnon yhteyteen
• Lomakkeiden virheilmoitukset ovat visuaalisesti erottuvia ja virheellinen tieto korostettu riittävästi
• Lomakkeen lähettämisen jälkeinen onnistumisviesti erottuva ja selkeästi korostettu