Oma tyyli heikkonäköisille

21.01.2005 klo 15.10 • Aihe: Web

A List Apartissa ilmeistyi taannoin Joe Clarkin artikkeli heikkonäköisille suunnatuista sivutyyleistä. Nyt Luonnontieteellisen keskusmuseon sivustolla on koekäytössä artikkelin mukainen tyylivalinta, toteutettuna Paul Sowdenin tyylinvaihtajalla.

Periaatteessa tekstin suurentaminen, värien vaihtaminen ja ulkoasun muuttaminen yksipalstaiseksi on helppoa CSS-pohjaisella sivustolla, mutta käytännössä eteen tuli muutamia ongelmia:

1) Keskusmuseon sivujen perustaitto on tehty kaksipalstaisella taulukolla, koska päivitystyökalu (Dreamweaver MX) ei ymmärrä kunnolla CSS-taittoa. Tämä puolestaan aiheuttaa ongelmia IE:ssä: taulukon soluja ei voi hallita CSS:lla eikä ulkoasusta siten saa yksipalstaista. Solujen tyylimäärityksellä display: block; clear: both; ei ole IE:hen mitään vaikutusta.

2) Tummataustaista versiota suunnitellessa lukuisat värimääritykset aiheuttivat harmaita hiuksia. Asia helpottui huomattavasti kun siirsin kaikki väreihin vaikuttavat tyylit omaan tiedostoonsa, jota ei käytetä heikkonäköisille suunnatuissa versioissa.

3) Yhdessä vaiheessa tummataustaisen version kanssa oli Firefoxissa Flash of Unstyled Content -tyyppinen ongelma: sivu oli aina aluksi hetken valkoinen ennen kuin muuttui tummaksi. Ongelma kuitenkin katosi kun siirsin värimäärittelyt omaan tiedostoonsa (ks. ed.). Aiheuttajana oli kenties päällekkäisten värimääritysten liian suuri määrä?

4) Uudet tyylimääritykset vaikuttanevat myös pienille näytöille (PDA:t yms.) suunniteltuihin tyyleihin. Ainakin Pocket IE 2003 käyttää myös normaalinäytöille (media="screen") suunnattuja tyylejä handheld-tyylien lisäksi.

5) Tyylivalinta ei jostain syystä toimi Opera 7.23:lla, vaikka samalla tekniikalla toteutetut tyylivalinnat näyttävät muilla sivustoilla toimivan. Ongelma saattaa liittyä omalle koneelleni asennettuun Operaan; se käyttäytyy välillä muutenkin kummallisesti. Operan uusimmassa versiossa 7.54 valinta toimii. Joka tapauksessa kuulisin mielelläni muiden mahdollisista ongelmista.

(Vinkki tähän liittyen: jos aiemmin toiminut ulkoasu yllättäen käyttäytyy epäloogisesti, kyse voi olla selaimen satunnaisesta häiriöstä. Kokeile sammuttaa ja käynnistää selain uudestaan. IE:ssä epäloogisuudet ovat kuitenkin arkipäivää ja niistä pääsee vain sammuttamalla selaimen lopullisesti...)

Teknisen toteutuksen lisäksi merkittävä kysymys on tyylivalinnan sijoittaminen: mihin linkki valintasivulle pitäisi sijoittaa, jotta kohderyhmä (heikkonäköiset) löytäisivät sen helposti? Vai pitäisikö valikon olla jokaisella sivulla?

Kommentit

1 Josku (21.01.2005 klo 20.06)

IE 5.2.x kelluttaa #utilities-lohkon oikeassa reunassa ja Safarilla on hieman ongelmia päävalikon kanssa. Aktiivinen linkki peittää osittain yläpuolelle jääviä linkkejä. Ongelma näyttää olevan nimenomaan Safarissa, koska samaa moottoria käyttävällä OmniWebillä ei vastaavaa ongelmaa esiinny. Heitä sähköpostia, mikäli haluat ruutukaappauksen ongelmista.

Operan 8-sarjan betalla toimi hyvin, samoin Firefoxilla. Käyttiksenä OS X.3.7.

Suora linkki tyylivaihtosivulle kannattanee lisätä ainakin sinne -lohkoon.

Tätä viestiä ei voi enää kommentoida.