Zoom: toteutus käytännössä

Kirjoittaja: Mikko Heikkinen/biomi.org


Zoom-ulkoasun tekeminen on yllättävän monimutkainen asia, eikä yhtä ainoaa oikeaa tapaa ole. Tässä esitän omia ja muutaman asiantuntijan mietteitä aiheesta, perustuen osin aiemmin julkaistuun tietoon (viitteet).

Pyysin kommentteja Luonnontieteellisen keskusmuseon testikäytössä olleesta zoom-ulkoasusta Näkövammaisten kirjasto Celiasta sekä Näkövammaisten Keskusliitosta. Minulle vastasivat ystävällisesti Markku Leino ja Katariina Kiiliäinen (Celia) sekä Virpi Jylhä (NKL).

Zoom-ulkoasun tarkoitus

Zoom-ulkoasulla voi olla useita tarkoituksia:

  1. Sivun toimivuus ruudunsuurennusohjelmien kanssa
  2. Sivun toimivuus hyvin suurella tekstikoolla
  3. Sivun selkeys heikkonäköisten kannalta

Zoom -ulkoasun ominaisuudet

Zoom-ulkoasun perusominaisuudet:

  • Yksipalstaisuus
  • Sivun ja navigoinnin selkeys (yksinkertaisuus)
  • Toimivuus myös käyttäjän omien asetusten kanssa (tekstin koko, värit)

Leino ja Kiiliäinen kirjoittivat: â?¦heikkonäköiset käyttäjät muuttavat itse selaimensa asetukset ja näin voi suunnittelussa pyrkiä Design for All -periaatteen noudattamiseen. Yksi hyvä kaikille riittää, kunhan se on suunniteltu hyvin, eikä esim. estetty vapaata fonttien yms. vaihtoa. Jylhä puolestaan kirjoitti, että â??Reilustiâ?? heikkonäköiset henkilöt yleensä hoitavat internet-selaimen asetukset + Windows asetukset itselleen sopiviksi. â?¦ Pidän tärkeimpänä kuitenkin, että päätyylinne olisi skaalautuva ja käyttäjät voisivat itse muokata selaimen asetuksilla näkymänsä itselleen sopivaksi.

Värit

Monissa zoom-toteutuksissa toimivuutta näkövammaisten kannalta on yritetty parantaa myös tekstikokoa suurentamalla ja käännetyllä väriskaalalla (vaalea teksti ja tumma tausta). Tämä ei kuitenkaan ole tarpeen kolmesta syystä:

  1. Käyttäjät voivat itse säätää nämä selaimestaan (toisin kuin esim. palstajaottelun)
  2. Eri tavalla näkövammaiset voivat tarvita hyvinkin erilaisen ulkoasun. Esimerkiksi joillekin normaalia suurempi teksti voi olla jopa vaikealukuisempaa. Myös värien säätäminen kaikille sopivaksi on käytännössä mahdotonta.
  3. Käyttäjät ovat jo asettaneet selaimeensa itselleen soveltuvat väri- ja kokoasetukset, jos niitä tarvitsevat; muutoin he eivät pystyisi käyttämään useimpia sivustoja.

Kaikille sopivia värivaihtoehtoja ei käytännössä ole mahdollista tarjota. Leino ja Kiiliäinen kirjoittavat: Tällainen käyttäjä [käänteisiä värejä tarvitseva] saattaa haluta mustan pohjan ja keltaisen tekstit, linkit sinisiä ja käytetyt punaisia. Jylhä kirjoittaa: â?¦jos henkilö tarvitsee käänteisiä värejä, hänen on pitänyt tehdä se jo aiemmin. Muut sivut jäisivät muuten näkemättä.

Tekstin koko

Jylhä kirjoittaa: â?¦heikko näkö ei ole sama asia aina kuin suurennetun tekstin tarve. â?¦ Suurennan tekstin selaimen ominaisuuksilla, mikäli se on tarpeen. Samoin saatan pienentää sitä.

Ratkaisu?

Oman sivustoni zoom-tyyleissä perusideana onkin säätää zoom-valikolla vain sellaisia asioita, joita käyttäjä ei voi selaimesta käsin säätää: palstojen jaottelu ja navigoinnin ulkoasu (ja monimutkaisuus). Värien ja tekstin koko puolestaan jätetään käyttäjän säädettäväksi. Tämä on yritetty tehdä mahdollisimman helpoksi mm. olemalla käyttämättä taustavärejä. Myöskään leveyttä ei määritellä eikä erikoisen suuria marginaaleja käytetä.

Avainsana on skaalautuvuus, jota Jylhäkin painottaa: Ärräpäitä syntyy silloin, kun sivusto ei skaalaudu, värit, leveydet tai fontit ovat kiinteitä. Eli tekstimassa ja tyylit on oltava erikseen, silloin sivu on mahdollisimman esteetön tältä osin.

Biomi.org zoom-tyyleillä, ilman käyttäjän tekemiä värisäätöjä (Firefox) sekä käännetyllä väreillä (IE)

Zoom-ulkoasu kannattaakin määritellä mahdollisimman yksinkertaiseksi, tällöin sen mukauttaminen selaimesta käsin on helpointa. CSS-taitolla toteutetuilla sivustoilla tämä on usein hyvin lähellä tyylien poistamista, erityisesti jos navigointi on jo valmiiksi toteutettu yksinkertaisesti. Jos sivusto on tehty esteettömyysohjeiden mukaisesti toimimaan myös ilman tyylejä, on tämä entistä helpompaa. Pieni säätö voi olla paikallaan eri osioiden (esim. navigointi, pääsisältö, lisätiedot) erottamisessa toisistaan.

Se, että käyttäjät tekevät väri- ja tekstisäädöt itse, ei kuitenkaan tarkoita, että ne olisivat zoom-ulkoasussa täysin turhia. Jylhä kirjoittaa erilaisista värivaihtoehdoista: Eri tyylit ovat varmasti ihan ok ja auttanevat henkilöitä, jotka ovat kenties vasta näkövammautuneet (heikkonäköisiksi) tai ovat niin hyvin näkeviä, etteivät ole joutuneet opettelemaan apuvälinekäyttöä, vaan pärjäilevät itsenäisesti.

Värit rakenteen selkeyttämisessä?

Värejä voi käyttää sivun rakenteen selkeyttämisessä, ja sitä kautta käytettävyyden parantamisessa. Tämä pätee myös näkövammaisten kohdalla, mikä tulee ilmi myös Screen Magnification and the Web -videolla. Esimerkiksi eri taustaväreillä voi erotella erityyppisiä linkkejä.

Tällainen värien käyttö ei kuitenkaan sovi hyvin yhteen tässä esitetyn, taustavärittömän zoom-ulkoasun kanssa. Toinen tapa on käyttää tyhjää tilaa rakenteen selkiyttämisessä. Myös viivoista, ikoneista yms. tehosteista voi olla apua osien erottelussa.

Valikon sijoittaminen

Ulkoasuvalikon sijoittaminen on hankalaa. Kun koko tekniikka on uusi, ei mitään vakiintunutta tapaa ole olemassa.

Itselläni ei ole kokemusta ruudunsuurennusohjelmien käytöstä, mutta em. Screen Magnification and the Web -videota katselemalla asiasta saa karkean kuvan. Tämän perusteella tuntuisi, että sivun yläreuna lienee paras sijoituspaikka. Tämä kohta sivusta sisältää useimmiten muutenkin tärkeää tietoa, eikä jää ylenkatsotuksi.

Valikko täytyy kuitenkin suunnitella huolella, jottei se jää otsikon ja navigoinnin varjoon. Valikon teksti kannattaa muotoilla siten, että siitä ilmenee kyseessä olevan pelkkä ulkoasun vaihto eikä erillinen, mahdollisesti harvemmin päivitettävä tai suppeampi versio.

Muita yksityiskohtia

Päätteettömien fonttien (esim. Arial) sanotaan usein olevan selkeämpiä ja toimivampia tietokonenäytöillä. Myös NKL suosittaa Arialin käyttöä. Pieninäyttöisissä laitteissa niiden merkitys voi korostua.

Jos päätyy säätämään sivun värejä, kannattaa niiden valinnassa olla tarkkana. Esimerkiksi tässä kuvassa olevien linkkien ja taustan välinen kontrasti ei ole Leinon ja Kiiliäisen mukaan riittävä:

vaaleansinisiä ja vaaleanpunaisia linkkejä tummanharmaalla taustalla: kontrasti ei ole riittävä

Zoom-ulkoasusta voi olla hyötyä myös pieninäyttöisten laitteiden (kämmenmikrot, kännykät) käyttäjille. Ongelmana voi kuitenkin olla näiden laitteiden heikko tuki vaihtoehtoisille tyylitiedostoille tai muille tyylinvaihdossa käytettäville tekniikoille (esim. Javascript, evästeet).

Yhteenveto

Vaikka useimmat näkövammaiset käyttävätkin selaimen ominaisuuksia säätääkseen ulkoasun itselleen sopiviksi, ei zoom-ulkoasu ole turha. Se tarjoaa lisämahdollisuuksia palstoituksen säätämiseen, mahdollistaa selaimesta riippumattoman ulkoasun säätämisen (esim. aloittelijoille) ja myös helpottaa selaimen kautta tehtävää ulkoasun säätämistä.

Zoom-ulkoasut ovat kuitenkin vielä nuori asia ja paras toteutustapa on löytämättä. Zoom-ulkoasujen yleisyys vaikuttaa niiden toteutustapaan: jos niiden käyttö yleistyy, syntynee vakiintuneita käytäntöjä ja kokemusta eri menetelmien paremmuudesta. Siihen asti mahdollisimman monimuotoiset toteutukset ja niiden testaaminen käytännössä lienevät vain hyvästä.

Viitteet ja lisää aiheesta