Lyhyt johdatus esteettömyyteen

Kirjoittaja: Russ Weakley, Max Design. Käännös: Yoji Hirabayashi ja Mikko Kekki.


Sisältö

Esteettömyys ei ole…

  • Vain tekstipohjaisia sivuja
  • Erillinen, esteetön versio (ellei kyseessä ole multimedia)
  • Tylsää
  • Vaikeaa

Esteettömyys on…

Esteettömyydellä tarkoitetaan sellaisten web-sivujen kehittämistä, joita kuka tahansa voi navigoida ja lukea riippumatta käyttäjän mahdollisista vammoista, sijainnista, kokemuksesta tai käytössä olevasta teknologiasta.

Webin voima on sen universaaliudessa. Kaikkien saavutettavissa oleminen, esteellisyydestä riippumatta, on ensiarvoista.

Tim Berners-Lee
World Wide Webin ”isä”
Johtaja, W3C

Esteelliset käyttäjät

  1. Näkövammat
    • Sokeus
    • Heikentynyt näkökyky
    • Värisokeus
      • Vihersokeus (deutranopia)
      • Punasokeus (protanopia)
      • Sinisokeus (tritanopia)
  2. Liikunnalliset ja motoriset rajoitteet
    • Täydellinen tai osittainen halvaantuminen
    • Parkinsonin tauti
    • Niveltulehdus
    • Aivovaurio
    • Puutteellinen jäsenen liikuntakyky
  3. Kognitiiviset haitat
    • Kognitiiviset häiriöt
      • Vajavainen aivotoiminta
      • Lyhytmuistinmenetys
      • Ms-tauti
      • Alzheimerin tauti
      • Parkinsonin tauti
      • Ikääntyneisyys
    • Oppimisvaikeudet
      • Tarkkaavaisuushäiriö ADD
      • Dyslexia
      • Muut ei-kielelliset oppimisvaikeudet
  4. Kuulovammat

Laitteet ja ohjelmisto

Laitteet ja ohjelmistot web-sisällön saavuttamiseksi

Laitteet ja ohjelmistot sisällön tulostamista varten

Miksi esteettömyydestä pitäisi välittää?

  1. Lakisyistä (ei koske Suomea kirjoitushetkellä)
  2. Moraaliset syyt

    Internetissä kaikki ovat yhdenvertaisia. Se antaa meille sekä vallan että valinnanvapauden – mutta vain, mikäli pääsy sinne on yhtäläinen kaikille.

    http://www.rnib.org.uk/

  3. Julkinen palvelu

    Julkisella sektorilla on velvollisuus palvella yleisöä. Eikä se tee sitä, mikäli se palvelee vain tiettyjä ihmisryhmiä.

    http://joeclark.org/essentials/WE04notes1.html

  4. Kaupalliset syyt

    2003 SDAC arvioi että joka viides australialainen (3,951,000 tai 20%) kärsii jonkinasteisista häiriöistä. Luku on yhtäläinen niin naisilla kuin miehilläkin ja se suureni iän myötä ollen 81% yli 85-vuotiaiden keskuudessa.

    http://www.abs.gov.au/

  5. Esteettömistä web-sivuista hyötyvät kaikki.

Esteettömän web-kehityksen neljä vaihetta

  1. Tietämättömyys on autuutta
    • Tarvitseeko meidän todella välittää muutamasta prosentista käyttäjiä?
    • Tarvitseeko sokeiden päästä internetiin ollenkaan?
  2. Välttely
    • Me annoimme heille jo alt-tekstit ja tekstiversion sivuista. Mitä he vielä haluavat?
  3. Kävelyn opettelu
    • On niin paljon ajateltavaa, mistä aloittaisin?
  4. Osa prosessia
    • En edes ajattele sitä enää, se on osa prosessia

Joitain pikaisia tapoja parantaa sivuston esteettömyyttä

  • Käytetäänkö alt -määritteitä kaikille merkityksellisille kuville?
  • Onko tekstin koko määritelty sivustolla suhteellisilla yksiköillä?
  • Hajoaako mikään kohta taitossa, jos fonttikokoa suurennetaan?
  • Käytetäänkö sivustolla näkyviä pikalinkkejä (skip menus)?
  • Käytetäänkö sivustolla esteettömiä lomakkeita?
  • Käytetäänkö sivustolla esteettömiä taulukoita?
  • Ovatko värit riittävän kirkkaita ja kontrastit selkeitä?
  • Käytetäänkö kriittisen informaation osoittamiseen yksistään väriä?
  • Vaativatko sivun toiminnot hyvää näköä ja vakaata kättä?
  • Ovatko kaikki linkkitekstit kuvaavia?
  • Onko pääsy sivuston kaikille alueille mahdollista pelkästään näppäimistön avulla (tab key)?
  • Onko sivuston sisältö saavutettavissa mikäli CSS on kytketty pois käytöstä tai selain ei tue sitä?
  • Onko sivuston sisältö saavutettavissa mikäli kuvat on kytketty pois käytöstä tai selain ei osaa näyttää niitä?
  • Toimiiko sivusto tekstiselaimilla, kuten Lynx?
  • Toimiiko sivusto hyvin riippumatta selainikkunan koosta?

Web-standardien tarkistuslista tarjoaa yksityiskohtaisempaa lisätietoa.

Tästä artikkelista

Alkuperäinen esitys: A quick and dirty introduction to accessibility. Artikkeli on saatavilla myös presentaatiomuodossa.

Saavutettava.fi

Saavutettava.fi aukesi virallisesti 1.4.2005. Ei ole aprillia tämä.

Saavutettava.fi julkaisee suomenkielisiä artikkeleita saavutettavuudesta ja web-standardeista. Tavoitteena on tarjota keskitetysti tietoa niistä web-julkaisun suositeltavista toimintatavoista, joilla varmistetaan, että verkkosivut ja -palvelut ovat yhtälaisesti kaikkien ulottuvilla. Lue lisää info-sivulta.

Tervetuloa!

Lapset ja esteettömyys – sillä on väliä

Kirjoittaja: Derek Featherstone. Artikkeli on julkaistu alunperin Box of Chocolate-blogissa otsikolla Children and Accessibility: It matters.


Hanki lapsia. Jos se ei saa sinua vakuuttuneeksi siitä, että web-sivujen tulisi olla esteettömiä, en tiedä mikä saisi.

Tulin isäksi uudelleen – Kambell, kolmas lapsemme syntyi vain reilu pari viikkoa sitten. Olemme todella onnekkaita. Kuitenkin, mitä enemmän yritän saada aikaan, sitä useammin huomaan lasten olevan jollain tavalla kuin rajoittimia. Tämä on puoliksi vakava, puoliksi humoristinen vilkaisu siihen, miksi näin… 😉

Kuulon heikkeneminen

Tämä on melko ilmeinen. Lapset ovat kovaäänisiä. Minulla on toimistotila kotitalon kellarissa – ja vaikka lapset tottelevatkin “Älä tule isin toimistoon kun ovi on suljettu tai ennen illallista” sääntöä, uskokaa kun sanon, ettei sillä ole mitään vaikutusta siihen mitä yläpuolellani tapahtuu. Toimistoni on suoraan keittiön alapuolella. On uskomatonta kuinka kovaa melua saa aikaan kahden kilon paketti pastaa, kun se tyhjennetään hitaasti keittiön keraamiselle laattalattialle. Kellaritila toimii myös erinomaisena resonanssikammiona, minne välittyy mm. tuolin tai jakkaran vetäminen huoneen poikki ikävän selvästi. Onnea vaan multimediasisältöjen kanssa.

En pystynyt kuuntelemaan Dave Winerin selitystä weblogs.comin sulkemisesta, joten olin erittäin tyytyväinen löytäessäni siitä tekstiversion joko silmäiltäväksi tai tulostusta varten. Myös SMIL-versio olisi ollut mukava, mutta epäilen etteivät lapset olisi antaneet mahdollisuutta kuunnella sitä. Vaihtoehtoiset formaatit antavat kiireisille vanhemmille lisää valinnanmahdollisuuksia.

Kognitiiviset haitat

Perheeseemme kuuluu kolme lasta. Ympärillämme on koko ajan niin paljon meteliä, että meillä on vaikeuksia muodostaa yhteyttä. Vaimollani ja minulla ei ole juuri koskaan mahdollisuutta käydä normaalia keskustelua, saati sitten tehdä jotain webissä. Emme pysty keskittymään. Olemme myös hyvin väsyneitä, joten emme aina jaksa kiinnittää huomiota asioihin niin kuin pitäisi.

Tiettyihin aikoihin päivästä en pysty lukemaan ruudulta mitään joko siksi, että ympärilläni on niin paljon melua tai yksinkertaisesti siksi että olen liian väsynyt. Voisitko kenties auttaa meitä kaikkia? Tee asioista helposti silmäiltäviä. Tarjoa yhteenveto dokumentista, jotta voimme päättää kannattaako se lukea kokonaan. Tee asiat helppokäyttöisiksi ja helposti ymmärrettäviksi kaikille.

Näkörajoitteet

Työskentelen siis kotona, jotta voisin viettää joustavasti aikaa lasten kanssa myös päivisin. Kun vaimoni täytyy hoitaa jotain juoksevia asioita tai hänen vain yksinkertaisesti pitää päästä hetkeksi ulos talosta, minulla on yleensä yksi lapsi sylissä tietokoneen ääressä. Tämä on yleensä hyvä tilaisuus tarkistaa mitä säännöllisesti seuraamillani sivustoilla, kuten Andyn Stuff and Nonsense, Daven Mezzoblue, Scrivsin whitespace, Miken Phark, tai Gezin JuicyStudio, on tarjottavana.

En kuitenkaan pysty tällöin lukemaan normaalilta etäisyydeltä. En voi pitää lasta, joka sillä hetkellä on sylivuorossa, liian lähellä näppäimistöä – huitovat kädet ja jalat eivät ole hyväksi tietokoneelle tai mielenterveydelle. Joten, yleensä työnnän näppäimistön kauemmas, suurennan tekstin kokoa ja siirryn hieman kauemmas työpöydästä. Tarvitsen siis skaalautuvaa tekstiä… Käytän Firefox-selainta, joten tekstin suurentaminen ei ole ongelma, mutta ajattele niitä isiä ja äitejä joilla ei ole tätä mahdollisuutta.

Motoriset ongelmat

Kun lapsi nukkuu sylissä, pystyn kirjoittamaan vain muutamalla sormella. Tämä ei ole hyvä asia. Ehkä minunkin pitäisi hankkia puolikas näppäimistö?

Mainitsinko jo, että ohjauslevyt eivät pidä niille kaatuneesta mehusta tai muista ruumiineritteistä, joita varsinkin vastasyntyneistä karkaa ulos?

Kyllä, näppäimistö on ainoa järkevä väline vanhemmille – tai ehkä minunkin pitäisi asentaa koneeseeni puheentunnistusohjelmisto?

Vaikuttaa myös siltä, että olen kadottanut hienomotoriikkani kontrollin. Kun yritän navigoida tai täyttää lomakkeita, en saa pidettyä kättäni paikoillaan – joku nykii paidanhihasta tai vetää kädestä kysellen ties mitä.

Tekniset rajoitteet

Muistatteko sarjaporttiin liitettävän hiiren? 9-pinniset, jotka liitettiin koneeseen ruuvaamalla ne porttiin kiinni. Mukavan jämäkkä eikä irronnut helposti… PS-2 – ja USB-hiiret sen sijaan irtoavat varsin helposti liitännöistään. Varsinkin silloin kun lapset ryömivät ja konttaavat ympäriinsä.

Hiireni putosi lattialle enkä pysty nostamaan sitä. En ainakaan silloin kun lapsi, jonka nukuttamiseen meni 45 minuuttia, nukkuu sylissäni. Ok, navigoidaan sitten näppäimistöllä.

Pyydänkin, että teet sivustosi esteettömäksi… voi olla, että kiität siitä itseäsi myöhemmin.

podGuide: Web-sisällön saavutettavuusohje

Kirjoittaja: Yoji Hirabayashi


Saavutettava.fi on trendikäs ja tarjoilee iPodin omistaville lukijoilleen Web-sisällön saavutettavuusohje-podGuiden. Opas on koottu käyttäen hyväksi valmiiksi käännettyä materiaalia. Suurimpana syynä tähän oli helppous ja nopeus, toisena yhdenmukaisen termistön käyttö.

Oppaan käännöksestä vastaa pääosin W3C Suomen toimiston toiminnanjohtaja Ossi Nykänen. Myös Minna von Zansenin ja Katariina Kiiliäisen (Celia) kääntämää Wai-ohjetta käytettiin apuna.

Asennusohjeet

  1. Varmista ensin, että iPodisi tukee Muistiinpanot-toimintoa (Notes), joka vaatii Minin, kolmannen tai neljännen sukupolven laitteen.
  2. Lataa tiedosto [zip] ja pura se valitsemaasi paikkaan
  3. Tuo iPod näkyviin ulkoisena levynä normaaliin tapaan.
  4. Avaa iPodista Notes-kansio ja siirrä purkamasi kansio (WCAG 1.0) sinne.
  5. Viimeistele asennus poistamalla levy käytöstä.
  6. Siinäpä se.

Pääset käyttämään ohjeistusta valitsemalla päävalikosta Extrat (Extras), mistä valitaan Muistiinpanot (Notes), josta löytyy merkintä WCAG 1.0.

Lisää oppaita löydät podSites-sivustolta [en].

Web-standardien tarkistuslista

Kirjoittaja: Russ Weakley, Max Design. Alkuperäisen presentaation pohjalta kääntänyt Kalamuki.


Mitä web-standardit ovat?

Käsite ’web-standardit’ voi tarkoittaa eri asioita eri ihmisille. Joillekin se on web-sivustojen tekemistä ilman taulukoita, toisille validin koodin käyttämistä. Web-standardit ovat kuitenkin paljon laajempi asia. Web-standardit voisi määritellä:

sitoutumiseksi standardeihin (HTML, XHTML, XML, CSS, XSLT, DOM, MathML, SVG jne.) ja pyrkimykseksi hyviin toimintatapoihin (validi koodi, esteetön koodi, semanttisesti oikeaoppinen koodi, käyttäjäystävälliset URLit jne.).

Toisin sanoen…

Sivuston, joka on rakennettu web-standardeilla, pitäisi olla sutjakka, siisti, CSS-pohjainen, esteetön, käytettävä ja ystävällinen hakukoneille.

Tarkistuslistasta

Tämä lista ei ole kaikkien tarkistuslistojen äiti. Paljon voitaisiin lisätä. Tämä on yksinkertaisesti lähtökohta ja tätä voi käyttää:

  • osoittamaan web-standardien laajuutta
  • web-kehittäjien kätevänä työkaluna sivuston tuotantovaiheeseen
  • apuna web-kehittäjille, jotka ovat kiinnostuneita siirtymään kohti web-standardien käyttöä

Tarkistuslista on jaettu kuuteen osioon:

  1. Koodin laatu
  2. Kuinka tarkasti sisältö ja esitystapa on erotettu toisistaan?
  3. Esteettömyys käyttäjille
  4. Esteettömyys laitteille
  5. Peruskäytettävyys
  6. Sivuston hallinta

1. Koodin laatu

  1. Käytetäänkö sivustossa oikeaa dokumenttityyppiä?
    http://www.w3.org/QA/2002/04/valid-dtd-list.html
  2. Onko merkistö määritetty sivustolla?
    http://www.w3.org/International/O-charset.html
  3. Käytetäänkö sivustossa validia (X)HTML:ia?
    http://validator.w3.org/
  4. Käytetäänkö sivustossa validia CSS:ia?
    http://jigsaw.w3.org/css-validator/
  5. Käytetäänkö sivustossa CSS-hackeja?
  6. Käytetäänkö sivustossa turhia class- tai id-määritteitä?
  7. Onko koodi rakenteeltaan hyvää?
    http://www.w3.org/2003/12/semantic-extractor.html
  8. Onko sivustolla rikkinäisiä linkkejä?
    http://validator.w3.org/checklink
  9. Kuinka hyvin sivusto toimii nopeuden/sivukoon suhteen?
    http://www.websiteoptimization.com/services/analyze/
  10. Onko sivustolla Javascript-virheitä?

2. Kuinka tarkasti sisältö ja esitystapa on erotettu toisistaan?

  1. Käytetäänkö CSS:ia kontrolloimaan kaikkia esitystavan eri piirteitä (fontit, väri, täyte, rajat jne.)?
  2. Onko kaikki kuvituskuvat määritelty CSS:ssa vai näkyvätkö ne (X)HTML:ssa?

3. Esteettömyys käyttäjille

  1. Käytetäänkö alt-määritteitä kaikissa merkityksellisissä kuvissa?
  2. Käytetäänkö sivustolla suhteellisia vai ehdottomia yksiköitä tekstin koon määrittämiseen?
  3. Hajoaako mikään kohta taitossa, jos fonttikokoa suurennetaan?
  4. Käytetäänkö sivustolla näkyviä pikalinkkejä (skip menus)?
  5. Käytetäänkö sivustolla esteettömiä lomakkeita?
  6. Käytetäänkö sivustolla esteettömiä taulukoita?
  7. Ovatko värit riittävän kirkkaita ja kontrastit selkeitä?
  8. Käytetäänkö kriittisen informaation osoittamiseen yksistään väriä?
  9. Toimivatko pudotusvalikot viiveellä (käyttäjille, joilla on heikot motoriset kyvyt)?
  10. Ovatko kaikki linkkitekstit kuvaavia (sokeille käyttäjille)?

4. Esteettömyys laitteille

  1. Toimiiko sivusto hyväksyttävästi niin uusilla kuin vanhoillakin selaimilla?
  2. Onko sisältö saavutettavissa, mikäli CSS on kytketty pois käytöstä tai selain ei tue sitä?
  3. Onko sisältö saavutettavissa, mikäli kuvat on kytketty pois käytöstä tai selain ei osaa näyttää niitä?
  4. Toimiiko sivusto tekstiselaimilla, kuten Lynxillä?
  5. Toimiiko sivusto hyvin tulostettaessa?
  6. Toimiiko sivusto hyvin kannettavissa laitteissa?
  7. Sisältääkö sivusto yksityiskohtaista metadataa?
  8. Toimiiko sivusto hyvin eri kokoisissa selainikkunoissa?

5. Peruskäytettävyys

  1. Käytetäänkö selkeää visuaalista hierarkiaa?
  2. Erottuvatko otsikkotasot hyvin?
  3. Onko sivustolla helposti ymmärrettävä navigointi?
  4. Onko sivustolla johdonmukainen navigointi?
  5. Onko linkit alleviivattu?
  6. Käyttääkö sivusto johdonmukaista ja asiaankuuluvaa kieltä?
  7. Käytetäänkö sivukartta- ja yhteystietosivua? Onko ne helppo löytää?
  8. Onko (isolla) sivustolla hakutyökalu?
  9. Onko sivuston jokaisella sivulla linkki etusivulle?
  10. Merkitäänkö vieraillut linkit selkeästi omalla värillään?

6. Sivuston hallinta

  1. Onko sivustolla merkityksellinen ja avulias 404-virhesivu, joka toimii millä sivuston tasolla tahansa?
  2. Käytetäänkö ystävällisiä URLeja?
  3. Toimivatko URLit ilman www:ia?
  4. Onko sivustolla favicon?

Tästä listasta

Tämä Russ Weakleyn, Max Design, kirjoittama tarkistuslista hahmoteltiin raakamuodossa Web Standards -postituslistalla toukokuussa 2004. Se esitettiin Sydneyn Web Standards Groupille 5.8.2004.

Lista on saatavilla myös