WWW-sivujen käytettävyys ja esteettömyys

Tällä luennolla käsitellään WWW-sivujen käytettävyyteen ja esteettömyyteen liittyviä asioita.

Luentotaltiointi

Ongelmia videon katselussa?

Esimerkkejä esteellisistä sivuista

Mitä ongelmia seuraavilla sivuilla on käytettävyyden ja esteettömyyden näkökulmasta?

Mobiiliversioita edelläluetelluista sivuista

Tekstiselainversioita edelläluetelluista sivuista

Yleistä käyttävyydestä ja esteettömyydestä

WWW-sivujen esteettömyydellä eli saavutettavuudella (engl. Accessibility) tarkoitetaan yksinkertaisesti sitä, että WWW-sivujen sisältö on kaikkien käytettävissä.

WWW-sivujen käytettävyydellä (engl. Usability) tarkoitetaan WWW-sivujen helppokäyttöisyyttä ja ymmärrettävyyttä siihen tarkoitukseen, johon sivusto on tarkoitettu.

WWW-sivut kannattaa siis suunnitella Design for All (DfA) periaatteella, jossa pyritään parantamaan sekä WWW-sivujen käytettävyyttä että saavutettavuutta kaikille käyttäjille.

WWW-sivujen tekemistä esteettömiksi ja käytettäviksi puoltavat myös seuraavat voimakkaat kannanotot:

Esteellisiä ryhmiä

WCAG 2.0 ja esteettömyys

W3C:n tulevassa suosituksessa on yleisiä periaatteita miten esteettömyyttä voidaan lisätä internetympäristöissä.

Sisällön kestävyys

Esteellisiä tekniikoita

Lisätekniikoilla voidaan edistää sisällön ymmärtämistä joidenkin käyttäjien näkökulmasta. Standardin ulkopuoliset tekniikat eivät kuitenkaan ole läheskään kaikkien käytettävissä (selaintyyppi, käyttöjärjestelmä, julkinen vs. oma kone). Sivuston sisällölle siis täytyy löytyä vaihtoehto. Tutkitaan edellisten luentojen tekniikoiden esteellisyyttä.

Sisältö kaikkien saataville

Sivusto kaikkien käytettävissä

Sisällön on oltava ymmärrettävä

Käytettävän sivuston suunnittelun perusideoita

Seuraavassa muutamia perusideoita, jotka kannattaa muistaa sivujen tekemisen jokaisessa vaiheessa.

Sivuston rakenne

Sivuston tai sivujen rakenne merkitsee paljon sivujen käytettävyyden kannalta. Seuraavaan on kerätty muutamia sivuston käytettävyyttä ja esteettömyyttä parantavia asioita.

Sivuston otsikkotiedot

Sivuston sisältö

Sivuston ulkoasu

Navigointi

Toteuta navigointi seuraavien periaatteiden mukaisesti.

Linkit

Kuvien käyttö

Seuraavassa muutamia kuvien käyttämisessä huomioitavia asioita.

Sivujen latausajat

Näyttöresoluution huomioiminen

Kehyksien käyttö

Älä käytä kehyksiä! Jos kuitenkin jostakin syystä käytät, niin huolehdi seuraavista asioista.

Sivujen esteettömyyden varmistaminen

Seuraavaan on koottu erilaisia asioita, joiden avulla voidaan varmistaa sivuston esteettömyys. Kaikkia keinoja ei ole välttämättä käytettävissä, mutta jo muutamillakin tarkistuksilla saadaan sivustosta huomattavasti esteettömämpi.

  1. Anna erilaisten käyttäjien testata sivustoa jo varhaisessa vaiheessa.
  2. Tarkasta sivu arviointityökaluilla
    • Validoi sekä HTML- että CSS-dokumentti W3C:n validaattoreilla.
    • Tarkista esteettömyyden tarkastavalla ohjelmalla (esim. Nettipoliisi, Bobby)
  3. Tutki sivun rakennetta DOM Inspectorilla.
  4. Testaa sivu erilaisilla graafisilla selaimilla erilaisilla asetuksilla.
  5. Testaa sivu merkkipohjaisilla selaimilla tai emulaattoreilla.
  6. Testaa sivu vanhemmilla selaimilla.
  7. Testaa sivu ääniselaimella.
  8. Testaa sivu mobiiliympäristössä.
  9. Tarkista sivun kielioppi.

Erilaisia selaimia ja niiden erikoispiirteitä

Esteettömyyteen ja käytettävyyteen liittyvää aineistoa

Kurssimateriaalien käyttäminen kaupallisiin tarkoituksiin tai opetusmateriaalina ilman lupaa on ehdottomasti kielletty!
http://appro.mit.jyu.fi/www/luennot/luento9/
© Tommi Lahtonen (tommi.j.lahtonen@jyu.fi)<URL: http://hazor.iki.fi/>
2005-12-19 14:55:02