Näkövammaisystävälliset WWW-sivut

Päivitetty 19.3.2001

Suomessa on näkövammaisia noin 80000. Iso osa siitä tiedosta joka näkeville on täysin itsestään selvää on näkövammaisille vaikeasti hankittavissa. Tietoverkkojen, erityisesti Internetin, sivujen muuttuessa yhä graafisimmiksi on olemassa vaara, että näkövammaiset eivät enää kykene käyttämään tätä uutta informaatiolähdettä. Kuitenkin pienin muokkauksin lähes kaikki WWW-sivuilla oleva tieto on myös apuvälineiden avulla luettavissa.

Kuinka näkövammainen käyttää nettiä

Tietokoneesta on 1990-luvulla tullut näkövammaisille hyvä apuväline, jota käyttäen monet päivän työt sujuvat helpommin. Internetiä käytetään yleensä tekstipohjaisella selaimella ja puhesyntetisaattorilla tai pistenäytöllä.

Pistenäytössä pienet metallitapit nousevat alustastaan ylös ja muodostavat kuvaruudulla olevan tekstin pistekirjaimilla.

Heikkonäköinen voi myös lukea kuvaruutua suurennusohjelman avulla. Näin verkon käytölle ei ole suuria teknisiä esteitä.

Kuinka teet näkövammaisystävälliset WWW-sivut

Hankaluuksia tuottaa monesti tapa, jolla sivut on koodattu. Mitä enemmän grafiikkaa sivu sisältää sitä vaikeampaa näkövammaisen on sivua lukea. Tilanne voidaan kuitenkin korjata melko vaivattomasti ja siten, ettei sivun ulkonäkö siitä kärsi.

Ohje perustuu World Wide Web Consortium (W3C) suosituksiin sekä Suomessa kerättyyn palautteeseen ja kokemukseen.

W3C:n ohjeessa kehotetaan pähkinänkuoressa käyttämään oikeaa html-syntaksia sekä erottamaan dokumentin rakenne ja sisältö käyttämällä tyylitiedostoja (Cascading Style Sheets). Dokumentin rakenteen kuvaaminen helpottaa sen lukua erilaisilla uusilla selailuvälineillä. Linkki ohjeeseen löytyy tämän dokumentin lopusta.

Graafiset elementit kuvataan myös sanallisesti

Tärkein asia sivujen toteutuksessa on graafisten elementtien sanallinen kuvailu. Jos esimerkiksi linkit ovat ikoneja tai kuvia ne voidaan helposti koodata seuraavasti käyttämällä kuvan yhteydessä tekstiselitystä.

<A HREF="http://www.omakone.fi"><IMG SRC="koirat.gif" alt="Kuva olmesta koiranpennusta"></A>

Näkövammaisen saapuessa tekstin kohdalle hän tietää mihin on siirtymässä. Jos sivu sisältää kuvia, voidaan ne koodata samalla tavalla. Selostus on sitä parempi mitä enemmän se sisältää asiaan liittyvää oleellista tietoa. Mitään turhaa ei kannata kirjoittaa, mutta esim. "kuva kolmesta koiranpennusta" kertoo enemmän kuin pelkkä "koirat"-sana.

Tekstilinkit tulisi tehdä myös kaikille kuvakartan kautta tavoitettaville linkeille. Usein käytännöllisintä on tehdä tekstilinkit kuvakartan alle.

Värit

Taustaväreinä parhaita ovat neutraalit värit. Tekstivärin tulisi olla selvästi taustasta erottuva, jolloin taustaväri muodostaa hyvän kontrastin tekstin värin kanssa. (Tausta viittaa sekä taustaväreihin, että taustakuvien väreihin).

Vilkkuvat kuvat tai tekstit eivät ole heikkonäköisille helposti havainnoitavia.

Sivujen tekijän tulisi myös välttää värejä, jotka ovat värisokeille vaikeasti havainnoitavia (punainen-vihreä).

Hyvä tapa testata asiaa on katsoa voitko lukea tekemäsi sivut mustavalkoisina. Säilytä mahdollisuus asettaa henkilökohtaiset asetukset värien, taustan, taustavärien tekstityypin ja fontin koon suhteen. Esimerkiksi taulukoiden taustaväri ja toisinaan myös taustakuvat estävät värien mukautuksen katsojalle optimaalisiksi.

Linkit omille riveilleen

Puhesyntetisaattori lukee kuvaruudulta rivin kerrallaan. Jos sivun linkit sijaitsevat vierekkäin, voi niiden lukeminen olla vaikeaa. Olisi suotavaa, että linkkejä olisi vain yksi riviä kohti tai että ne ainakin erotettaisiin toisistaan pystypalkein | tai ympäröimällä [linkki hakasulkeisiin].

Näppäinkäyttö

Kaikki linkit ja muut valinnat tulee voida tehdä pelkällä näppäimistöllä ilman hiirtä. Linkkien järjestys tulee olla looginen ja sivun alusta tulee löytyä se mitä varten sivulla ollaan. Testaa sivusi toimivuus ilman että käytät hiirtä. Sarkaimella pääset linkistä toiseen.

Taulukot

Hyvää ratkaisua taulukoiden käsittelyyn ei tällä hetkellä ole. Taulukoiden ahmottaminen Puhesyntetisaattorilla luettuina on erityisen vaikeaa.

Hyvä vaihtoehto on välttää taulukonkäyttöä. Jos taulukoita käytetään, tulkinta helpottuu kun otsikon tieto - esim. mittayksikkö - merkitään myös taulukon soluun. Ts. jos otsikossa on mittana metri, taulukon soluihin kirjoitetaan 1 m, 2 m jne.

Kehykset-Frames

Tee kehyksille aina noframes vaihtoehto. Esim:

Sivun noframes tekstiosio

<noframes>

Sivun tekstiversio, joka sisältää sivun kaiken informaation ja linkit.

</noframes>

Erillinen kehyksetön versio sivusta

<noframes>

<A HREF="teksti.htm"> Sivun kehyksetön versio</A>

</noframes>

Linkki erilliseen kehyksettömään versioon tulisi sijoittaa sivun alkuun, mieluiten ensimmäiseksi linkiksi.

Lomakkeet

Lomakkeiden täytössä on ongelmana se, että ruudunlukuohjelma (esim. Supernova/Hal) lukee väärän tekstin, eikä löydä kyseiseen muokkausruutuun liittyvää tekstiä. Tämän vuoksi lomakkeiden teossa tulisi myös ottaa huomioon riittävä selkeys eli ei useaa asiaa yhdelle riville.

Esim: Sukunimi: [MUOKKAUSRUUTU]

Etunimi: [MUOKKAUSRUUTU]

On myös hyvä tarjota vaihtoehto on-line -lomakkeille. Tee lomake, joka voidaan tallentaa paikalliselle levyasemalle ja myöhemmin lähettää vaikkapa sähköpostina eteenpäin. Voit myös tarjota vaihtoehdoksi puhelinnumeron johon soittamalla asia hoidetaan.

Vältä tarpeettomia tyhjiä rivejä

Tarpeettomat tyhjät rivit voivat haitata sivun lukemista puhesyntetisaattorilla tai pistenäytöllä.

Tekstityypit ja korostukset

Tekstipohjaista selainta käytettäessä tekstityypit eivät erotu toisistaan. Jos siis jotain asiaa tahdotaan korostaa, se tulisi tehdä sanallisesti.

Ääni ja video

Tee tarvittaessa tekstilinkit ääni- ja videotiedostoihin esim. "x:n tekstikuvaus" tai "kuuntele puhe tai lue tekstikuvaus".

Java ja Java script

Käytä javaa ja java scriptejä harkiten ja tee niille tarvittaessa "vain teksti" -vaihtoehto. Merkkipohjaiset selaimet, kuten Lynx eivät ymmärrä niitä.

Pdf-julkaisujen sijaan html-julkaisuja

Tee pdf (portable document format) tiedostoille html tai txt -vaihtoehto. PDF-dokumenttejä voi muuttaa HTML-muotoon Adoben www-sivuilta löytyvän palvelun avulla.

Adobe Acrobatin readeriin on saatavissa Adoben www-sivuilta sovitin, jolla pdf-tiedosto muuntuu ainakin osittain html:ksi tai tekstitiedostoksi. Käytännössä palstoitetusta ja kuvia sisältävästä pdf dokumentista sovittimella syntyvä tulos ei ole kovin onnistunut.

Heikkonäköisille pdf:n tarjoama suurennusmahdollisuus on hyvä, mutta painikkeiden koon ja värien säätömahdollisuuksien rajoitukset haittaavat käyttöä.

Testaus ja validiointi

Testaa sivusi useilla selaimilla ja eri käyttöjärjestelmissä. Varmista, että testaat myös tekstipohjaisella selaimella (Lynx). Testaa myös vanhemmilla selaimilla (esim. Netscape 3) ja ilman kuvien latausta. Ohjeen laatijoiden kanta on, että perusteltu poikkeaminen säännöistä voi joskus olla oikea ratkaisu.

Eri selaimet

Sivuston tulee toimia laajasti eri selaimilla: pelkällä äänellä toimivilla selaimilla, puhelimilla joita käytetään selaimena, myös vanhemmilla 3-version ja merkkipohjaisilla selaimilla, sekä selaimilla jotka eivät tue kehyksiä (Lynx).

Tarkasta miltä sivusi näyttää Lynxillä: http://www.slcc.edu/webguide/lynxit.html

Jos sivustossa käytetään selaimen tunnistusta, sen avulla on tarvittaessa mahdollisuus turvata savutettavuus tarjoamalla kullekin selaimelle optimoitu versio dokumentista.

Tietokantapohjaisista www-palveluista on helppo tuottaa ohjelmallisesti eri selaimille optimoituja julkaisuja yhdestä kantadokumentista.

Jos sivuista tarjotaan tekstiversio, sivuille vievä linkki kannattaa sijoittaa heti kotisivun alkuun. Näin näkövammainen löytää kohdan helposti ja pääsee heti lukemaan hänelle parhaiten sopivia sivuja.

Tyylitiedostot

Käytä tyylitiedostoja sivujen asettelujen ja ulkoasun toteutukseen.

Lisätietoa

Edellä kerrotut asiat ovat tärkeimpiä pääpiirteitä sivuja rakennettaessa. Suositusta on ollut laatimassa joukko keskeisten näkövammaisjärjestöjen ja tahojen ammattilaisia.

Mikään ohjeista ei aiheuta suuria lisätöitä sivujen tekijälle. Pienelle, mutta innokkaasti verkkoihin tulevalle vammaisryhmälle asia on kuitenkin oleellinen. Näkövammaistahot antavat mielellään asiasta lisätietoja. Toivomme myös palautetta - erityisesti näkövammaisilta Internetin käyttäjiltä. Muokkaamme ohjetta palautteen avulla paremmaksi.

sivun alkuun

Celia - Näkövammaisten kirjasto

Arlainstituutti, nykyisin Keskuspuiston ammattiopiston Arlan toimipaikka

www.arla.keskuspuisto.fi

Näkövammaisten Keskusliitto

Förbundet Finlands Svenska Synskadade r.f

Asiasta enemmän englanniksi:

Web Accessibility Iniative - WAI (World Wide Web Consortium) http://www.w3.org/WAI/

WAI Page Author Guidelines http://www.w3.org/TR/WD-WAI-PAGEAUTH/

Validaattoreita:

W3C HTML Validation Service http://validator.w3.org