Modernit ruudunlukuohjelmat ja CSS-taitto

Access Matters -blogissa on julkaistu yhteenveto siitä, kuinka kolme johtavaa ruudunlukuohjelmistoa (Jaws 6.1, Window Eyes 5.0, IBM Home Page Reader 3.04) tulkitsevat CSS-aseteltuja dokumentteja. Testidokumentteina toimi neljä eri css Zen Garden-sivuston leiskaa (000, ZG 019, ZG 151 ja ZG 167).

Kaikki testatut ohjelmistot lukevat dokumentin sisällön siinä järjestyksessä kuin se lähdekoodissa on määritelty, välittämättä CSS -asettelusta. Tämä tieto helpottanee ainakin silloin, kun halutaan jo suunnitteluvaiheessa kiinnittää huomiota (uudempien) ruudunlukuohjelmistojen käyttäjiin: tärkein asia ensimmäiseksi. Graafisessa versiossa voidaan CSS:n avulla tarjota kaksi- tai kolmepalstainen asettelu.

Artikkelin lopussa löytyvästä taulukosta huomaa helposti, kuinka erilaiset FIR-tekniikat (Fahrner Image Replacement, tekniikka jossa CSS:n avulla korvataan tekstiä kuvalla) ja varsinkin CSS:ssa käytetty display: none aiheuttavat selkeitä ongelmia ohjelmistoille.

Loppuun maininta viime aikoina ulkomaisissa design-blogeissa käsitellystä, Joe Clarkin ehdottamasta, Zoom-versiosta heikkonäköisille. Idea on yksinkertainen. Tarjotaan sivustosta CSS:n avulla muokattu versio, joka muun muassa:

  • on yksipalstainen
  • käyttää oletusarvoisesti suurta fonttikokoa
  • käyttää yksinkertaistettua navigointia
  • tarjoaa täsmälleen saman sisällön kuin graafinen versio
  • toteutetaan pelkästään CSS:n avulla, eikä merkkausta muuteta.

Aiheesta lisää (englanniksi):

  1. A List Apart: Big, Stark & Chunky (Joe Clark)
  2. Joe Clark: Zoom the Web: The problem of giant fonts – @media 2005-tapahtuman muistiinpanot
  3. 456 Berea Street: Inverted zoom: designing for low vision (Roger Johansson)
  4. Juicy Studio: Zoom for Low Vision (Gez Lemon)
  5. Stopdesign: Zoom layout (Douglas Bowman)
  6. Adactio: Zooming the Web (Jeremy Keith)

Myös allekirjoittanut tarjoaa harjoituksen vuoksi vaihtoehtoista Zoom -versiota blogistaan.

Saavutettava.fi:n toimituksesta kvartetti

Saavutettava.fi:n toimituskunta laajentui triosta kvartetiksi, kun remmiin liittyi uunituore kasvatustieteiden maisteri Timo Laak. Maantieteellinen kattavuus lisääntyi sekin. Onhan meillä nyt edustus paitsi pääkaupunkiseudulla ja Pirkanmaalla myös Keski-Suomen sydämessä Jyväskylässä. Timon erikoisaluetta on saavutettavuus ja verkko-oppiminen, ja silmissä siintää väitöskirja. Tästä eivät saavutettavuusasiat voi kuin parantua! Tervetuloa joukkoon kummaan, Timo!

Saavutettavuus ja verkko-opetus

Saavutettava.fi:ssä on seurattu mielihyvällä saavutettavuustrendin kehittymistä myös kotimaisissa blogeissa samalla kun saavutettavuusasiat keräävät palstatilaa pikkuhiljaa niin sanotun virallisen median sivuilta. JHS-suositus: Julkishallinnon verkkopalvelun suunnittelun ja toteuttamisen periaatteet saa enemmän huomiota. Ennustamme, että lähiaikoina alkaa Suomessakin keskustelu julkishallinnon verkkoviestinnän saattamisesta jonkinlaisen saavutettavuuslain piiriin, kuten on tapahtumassa joissakin Euroopan yhteisön maissa.

Ehkä tarkkailemme maailmaa väritettyjen lasien läpi mutta kuitenkin jopa Saavutettava.fi:n kävijätilastot kertovat asian olevan kuuma peruna. Meitä on linkitetty niin monista blogeista ja muilta saavutettavuutta etäisestikin hipaisevilta sivustoilta, että veisi oman juttunsa luetella kaikki. Kiitämme luottamuksesta.

Saavutettavuusasioilla on sijansa myös koulutuksen puolella. Siitä ei suinkaan ole vähäisimpänä osoituksena meilläkin linkitetty DfA-datanomikoulutus Keski-Savon Oppimiskeskuksessa. Olemme aina kiinnostuneita saavutettavuus-koulutuksista, joten jos olet järjestämässä aiheesta kurssia tai itse osallistumassa sellaiselle, kerro kurssista meille. Lupaamme vähintään linkittää kurssisivustoonne tai vastaavaan.

Erityismaininnan ansaitsee KM Timo Laakin toimittama Saavutettavuus & verkko-opetus -sivusto, joka on tarkoitettu pieneksi yleistietopaketiksi niille, jotka ovat kiinnostuneita saavutettavuudesta ja verkko-opetuksesta. Ystävällisesti Timo on antanut sivustonsa nyt Saavutettava.fi:n hoiviin.

Verkko-opetus antaa opiskelumahdollisuuksia sellaisille, joille tavalliseen luokkahuoneopetukseen osallistuminen ei syystä tai toisesta ole mahdollista. Saavutettava verkko-opetus avaa ovet vielä useammille ja on monessa kohdassa jopa normaalia opetusta parempi vaihtoehto.

Huonot osoitteet ja linkittämisen merkitys

Kirjoittaja: Aleksi Moisio.


World Wide Webin isä, Tim Berners-Lee, kirjoitti vuonna 1997 linkittämiseen liittyvistä myyteistä ja väärinkäsityksistä. Liki kymmenen vuotta sitten Internetin linkkeihin perustuva verkkomainen rakenne herätti hämmennystä. Osa surffaajista ja sivujen ylläpitäjistä koki, että ilman lupaa tehtävä linkittäminen loukkasi tekijänoikeuksia.

Tämä oli kuitenkin Berners-Leen mukaan valitettava väärinymmärrys. Linkit pelkästään viittaavat, eivätkä itsessään kerro mitään esimerkiksi linkittäjän omistussuhteesta linkitetyn sivun sisältöön tai linkittäjän kannatuksesta linkitetyllä sivuilla esitettyihin ideoihin.

Berners-Leen mukaan linkittäminen kuuluu sananvapauden perusominaisuuksiin. Linkittämistä voi verrata mahdollisuuteen puhua julkisuuden piiriin kuuluvista asioista. Sananvapauden nimiin vannovassa yhteiskunnassa täytyy olla mahdollista viitata esimerkiksi hallitusohjelmaan keskusteltaessa politiikasta keskellä toria.

Myös Internetissä täytyy olla mahdollista viitata julkishallinnon sekä yksityisen sektorin julkisiin dokumentteihin. Tämä on usein helpommin sanottu kuin tehty.

Kaikki mikä on konkreettista liukenee ilmaan

Torilla keskusteltaessa on helppo tuudittautua siihen, että tosimaailman dokumentit eivät häviä savuna ilmaan. Esittämättä kyynistä huomiota lupausten toteutumisesta: minkälainen mekkala syntyisikään, jos kaikki kopiot hallitusohjelmasta häviäisivät kesken vaalikauden?

Verkon ulkopuolella voi aina luottaa siihen, että julkiset dokumentit säilyvät ainakin jossain muodossa. Internetin ihmemaassa on kuitenkin mahdollista, että osa dokumenteista katoaa bittiavaruuteen jälkiä jättämättä.

Hyvästä esimerkistä käyvät uutistoimistojen sivustot, joilla pyörivät tauotta uusimmat tapahtumat maailmalta. Vanhat uutiset painuvat pinon alimmaiseksi ja tuoreet uutiset nousevat etusivulla ensimmäiseksi. Yleensä etusivulla näkyy vain osa uutisesta, kenties ingressi. Varsinaiseen artikkeliin pääsee käsiksi linkin välityksellä. Mutta mitä tapahtuu, kun uutinen on jo niin vanha, ettei se mahdu etusivulle ensinkään?

Hyvin toteutetuilla sivustoilla tätä vääjäämätöntä ongelmaa varten on rakennettu arkistoja, joista vanhemmat uutiset löytyvät. Parhaimmilla sivustoilla on lisäksi mahdollisuus etsiä oikeaa uutista esimerkiksi tekijän, otsikon, aiheen, julkaisupäivämäärän ja muiden metatietojen avulla.

Valitettavan usein verkkotoimittajat, webmasterit ja tavalliset surffaajat törmäävät kuitenkin sivuihin, jotka häviävät mystisesti, jälkiä jättämättä. Pahimmassa tapauksessa ”hyödyttömät” sivut poistetaan kokonaan verkosta. Hiukan paremmassa tapauksessa pelkästään sivulle johtava linkki poistetaan. Tällöin sivu joko hukkuu ja unohtuu ajan kuluessa tai sitten jokin ulkopuolinen taho pelastaa sivun linkittämällä sen omille sivuilleen.

23, 6, 707 ja muita merkityksettömiä numeroita

Historiaan häviävien sivujen ohella harmaita hiuksia aiheuttavat www-osoitteet, jotka koostuvat lähinnä sisällönhallintasovelluksen arpomasta koodinumerosta. Tällaiset generoidut osoitteet ovat usein aivan liian pitkiä, jotta ne mahtuisivat katkeamatta esimerkiksi 72 merkin rivejä käyttävän sähköpostiohjelman ruudulle. Hämmentävien pituuksiensa vuoksi tällaisia osoitteita on myös mahdotonta painaa esimerkiksi kirjoihin.

Siinäkin tapauksessa, että moinen osoite löytää tiensä kirjan sivuille, on osoitteesta täysin mahdotonta päätellä mitään vihjeitä sivun sisällöstä — vai mitä sanotte seuraavasta kaunokaisesta: http://www.amazon.com/gp/help/seller/at-a-glance.html/ref=olp\_offerlisting\_10/ 103-3739537-0091006?%5Fencoding=UTF8&asin=1859844634&marketplaceSeller =1&seller= ADHR7VPS9GZEY — aika vonkale, vai mitä?

Sisällönhallintasovelluksen valinnassa ja säätämisessä tehdyt huonot päätökset kertautuvat ikävällä tavalla. Linkittämisen vaikeutuessa sananvapauden toteutuminen verkossa vaarantuu ja julkisen tiedon avoin saatavuus vaikeutuu kohtuuttomalla tavalla.

Kuka tietämättömyyttään, kuka typeryyttään

Erilaisten organisaatioiden sivuille linkittämistä vaikeutetaan epäilemättä myös tietoisesti. Kun sivut toteutetaan esimerkiksi sopivasti muotoillun Flash-sovelluksen tai PDF-dokumenttien avulla, pystytään ulkopuolelta tapahtuva linkittäminen kohdistamaan tehokkaasti vain sivuston juuritiedostoon.

Tällaista toimintaa ohjaa vanhentunut, salaileva ja kontrolloimiseen pyrkivä käsitys tiedottamisesta. Kaikki keinot kontrolloida julkisuuskuvaa hyödynnetään viimeiseen linkkiin saakka. Tässä mielessä Flash- ja PDF-dokumentit antavat tiedoston tekijälle enemmän valtaa suhteessa dokumentin kopioimiseen, tulostamiseen ja täsmälliseen linkittämiseen kuin standardien mukainen HTML.

Historian saatossa on ollut ja tulee olemaan tarpeita rajoittaa tiedon saatavuutta. Tuskinpa kukaan haluaa esimerkiksi luottokorttinsa tunnusluvun leviävän vapaasti verkossa.

Linkittämisen tahaton ja tahallinen estäminen koskee kuitenkin jotain sellaista, joka alun perin verkkoon luettavaksi laitettuna on luonteeltaan julkista. Se, että Ajoneuvohallintokeskus AKE vaikeuttaa linkittämistä käyttämällä sivustollaan (huonolla tavalla) kehyksiä, ei ole välttämättä harkittua tiedon salaamista. Valitettavasti sivuilla tehdyt ratkaisut eivät ainakaan edistä julkisuuslaissa mainittua julkishallinnon velvoitetta edistää kansalaisten tiedonsaantia.

Kuin kirja ilman kansilehtiä

Ikään kuin tässä ei olisi kylliksi: huonot www-osoitteet nakertavat myös länsimaalaisen tieteen kivijalkaa — lähdeviittauskäytäntöä. Aivan liian usein törmää akateemisen vertaisarvioinnin läpikäyneeseen kirjallisuuteen, jossa viitataan surullisen epämääräisesti verkkolähteisiin.

Tutkimuksen läpinäkyvyyden ja uskottavuuden kannalta on täysin kestämätöntä, etteivät edes arvostetut tiedenaiset ja -miehet voi (tai osaa) viitata täsmällisesti verkkolähteisiin, koska lähdemateriaali on hukutettu hauskan Flash-palikan syövereihin.

Vikaa löytyy tosin myös tiedemaailman parista. Tutkimuksen läpinäkyvyyttä peräänkuuluttavien professoreiden ja tutkijoiden on syytä vilkaista peiliin ja hävetä näkemäänsä, mikäli he ovat vielä 21. vuosisadalla valmiita katsomaan sormien läpi väitöskirjojen www.yritys.com-tyyppisiä viittauskäytäntöjä.

Kohti parempaa tulevaisuutta

Huonoihin ratkaisuihin johtavat päätökset tehdään siis yleensä tiedostamatta tai tietoisesti jo sivuston suunnitteluvaiheessa. Mikäli edellä mainitut ongelmat halutaan välttää, tulisi jo sivuston suunnitteluvaiheessa ottaa huomioon tulevat linkittämistarpeet.

Toimivalla sivustolla:

  • osoitteiden nimet kertovat edes jotain sivujen sisällöstä, esimerkiksi http://www.yritys.com/tiedostot/tilinpaatokset/tilinpaatos2005.html
  • käytetään weblogien myötä yleistyneitä permalinkkejä [en], joilla estetään sivujen katoaminen
  • usein uudistuvien sivujen, kuten esimerkiksi uutissivun yksittäiset uutiset arkistoidaan järkevällä tavalla
  • jokaisen sivun mukana tallennetaan metadataa [en], joka mahdollistaa fiksujen tietokantahakujen tekemisen
  • käytetään linkittämisen estäviä tekniikoita (Flash, PDF jne.) vain erittäin tarkasti harkituissa kohdissa

Sananvapaus, julkisen tiedon avoin leviäminen ja lähdeviittauskäytäntö eivät ole vielä menetettyjä tapauksia — ne vain vaativat hieman enemmän huolellisuutta www-sivujen suunnittelussa. Linkittäkää toisianne.

Web-sivustojen kehittäminen kognitiivisista ongelmista ja oppimisvaikeuksista kärsiville

Kirjoittajat: Roger Hudson, Russ Weakley ja Peter Firminger. Käännös: Yoji Hirabayashi ja Marjut Mutanen.

Artikkeli on julkaistu alunperin Juicy Studio -sivustolla nimellä Developing sites for users with Cognitive disabilities and learning difficulties.


Yhteenveto

Web-sisällön esteettömyyttä pohdittaessa keskitytään usein vain näkövammaisiin. Kognitiivisista häiriöitä ja oppimisvaikeuksista kärsivät jäävät yleensä vähemmälle huomiolle.

Tämä Roger Hudsonin, Russ Weakleyn ja Peter Firmingerin artikkeli paneutuu ongelmiin, joihin käyttäjä saattaa törmätä webissä. Artikkeli tarjoaa hyödyllisiä ja käytännöllisiä ehdotuksia siihen, kuinka sivustoja voidaan kehittää saavutettaviksi myös kognitiivisista vammoista ja oppimisvaikeuksista kärsiville.

Sisältö

Johdanto

Kognitiivisista vammoista ja oppimishäiriöistä kärsivät ovat yhteiskunnan suurin esteellinen käyttäjäryhmä. Silti tämä käyttäjäryhmä usein unohdetaan web-sivuston esteettömyyttä suunniteltaessa.

Kognitiiviset vammat ja oppimisvaikeudet tuntuvat kattavan niin monia erilaisia tiloja, että web-suunnittelijoiden on usein vaikeaa tunnistaa niistä kärsivien henkilöiden tai ryhmien erityistarpeita.

Useat erilaiset rajoitteet voivat vaikuttaa henkilön kykyyn päästä sivustolle ja käyttää sieltä löytyvää informaatiota. Esimerkkejä:

  • Kognitiiviset heikkoudet, joihin sisältyvät mm. muistin havaintokyvyn, ongelmien ratkomisen, käsitteellistämisen ja tarkkaavaisuuden heikkeneminen. Nämä voivat johtua monista eri asioista kuten esimerkiksi henkisestä jälkeenjääneisyydestä, autismista, aivovauriosta, Parkinsonin taudista, Alzheimerin taudista tai korkeasta iästä.
  • Oppimisvaikeudet voivat myös vaikuttaa muistiin, havaintokykyyn, ongelmienratkaisukykyyn ja käsitteellistämiskykyyn monin tavoin. Oppimisvaikeuksiin sisältyvät mm. sellaiset lukemisvaikeudet kuten lukihäiriö, laskennalliset, päättelykyvyn ja organisointikyvyn puutteet ja sanattoman oppimisen ongelmat. Nämä yhdistetään joskus myös tarkkaavaisuus- ja ylivilkkaushäiriöön, ADHD:hen (Attention Deficit Disorder and Hyperactivity).

Web-kehittäjälle ongelmia aiheuttaa lisäksi se, että yksittäisten käyttäjien tarpeet vaihtelevat suuresti. Onkin tavallista, että henkilöllä joka kärsii kognitiivisista vaikeuksista yhdellä osa-alueella, jokin toinen osa-alue on vahva. Esimerkiksi henkilöllä, joka on erinomainen lukemaan, voi olla huomattavia vaikeuksia ymmärtää kuinka dokumentti on organisoitu tai hän häiriintyy helposti sivulla vilkkuvasta pienestä animoidusta kuvasta.

Pystyykö web sitten vastaamaan kaikkien ryhmien erilaisiin tarpeisiin? Todennäköisesti kyllä, mutta erilaisilla sivustoilla.

Web voi tuottaa huomattavaa mielihyvää ja auttaa henkilöitä, jotka kärsivät erilaisista, joskus melko suuristakin, kognitiivisista häiriöistä. Nyt jo suljettu Peepo Project -sivusto tarjosi laajalti resursseja ja ideoita siihen, kuinka vaikeasti oppimishäiriöisten selailua ja itsenäistä webin käyttöä voidaan helpottaa.

Tämä artikkeli keskittyy pääasiallisesti siihen, miten webiä voidaan parantaa sellaisen henkilön kannalta, joka kykenee itsenäisesti selailemaan sivustoja ja niiden tekstisisältöä. Erityisesti artikkelissa annetaan yksinkertaisia neuvoja, joiden avulla voidaan parantaa sivustojen saavutettavuutta silloin, kun henkilöllä on vaikeuksia lukea ja ymmärtää tekstisisältöä.

Artikkelissa An Accessibility Frontier: Cognitive disabilities and learning difficulties [en] käsitellään aihetta yksityiskohtaisemmin.

1. Sisällön kanssa työskenteleminen

1.1 Selkeä ja helppo sisältö

Hyvin kirjoitettu sisältö tekee sen saavuttamisesta helpompaa kaikille, myös niille henkilöille, jotka kärsivät kognitiivisista häiriöistä ja oppimisvaikeuksista.

  • Pidä huolta siitä, että informaatio on hyvin jäsennetty.
  • Pidä sisältö lyhyenä ja yksinkertaisena.
  • Tarjoile informaatio pieninä annoksina, yksi idea per kappale.
  • Tarjoa lisäinformaatio asiasta mieluummin listamuodossa kuin pitkänä kappaleena tekstiä.
  • Käytä mielekästä otsikointia ja väliotsikointia.
  • Vältä kirjoitus- ja kielioppivirheitä.
  • Tarjoa teknisille termeille ja lyhenteille selitykset.

1.2 Optimaalinen rivin pituus

Monille käyttäjille pitkien tekstirivien lukeminen on vaikeaa. Lukemisvaikeuksista kärsiville henkilöille pitkien rivien lukeminen saattaa muodostaa jopa ylitsepääsemättömän esteen. Näyttöjen resoluutioiden kasvaminen mahdollistaa myös suurempien kirjainmäärien mahduttamisen riville, vaikka mielekäs fonttikoko vaihtelee lukijasta riippuen. Tästä johtuen parasta rivin pituutta on mahdotonta määritellä, mutta nyrkkisääntönä voidaan pitää sitä, ettei rivin pituus ylitä 70-80 merkkiä. Tekstille tulisi myös määritellä reunukset vasemmalle ja oikealle.

1.3 Tekstin tasaus molempiin reunoihin

Tekstin tasaaminen molempiin reunoihin vaikeuttaa lukemista käyttäjille, joilla on lukemisvaikeuksia. Epäsuhtainen sanojen väli kumpaankin reunaan tasatussa tekstissä saattaa aiheuttaa ns. rivers of white -ongelman (ts. tekstikappaleiden sisälle näyttää muodostuvan valkoisia uomia), jolloin lukeminen vaikeutuu ja joissain tapauksissa jopa estää sen. Yksinkertaisin ratkaisu ongelmaan on välttää tasausta molempiin reunoihin.

1.4 Käänteinen pyramidimalli

Yksinkertainen keino tehdä sisällöstä saavutettavampaa on käyttää käänteistä pyramidimallia. Aloita asian ja tulosten yhteenvedolla tai lyhyellä esittelyllä ja tarjoa sen jälkeen aihetta tukevaa informaatiota ja taustatietoja. Tällöin lukija voi helposti, koko sivua läpikäymättä, päättää haluaako tutustua kirjoitukseen tarkemmin.

2. Sisällön näyttäminen ja piilottaminen

Joillekin käyttäjille, etenkin kognitiivisista häiriöistä ja oppimisvaikeuksista kärsiville, suuri määrä tekstiä saattaa toimia esteenä sisällön saavuttamiselle. Tämän potentiaalisen ongelman vaikutusta voidaan vähentää antamalla käyttäjälle mahdollisuus vaikuttaa sivulla olevan informaation määrään. On olemassa monia keinoja antaa käyttäjälle mahdollisuus valita joko yksityiskohtainen tai yksinkertainen versio sisällöstä.

2.1 Pitkä ja lyhyt sisältö

Tämä metodi antaa käyttäjälle mahdollisuuden valita sivustolta joko lyhyt tai pitkä versio sisällöstä. Käyttäjä, joka valitsee lyhyen version voi selailla koko sivustoa käyttäen vain lyhytversioita sivuista. Tarvittaessa käyttäjä voi valita vaihtoehtoisen pidemmän version.

Tätä tapaa käytettiin Guardianship Tribunal -sivustolla. Sivuston käyttäjätestaukseen otti osaa laaja joukko käyttäjiä, joista osa kärsi kognitiivisista ja oppimisvaikeuksista. Useimmat pitivät mahdollisuutta valita lyhyt tai pitkä versio sisällöstä hyödylliseksi. Esimerkiksi henkilö, joka kärsi lukihäiriöistä, pystyi valitsemaan helpommin luettavan ja ymmärrettävän lyhytversion. Sosiaalityöntekijät ja lääkärit käyttivät myös lyhytversiota oletusarvoisesti, koska sen avulla he pystyivät hakemaan nopeasti etsimänsä ja tarvitsemansa tiedon.

2.2 Listamerkkien laajentaminen

Edellä mainitun kaltaisessa menetelmässä käytetään yksinkertaisia lauseita tai otsikoita sisällön yleiskuvan luomiseen. Lauseista muodostetaan lista, jonka kohdat toimivat avaimina lisätietoon. Kun käyttäjää valitsee yhden kohdan listalta, siihen liittyvä laajempi tieto esitetään ko. kohdan alla.

2.3 Näytä-piilota-listamerkit

Tässäkin menetelmässä muodostetaan yksinkertaisten lauseiden tai otsikoiden lista. Laajennettua sisältöä ei kuitenkaan näytetä heti jokaisen listamerkin alla, vaan koko listan alla. Tämä vaihtoehto on parempi silloin, kun käsitellään pidempiä tekstikappaleita.

2.4 Kalvosarjojen käyttö

Informaation tarjoaminen webissä käyttäjille, jotka kärsivät vakavammista kognitiivisista häiriöistä, vaatii erilaisen lähestymistavan. Eräs keino tarjota tietoa on esittää se heille kalvosarjana, jossa jokaisessa kalvossa käsitellään yksi asia tai kiinnostuksen kohde. Tämä mahdollistaa tiedon tarjoamisen selkeinä, helposti saavutettavina paloina, jotka käyttäjä voi käydä läpi itse valitsemaansa tahtiin.

3. Luettavuuden ja klikattavuuden parantaminen CSS:n avulla

Eräs CSS:n (Cascading Style Sheets) suurimmista eduista on se, että sen avulla voidaan muokata sisällön esitysasua puuttumatta itse rakenteeseen. Tässä muutama CSS:n avulla toteutettu keino parantaa sisällön saavutettavuutta:

3.1 Suurennettu rivin korkeus

Jotkut käyttäjät kokevat suurennetun rivin korkeuden parantavan kappaleen luettavuutta.

3.2 Kappaleen loppuun enemmän marginaalia

Yleensä jokaisen kappaleen perässä on tyhjä rivi. Sen suurentaminen puoleentoista tai kahteen riviin saattaa parantaa kappaleen luettavuutta.

3.3 Hover-efekti linkeissä

Joillain henkilöillä saattaa olla vaikeuksia erottaa linkkejä tavallisesta tekstistä. Linkeille voidaan asettaa hover-toiminto, joka muuttaa linkkitekstin väriä kun hiiri viedään sen päälle.

3.4 Linkkien alleviivaus border-bottom-ominaisuudella

Normaali linkkitekstin alleviivaus saattaa joskus vaikeuttaa tekstin lukemista, etenkin kun kyseessä ovat sellaiset kirjaimet, joissa on alapidennys (esim. j, p, q, g). Alleviivauksen etäisyyttä tekstiin voidaan kontrolloida korvaamalla normaali alleviivaus border-bottom-ominaisuudella.

3.5 Suurennettu aktiivinen alue linkeissä

Joillain henkilöillä, erityisesti niillä, joilla on motorisia rajoitteita, saattaa olla vaikeuksia linkkien klikkaamisessa. CSS:n avulla aktiivista aluetta voidaan suurentaa.

3.6 Hover-ominaisuuden käyttö kappaleissa, lista-elementeissä ja taulukon soluissa

Joillain lukuvaikeuksista kärsivillä henkilöillä on vaikeuksia hahmottaa missä kohdassa sivua he ovat. Hover-ominaisuuden käyttö kappaleissa, lista-elementeissä ja taulukon soluissa antaa käyttäjälle mahdollisuuden käyttää hiirtä paikan merkitsemiseen.

Valitettavasti Internet Explorer ei tue kyseistä hover-ominaisuutta kappaleissa, lista-elementeissä tai taulukkoriveissä. Mikäli tätä menetelmää halutaan kuitenkin käyttää, sitä voidaan emuloida Internet Explorerissa JavaScriptin avulla (käyttämällä Dean Edwardsin IE7:aa [en]).

3.7 Alleviivatut kappaleet

Eräs menetelmä lukemisvaikeuksien helpottamiseksi on aktiivisten kappaleiden tekstin alleviivaaminen. Ideana on tarjota eräänlainen virtuaalinen viivain, joka näkyy jokaisen tekstirivin alla ja helpottaa siten käyttäjän katseen kohdentamista kulloinkin kyseessä olevalle riville.

Eräs tämän tekniikan mahdollisista ongelmista on, että jotkut käyttäjät saattavat sekoittaa alleviivatun kappaleen ja linkit keskenään. Käyttämällä CSS:ia voi tarjota erilaisia alleviivaustyylejä, kuten esimerkiksi punaista pisteviivaa, jolloin tämänkaltaisen sekoittamisen riski vähenee.

3.8 Käänteiset värit

Joidenkin henkilöiden on helpompi lukea tekstiä, kun värit vaihdetaan käänteisiksi niin, että teksti on vaaleaa tummalla pohjalla.

3.9 Taustavärin kirkkaus

Joillekin käyttäjille ongelmia aiheuttaa liian kirkas taustaväri, joka vaikeuttaa lukemista. Tämä voidaan korjata käyttämällä luonnonvalkoista tai vaalean harmaata taustaväriä, joka vähentää kirkkautta.

4. Sisällön ja esitysasun kontrollointi

Monia artikkelissa käsiteltyjä ideoita voidaan käyttää pelkästään tarjoamalla käyttäjälle mahdollisuus valita sisällöstä sopivin esitystapa.

Kun CSS yhdistetään joko JavaScriptiin tai serveripäässä tapahtuvaan skriptaukseen, voi suunnittelija sisällyttää joitain ehdotettuja parannuksia (esimerkiksi linkkien alleviivaus ja laajennettu linkkialue) oletusarvoiseen esitystapaan ja tarjota käyttäjälle mahdollisuutta vaikuttaa myös muihin elementteihin:

  • Sisältö: pitkä tai lyhyt versio.
  • Fontin koko: mahdollisuus suurentaa tai pienentää tekstin kokoa.
  • Luettavuus: vaikuttaa kappaleiden väliseen tilaan ja/tai tarjoaa hover-ominaisuuden kappaleille.
  • Värit: erilaiset väriyhdistelmät, mukaan lukien käänteiset värit ja taustavärin kirkkaus.
  • Rivin pituus: kapea tai leveä asettelu.
  • Rivin korkeus: vaihtoehtoja rivin korkeuden määrittelyyn niin leipätekstille kuin linkeillekin.

Päätelmät

Artikkelin esimerkkejä ei ole tarkoitettu lopullisiksi vastauksiksi ongelmiin, joita mainituista ongelmista kärsivät saattavat verkossa kohdata. Esimerkit ovatkin lähinnä ehdotuksia, joita web-kehittäjä, joka on kiinnostunut saattamaan sisältöä mahdollisimman laajan yleisön saavutettavaksi, voi kokeilla. Joitain tekniikoista on testattu käytännössä, mutta toiset ovat vain yksinkertaisia ideoita, jotka perustuvat teoriaan ja aavistukseen.

Lisäluettavaa

Muut käännösversiot

Ruotsi
Ruotsinkielisestä käännöksestä vastaa Johan Sundsrom.
Italia
Italiankielisestä versiosta vastaa Livio Mondini.