Saavutettava.fi

Marraskuun 14. päivänä vietetään maailman käytettävyyspäivää. Aiheeseen liittyviä tapahtumia järjestetään myös Suomessa. Mm. Jyväskylän yliopisto järjestää seminaarin, jonka teemana on käytettävyyden merkitys. Seminaarissa tarkastellaan myös käytettävyyden historiaa, nykypäivää ja tulevaisuutta.

Käytettävyyden merkitys on valtava. Huono käytettävyys tulee kalliiksi, toteaa Jyväskylän yliopiston professori Pertti Saariluoma, joka esitelmäi seminaarissa käytettävyystutkimuksen historiasta ja kehitysvaiheista.

Jaa artikkeli

Muutto sujui nopeasti ja toistaiseksi mitään elämää suurempia ongelmia ei ole tullut vastaan. Vikailmoituksia otetaan vastaan palautelomakkeen kautta.

Jaa artikkeli

Kirjoittaja: Alastair Campbell. Käännös: Marjut Mutanen.

Artikkeli on julkaistu alunperin AlastairC -sivustolla nimellä The four levels of PDF accessibility.

---

Portable Document Format (PDF) -dokumenttien saavutettavuus ei ole uusi aihe; sen ovat tietyt asiantuntijat ymmärtäneet ja selittäneet varsin hyvin. Kuitenkin sen merkitys on organisaatioissa varsin tuntematon. Mutta kenties joku kiinnittää siihen huomiota, jos tehdään yhteenveto PDF-dokumenttien saavutettavuuden neljästa tasosta ja siitä, kuinka asia monissa yrityksissä hoidetaan.

Saavutettavuuden tasot

Laajasti ottaen mikä tahansa PDF kuuluu johonkin seuraavista kategorioista riippuen siitä, kuinka se on luotu:

1. Tukemattoman graafisen työkalun luoma PDF (ei saavutettava).
2. Tukemattoman tekstipohjaisen työkalun luoma PDF (todennäköisesti ei saavutettava).
3. PDF, johon tagit on lisätty automaattisesti (saattaa olla saavutettava).
4. PDF, johon tagit on lisätty ja muokattu huolella (saavutettava).

Tukemattoman graafisen työkalun luoma PDF

Tyypillinen tilanne on sellainen, jossa tehdään juliste tai mainoslehtinen, joka on luotu sellaisella julkaisutyökalulla kuin esimerkiksi Quark. Se ei upota tekstiä PDF-dokumenttiin millään käyttökelpoisella tavalla, joten kaikki teksti jää ruudunlukijoilta näkymättömiin, eivätkä sen muutkaan saavutettavuusominaisuudet toimi. Tällaisia tiedostoja ei voi pitää millään tavalla saavutettavina.

Tukemattoman tekstipohjaisen työkalun luoma PDF

Kun käytetään Acrobat Prota (versio 5 tai uudempi, mieluiten 7 tai uudempi) sitä tukevan ohjelman (esim. MS Wordin) kanssa, voidaan PDF-dokumentteihin lisätä tageja, jotka tekevät sille sellaisen rakenteen, jota ruudunlukijat ja muut saavutettavuusteknologiat (ja mobiili) käyttävät. Ellei Acrobat Pron kanssa käytetä tuettua ohjelmaa, PDF-dokumentti luodaan ilman näitä HTML:n kaltaisia tageja. Tämä johtaa harmaalle alueelle.

Jos dokumentti on yksinkertainen, on hyvin todennäköistä, että monet saavutettavuusteknologioita käyttävät ihmiset voivat kuitenkin päästä lukemaan sitä olettaen, että heillä on viimeisimmät ohjelmistot käytössään. Tästä ei ole kuitenkaan mitään takeita, joten on hyvin mahdollista, että monet eivät siihen pysty. Dokumenttia ei kuitenkaan voi pitää saavutettavana; suuri osa verkossa olevista PDF:istä kuuluu tähän kategoriaan.

PDF, johon tagit on lisätty automaattisesti

Kun Acrobat Pron kanssa käytetään tuettua ohjelmaa, kuten Wordia, ja lisätään tageja, on perusta saavutettaville PDF-dokumenteille olemassa. On kuitenkin kokonaan toinen kysymys voivatko saavutettavuusteknologiaa käyttävät ihmiset käyttää sitä; se riippuu suuresti lähdedokumentista. On asioita, jotka voivat mennä, ja yleensä menevät pieleen:

• Dokumenttiin sisällytetyistä kuvista puuttuvat vaihtoehtoiset tekstit.
• Wordin tyylejä ei ole käytetty, mikä tarkoittaa sitä, että Acrobatilla ei juuri ole mahdollisuuksia ymmärtää mikä dokumentin rakenteen pitäisi olla (vaikka se yrittääkin).
• Wordin muotoilu on seonnut ja erottelee sisällön oudolla tavalla, jota ei huomaa ennen kuin lukujärjestys tarkistetaan.
• Dokumentti sisältää taulukoita, joihin on lisättävä koodia Acrobatin käyttöliittymän kautta.

Jos suoritetaan saavutettavuustarkistus (osa Acrobat Prota) mille tahansa dokumentille, jota ei ole manuaalisesti muutettu, on tiedossa ongelmia, sillä automaattinen tarkistus ei huomaa kaikkia edellä mainituista kohdista. Tageja sisältävällä dokumentti saattaa olla saavutettava. Yksinkertaiset dokumentit (ei palstoja, taulukoita tai kuvia) luultavasti ovatkin saavutettavia, mutta vähänkään perusominaisuuksia enemmän sisältävät tiedostot tarvitsevat manuaalista muuttelua päästäkseen samaan lopputulokseen.

PDF, johon tagit on lisätty ja muokattu huolella

Jos käytössä on ollut oikea ohjelma, ja PDF:ää muokataan jälkeenpäin Acrobat Prossa, on mahdollista

• tarkistaa, että rakenne on oikein, ja korjata sitä.
• tarkistaa, että lukujärjestys on oikea, ja korjata sitä.
• määritellä kieli (esim. englanti).
• lisätä alt-tekstejä.
• merkata taulukot oikein.
• poistaa tekstiä sisältämättömät kohdat.

Ja yleisesti ottaen siivota dokumenttia. Tässä vaiheessa voi jo olla varma siitä, että dokumentti on saavutettava.

Kokemusteni mukaan: jos sinulla on 40-sivuinen Word-dokumentti, jossa on käytetty Wordin tyylejä oikein, ja joka sisältää yhden ison taulukon ja 10 kuvaa, kannattaa prosessiin varata 3 tuntia. Jos lähdedokumenttia ei ole tehty Wordilla, tai sen otsikoinneissa ei ole käytetty tyylejä, ajan saa tuplata.

Ja entäpä jos joku muuttaa Word-dokumenttia? Kaikki on tehtävä uudestaan, sillä PDF on lopullinen asiakirjamuoto.

Seuraamuksia organisaatioille

Monet organisaatiot laittavat paljon PDF-dokumentteja verkkoon, ja tietyt sisällöt voivat olla saatavilla vain näissä dokumenteissa. Tämä on saavutettavuuskysymys, ja vieläpä aika suuri (laillinen/moraalinen/tekninen) sellainen.

Mitä tehdä?

Puntaroitavana on useita tekijöitä, joista suurimmat ovat:

• Vaikeudet, joita ihmisillä voi PDF-dokumenttien käsittelyssä olla, etenkin saavutettavuuteen liittyen.
• Kuinka suotavaa on laittaa verkkoon pitkiä dokumentteja verkkosivuina.

Saavutettavuuden suhteen ratkaisevaa on se, että kaikki ihmiset eivät voi helposti saavuttaa PDF-dokumentteja. Se ei kuitenkaan tarkoita sitä, että suotavin tapa olisi lisätä verkkoon erittäin pitkiä HTML-sivuja. Kun dokumentti on pitkä, eikä sellaisena sovellu verkosta luettavaksi, tuntuu PDF:n käyttö sopivimmalta vaihtoehdolta.

Olettaen, että tyypillisessä tapauksessa PDF liitetään uutiseen, neuvoston kokoukseen, yhtiökokoustiedotteeseen tai vastaavaan, voidaan saavutettavuus ja yhteensopivuus varmistaa seuraavalla tavalla:

1. Liitä yhteenveto HTML-sivulle (joka itsessään on sopiva verkosta lukemiseen).
2. Tee itse PDF:stä saavutettava (ts. käytä sopivaa lähdeohjelmaa, kuten Wordia, ja luo tageja sisältävä PDF-dokumentti).
3. Anna käyttäjille mahdollisuus pyytää dokumenttia muussa muodossa, kuten esim. Word tai RTF (Rich Text Format).

Jos ylläolevia neuvoja noudatetaan, tekee organisaatio riittävästi varmistaakseen sen, että kaikilla on pääsy heidän sisältöihinsä. PDF:t eivät ole luontaisesti epäsaavutettavia, mutta niistä on kuitenkin tullut saavutettavia vasta viime versioissa; tällä hetkellä ne eivät ole helposti saavutettavissa. Aikaa myöten (kun ihmisillä on ajanmukaisempia ohjelmia) kohta 3 saattaa käydä tarpeettomaksi.

Tämän pitäisi luonnollisesti vaikuttaa käytäntöihin. Olisi epärealistista olettaa yritysten muuttavan tuhansia historiallisia dokumentteja saavutettaviksi PDF:iksi. Kuitenkin, kuten ylläolevassa suosituksessa, mahdollisuus pyytää dokumenttia eri muodossa tekee siitä käytännössä saatavan ilman kohtuutonta työmäärää.

Kuitenkin yritysten on vaikeaa muuttaa prosesseja ja ryhtyä tekemään tästä lähtien saavutettavia PDF:iä. Edellytyksenä on merkittäviä muutoksia siihen, kuinka sisältöä tuotetaan: Wordien tyylit on otettava käyttöön ja lisättävä kuville vaihtoehtoiset tekstit. Vasta sitten tietoa saavutettavien PDF-dokumenttien luomiseksi voidaan hyödyntää.

Jaa artikkeli

Kirjoittaja Tino Rossi toimii Steerco Oy:ssä graafisen suunnittelun ja käytettävyyden konsulttitehtävissä. Hän tekee työkseen käyttöliittymäsuunnittelua, grafiikkaa ja käytettävyys- ja saavutettavuusarvioita.

---

Jälleen on edessä yksi käytettävyyden asiantuntija-arvio. Heuristiset listat odottavat pöydänkulmalla ja raporttipohjakin on valmiina. Näitähän on tehty – käytettävyyden tutkimisen perusteet ovat tilaajallekin tuttuja, ja raporttia esiteltäessä neuvotellaan tilaajan kanssa vain siitä, millä ehdoin tekstivärin ja taustavärin kontrastia voi pitää riittävänä, tai miten tilaajalle rakas brändielementti on luettavuutta riskeeraava vesileimakuva tekstin taustalla.

Tilaajan käytettävyysvaatimuksissa kuitenkin kummittelee esteettömyys ja saavutettavuus. Julkishallinnon tilaaja on tehnyt kotiläksynsä ja osaa suorastaan nimetä standardit, joita pitäisi noudattaa: suunnittelu- ja saavutettavuuskriteereinä JHS 129 ja WAI:n A-taso. Ja kuitenkin itse luulen, ettei tilaaja kyllä tiedä, mitä näillä standardeilla vaatii. Pistänkö sitten raporttiin korjattavaksi ongelmakohdaksi sen, jos sisä- ja ulkolinkit eivät ole erilaisia, tai jos sivulla olevan ranskankielisen sutkauksen lang-attribuuttia ei ole merkattu? Ja kun näitä käytettävyys- tai esteettömyysriskejä asiakkaalle esittelen, miten vakavina ne esitän? Ovathan ne kuitenkin tilaajan osoittaman standardin vastaisia…

Saavutettavuuden nuorallatanssia

Arviointiraportin kirjoittaneen asiantuntijan mielipiteistä, intohimoista, ortodoksisuudesta ja henkilökohtaisesta näkemyksestä on paljolti kiinni se, millaisia korjauksia tai toimintaperiaatteita tilaaja vaatii tekniseltä toimittajaltaan tai palvelun ylläpitäjiltä. Saavutettavuustavoitteet pitäisi varmaankin sijoittaa realistisesti johonkin kohtaa sellaista janaa, jonka toisessa päässä on antiikkista ruudunlukuohjelmaa kuunteleva sokea ihminen ja toisessa päässä haukankatseinen lyhytjännitteinen nuori huippumikronsa kanssa. Asiaan sisältyy melkein aina kompromisseja ja tahtotilaa jostain sellaisesta ihanteesta, joka ei vielä ole toteutuskelpoinen.

Asiantuntijan tehtävänä on esittää huomioitaan ja arvioita näiden vakavuudesta, vaikka kaikki osapuolet saattavat ounastella, että korjaustoimenpiteisiin ei kuitenkaan ryhdytä. Sillä tosin voi lohduttautua, että ajatus voi jäädä muhimaan asiakkaan mieleen ja tulla otetuksi huomioon jossain seuraavassa isossa palveluremontissa.

Yhteisesti jaetussa tahtotilassa on vielä näkyvimpänä ja kuuluvimpana osapuolena se “keskivertokäyttäjä”, jonka palaute kantautuu tilaajalle kaikkein keskeisimpänä. Todennäköisesti verkkopalvelun ylläpitäjät eivät koskaan saa tietoonsa sitä, jos tekstiselaimen käyttäjät eivät onnistu lähettämään lomaketta, mutta heille voi sataa kiukkuisia valituksia siitä, että tekstikoko on lukukelvottoman pientä. Ja näissä yhteydenotoissa on kysymys siitä, että loppukäyttäjän selaimesta on huomaamatta säädetty tekstikoko minimiin, ja hänellä ei ole aavistustakaan siitä, miten sitä voisi itse suurentaa tai että siihen voi ylipäätään itse vaikuttaa. Tällaisessa tapauksessa verkkopalvelusta vastaavat valitsevat rutinan lopettamiseksi ilman muuta kiinteästi määritellyn pistekoon tekstille, vaikka kuinka hyvin tietäisivät suhteellisen tekstikoon edut ja standardinmukaisuuden. Päätös jää tietysti tilaajalle, mutta kuinka sitten palveluntarjoajia ja käyttäjiä valistetaan? Ja milloin siihen esteettömämpään tulevaisuuteen päästään?

Julkaisujärjestelmä ei ole saavutettavuuden ystävä

Saavutettavuuden esteistä suurimpia eivät enää pitkään aikaan ole olleet high tech -nörtit tai visuaalisuuden ehdoin ajattelevat graafiset suunnittelijat. Päinvastoin, nämä ovat kääntäneet osaamisensa esteettömyyden tavoitteluun, ja uudeksi yhteiseksi viholliseksi on noussut sisällönhallintajärjestelmien huima kehittyneisyys.

Monikanavajulkaiseminen ja massiiviset, käyttäjäystävälliset julkaisujärjestelmät tuottavat helposti sellaisia lopputuloksia, joiden yksittäisiin esteettömyysongelmiin ei ole mahdollista puuttua. Sivuston omistajallakin voi olla vilpitön halu saavutettavuuteen, mutta on turha kuvitella, että oto-tiedottaja pystyisi tuottamaan julkaisujärjestelmällä taulukon otsikkosolulle sarakeryhmämäärittelyjä tai tägejä akronyymien tarkentamiseen. Mitä näppärämmin copy-paste sujuu, sitä esteellisempää lähdekoodista näkyy syntyvän. Järjestelmän valmistajakin saattaa olla samaa mieltä, mutta neuvoo odottamaan seuraavaa versiota ongelmien ratkaisemiseksi.

Meidän sivujamme eivät sokeat käytä

Kaikki esteettömyyden eteen tehty työ tähtää vain yhteen asiaan: käyttökokemuksen helpottamiseen. Mutta keitä nuo sivustolle tulvivat ihmiset oikein ovat? Ja ketä heistä palvellaan innokkaimmin? Sopivan saavutettavuuden tason määrittely vaatii tietoa sivustolle saapuvista käyttäjistä ja heidän laitteistostaan. Asiakkaalla on useimmiten hyvä kuva keskiarvoasiakkaastaan, mutta olennaisesti vähemmän tietoa erilaista pienryhmistä, jotka myös löytävät tiensä palveluun.

Vastauksia marginaalissa surffaavien määrästä voi koettaa onkia erilaisista kävijätilastoista. Dataa on useimmiten tallennettu kunnioitettavia määriä, mutta aina kerättyä tietoa ei ole kuitenkaan hyödynnetty tehokkaimmalla mahdollisella tavalla. Palvelua suunnitteleva taho ei aina kommunikoi tietoa keräävien ihmisten kanssa. Yleinen hämmennys valtaa usein tilaajan, kun käy selville että prosenttiluvut eri selaimista, käyttöjärjestelmistä ja resoluutioista ovat tosiaan saatavissa, kunhan sellaista tietoa vain osaa pyytää. Lukujen valossa on kenties helpompi päättää, millaiselle käyttäjälle kumarretaan ja millaiselle pyllistetään.

Ammattimainen pomminpurkaja

Tilanne ei ole mitenkään lohduton. Vaikka verkko on vieläkin saavutettavuuspommeja tulvillaan, sivut ovat parantuneet viime vuosina. Kaukana ollaan vielä yleisestä saavutettavuusperiaatteesta, mutta ainakin asiasta puhutaan, ja yhä useammin esteettömyyttä osataan vaatia. Ammattilaiset osaavat jo tehdä asiat oikein, jos heitä siihen patistetaan. Onneksi kukaan ei enää kehtaa möläyttää sellaisia sammakoita kuin jo kadonneen uusmediafirman myyntimies: “Jos ne ei osaa ladata uusinta selainta, niin ei niitä kyllä asiakkaiksi kaivatakaan”.

Jaa artikkeli

Jokin aika sitten lukijamme lähestyi meitä kysellen linkkivinkkejä ja lähteitä saavutettavuusaiheiseen graduunsa. Eilen saimme tietää, että gradu on valmis, ja nyt meillä on myös kunnia esitellä se! Jukka Mäntylän gradussa Www-sivun saavutettavuuden automaattinen arviointi DOM-rajapintaa käyttäen mm. tarkastellaan, miten erilaiset vammat ja tekniset rajoitteet vaikuttavat verkkosivujen selailuun ja selvitetään kriteerit, jotka edistävät verkkosivujen yleistä saavutettavuutta. Näiden kriteerien pohjalta kehitettiin automaattinen saavutettavuuden arviointijärjestelmä, joka hyödyntää selainympäristön tarjoamaa DOM-rajapintaa ja elementtien asemointitietoja. Näistä louhitut tiedot mahdollistavat dynaamisten sivustojen kattavan arvioinnin.

Gradun yhteydessä toteutetun automaattisen arviointityökalun runko on kaikkien kokeiltavissa: Acc – an Accessibility Evaluator.

Onnea, Jukka!

Jaa artikkeli

Aina aika ajoin saamme lukijoilta tai satunnaisilta vierailijoilta kysymyksiä siitä, mistä saavutettavuusasoihin perehtymisen voisi aloittaa. Erityisen usein kysellään kirjojen perään, niin internet-aikakautta kuin elämmekin. Kuten kaikki tietävät, verkko on on pullollaan monenlaista materiaalia, mutta jos aihealue ei ole vielä tuttu, on lähdekritiikkiä vaikea harjoittaa. Siksi jonkun perehtyneemmän tahon vinkit voivat olla paikoillaan. Siispä kokosimme aiheesta kiinnostuneille kompaktin aloituspaketin, jonka läpikäymisen jälkeen tietää jo enemmän kuin useimmat vastaantulijoista.

Kirjat

Kokonaisia kirjoja löytyy jonkin verran, ja osa niistäkin löytyy ilmaiseksi verkosta. Joe Clarkin Building Accessible Websites -kirjan verkkoversio lienee tunnetuin, ja monien mielestä myös paras. Toinen vastaava on Accessible Web Sites, josta on olemassa myös (hankalahko) verkkoversio. Kolmas, ja vain verkkoversiona ilmestynyt kirja on Mark Pilgrimin Dive Into Accessibility. Myös Jeffrey Zeldman sivuaa aihetta “oranssissa kirjassaan”.

Viime vuonna ilmestynyt Sarah Hortonin Access by Design on mainio, oivaltava ja selkeä perusteos saavutettavuudesta. Verkosta sitä ei löydy, mutta suomalaisista kirjakaupoista kyllä.

Tässä yhteydessä on mainittava myös Trenton Mossin Webcreble Handbook, jonka houkuttelevuutta pienentää huomattavasti sen kohtuuton hinta sisältöön nähden.

Tämän syksyn uutuus on mm.Web Accessibility: Web Standards and Regulatory Compliance, jota saattaa saada satunnaisesti hyvinvarustelluista suomalaisistakin kirjakaupoista ainakin tilaamalla. Ennakkomaistiaisena verkossa on saatavana kirjan ensimmäinen kappale, Understanding Web Accessibility. Edullisemmalta vaihtoehdolta vaikuttaa 60 hot to touch Accessible Web Design tips, jonka verkosta ladattava versio kustantaa vain reilut 13 dollaria, eikä se painettunakaan ole juuri sen kalliimpi. Odotamme pääsevämme näihin kirjoihin ennen pitkää käsiksi.

Verkossa

Yleisesti ottaen hyviä resursseja löytyy myös verkosta melko paljon. Mm. WebAIM, Accessify.com, Juicy Studio, WSG (Web Standards Group), Web Usability ja The Web Standards Project ovat hyviä paikkoja aloittaa materiaalin metsästys.

Suomenkielistä materiaalia kaipaavalle tilanne on kinkkisempi. Tieken sivuilta löytyy kuitenkin Esteettömyysopas, jossa on paljon myös teknistä ohjeistusta, vaikkakaan sen lukemiseksi ei tarvitse olla HTML-nero. Essi – esteetön sisällöntuotanto on verkkokurssi, joka ohjaa tekemään esteettömiä verkkoaineistoja. Sisältö on jaoteltu näppärästi kohderyhmän mukaan niin, että sekä kirjoittaja että tekninen toteuttaja löytävät helposti kannaltaan relevantit asiat. Sitten on vielä JHS 129 Julkishallinnon verkkopalvelun suunnittelun ja toteuttamisen periaatteet -suositus, jonka tarkoituksena on opastaa viranomaisia verkkopalveluiden suunnittelussa, toteutuksessa ja hankinnassa. Käytännössä tämä on ainoa valtionhallinnon taholta saatu ohjeistus aiheeseen, ja sopii hyvin luettavaksi myös muillekin kuin verkkopalveluita suunnitteleville viranomaisille. Siinä otetaan kantaa myös muuhunkin saavutettavuuteen, ja sellaisena se sopii hyvin mille tahansa verkkosivuprojektia suunnittelevalle taholle.

Tulossa?

Kotimaisista saavutettavuusresursseista on huutava pula; esimerkiksi suomenkielisiä kirjoja ei ole tietojemme mukaan yhtään, eikä näitä verkkosivujakaan tungokseksi saakka ole tehty. Jos siis joku taho ryhtyisi suomenkielistä teosta tekemään, tai jo tehdyistä kääntämään, sille voisi kuvitella olevan hyvät ja kaiken aikaa kasvavat markkinat.

Lisäksi: jos tiedossasi on muita hyviä vinkkejä aiheesta kiinnostuneelle, niin kerro se kommenteissa! Päivitämme tätä merkintää tarpeen mukaan.

Jaa artikkeli

A List Apart: To Hell with WCAG 2 (Web Content Accessibility Guidelines 2.0)

Viiden vuoden kehitystyö uuden verkkosisällön saavutettavuusohjeen (WCAG 2) osalta alkaa olla loppussuoralla. Hieno asia, kaikki ovat iloisia ja suosituksenkin pitäisi olla näin pitkän kehitystyön jälkeen vähintäänkin erinomainen.

Nykymuotoisen suositusluonnoksen kovaäänisin vastustaja, kanadalainen tietokirjailija, toimittaja ja esteettömyys-asiantuntija Joe Clark ampuu tuoreessa A List Apartin numerossa uuden suosituksen alas. Artikkelissa kyseenalaistetaan niin itse suositusluonnos kuin työryhmän toimintatavatkin.

Artikkelissa esiin nostettuja epäkohtia ovat mm.:

• suosituksen (ja oheisdokumentaation) massiivinen koko
• englanninkielisyys
• suositusluonnoksen lyhyt kommentointiaika
• määritelmät
• testattavuus
• vaikeaselkoisuus / tulkinnanvaraisuus

Joe Clarkin mukaan uusi suositus ei välttämättä ole edes parannus jo olemassa olevaan suositukseen (WCAG 1.0) verrattuna. Hän kehottaakin lukijoita kommentoimaan luonnosta ja näin vaikuttamaan sen lopulliseen muotoon. Nykymuotoisen suosituksen seuraaminen onkin artikkelin esille nostamien ongelmien takia hankalaa – käytännössä siis vain aniharva, jos kukaan pystyisi täyttämään kaikkia siinä esitettyjä saavutettavuusvaatimuksia. Voi vain toivoa, että työryhmä ei anna henkilökohtaisten erimielisyyksien vaikuttaa asiaan, ja että ainakin artikkelissa mainittuihin epäkohtiin puututtaisiin ennen kuin luonnos saa suositus-statuksen.

Artikkelin lopussa mainitaan myös WCAG Samurai -sivusto, jolla tullaan ehdottamaan korjauksia ja laajennuksia sekä olemassa olevaan että tulevaan ohjeistukseen.

Tulevan suosituksen suomenkielistä versiota ei kannattane odotella pitkään aikaan, koska sen julkaiseminen ilman käännettyä oheisdokumentaatiota ei ole järkevää.

Lisäys: WCAG 2.0-suositusluonnoksen kommentointiaikaa on jatkettu kolmella viikolla.

Jaa artikkeli

Kirjoittaja: Timo Laak

---

Tietokone-lehden blogissa kirjoitetaan WAP:in kuolemasta, sillä Nokian uusi S60-selain ei enää oletusselaimena avaa WAP-palveluita. Suuntauksena on siis yksi ja sama internet kaikille käyttäjille, myös mobiilikäyttäjille.

Erilaisten mobiililaitteiden yleistyminen tuottaa haasteita internetin sisällöntuottajille ja suunnittelijoille. Saavutettavien palveluiden rakentaminen kun vaatii tietynlaista osaamista, eikä se tietylle selaimelle ja resoluutiolle optimoitu sivusto välttämättä toimikaan mobiiliselaimella aivan samalla tavalla.

World Wide Web Consortiumin eli W3C:n määrittelemät mediatyypit sisältävät handheld-kategorian, joka kattaa osan mobiililaitteista, mutta esimerkiksi Sony Playstation Portable tulkitaan screen-laitteeksi, kuten mikä tahansa “tavallinen” tietokone. Sen maksimiresoluutio on vain 480×272 pikseliä. Monia sivustoja ei ole suunniteltu resoluution, selainikkunan tai fonttikoon mukaan skaalautuviksi, ja noin 750 pikselin kiinteä leveys on hyvin yleinen. Tällainen sivu ei kuitenkaan näy em. mobiililaitteen selaimella oikein, vaan osa sisällöstä jää ruudun laidan ulkopuolelle.

Myös tärkeät pikalinkit puuttuvat usein kokonaan, jolloin käyttäjän navigointi vaikeutuu, kun pienellä ruudulla täytyy selata joskus jopa useita sivuja tekstiä, jotta pääsisi edes päänavigaatioon, saati sitten muuhun sivun sisältöön käsiksi.

Kun ihmiset liikkuvat paljon ja haluavat hoitaa asioitaan myös tien päällä ja samanaikaisesti tekniikka kehittyy, voidaan ennustaa mobiililaitteiden osuuden koko ajan kasvavan. Tämä asettaa internet-palveluiden suunnittelulle lukuisia uusia haasteita, sillä yhä suurempi asiakas- ja käyttäjäjoukko ei enää kuulukaan kategoriaan “resoluutio 1024×768 ja IE 5.0+”.

Mobiilisti saavutettava

Saavutettavien mobiilisivustojen toteuttamisessa on tärkeintä ymmärtää laitteiden ominaisuudet ja rajoitteet, kuten pienet näytöt, alhaisempi käytettävissä olevien värien määrä, hidas verkkoyhteys ja erilainen näppäimistö sekä hiiren puuttuminen.

Tarjoamalla oma CSS-tiedosto handheld-laitteille voidaan välttää monia ongelmia. Samalla on mahdollista ottaa tehokkaammin huomioon mobiililaitteiden rajoittavat ominaisuudet heikentämättä muilla laitteilla sivuja selailevien kokemuksia. Riippumattomuus näyttöresoluutiosta ja suurikokoisten kuvien välttäminen ovat tärkeimpiä huomioitavia asioita, mutta myös pikalinkit sivun sisällön eri osiin ja sisällön esittäminen rakenteellisesti järkevässä muodossa, lyhyesti ja ytimekkäästi, ovat tärkeitä avainkohtia saavutettavuuden ja hyvän käyttökokemuksen turvaamisessa. Yksinkertainen on kaunista myös mobiililaitteen ruudulla.

Suunnittelijan näkökulmasta yksi suurimmista ongelmista on kattavan testaamisen vaikeus. Mobiililaitteita kun on pilvin pimein ja jokainen on erilainen, joten on mahdotonta testata työn alla olevaa sivustoa niillä kaikilla. Toimivuus tekstipohjaisella selaimella on jo suuntaa antavaa, mutta myös emulaattoreita ja erilaisia työkaluja on saatavilla mm. Nokian laitteille ja useimmista matkapuhelimista löytyvälle Openwave-selaimelle. Myös Adobe tarjoaa kehitystyökaluja. Mobiilikehittäjän “Raamattuna” toimii luonnollisesti W3C:n ohjeistus mobiililaitteille.

Kaiken tämän ohella mobiilin saavutettavuuden saralla riittää paljon tekemistä. Sisältö ei vielä riitä, vaan myös laitteiden ominaisuuksiin täytyy kiinnittää huomiota. Kuka suunnittelisi sen universaalin, erittäin käytettävän ja saavutettavan mobiililaitteen?

Jaa artikkeli

Kirjoittaja: Timo Laak

---

1. Johdanto

Saavutettavaa typografiaa -artikkelisarjan ensimmäisessä osassa käytiin läpi printti- ja webbipuolen keskeisimmät erot, erilaiset fonttityypit ja tutkailtiin typografiaa saavutettavuusnäkökulmasta.

Toisessa osassa sukelletaan syvemmälle typografisen valtameren aaltoihin. Käyttääkö suurta fonttia vai pientä fonttia? Miten fontteja voi tehostaa tai miten niiden näkyvyyttä ja luettavuutta voi parantaa?

2. Iso fontti, pieni fontti

Fonttikoko selaimissa on mahdollista määritellä eri yksiköillä. Kokomääritelmät jakautuvat absoluuttisiin eli kiinteisiin ja relatiivisiin eli suhteellisiin. Kiinteä fonttikoko näyttäytyy nimensä mukaisesti aina tietynkokoisena. Suhteellinen fonttikoko taas määrittyy ympäristönsä mukaan.

Fonttikoko voidaan määritellä yksinkertaisimmin kiinteänä käyttämällä valmiita arvoja, joita ovat xx-small, x-small, small, medium, large, x-large ja xx-large. Vastaavat suhteelliset arvot ovat larger ja smaller. Suhteellisuus tarkoittaa sitä, että fontin koko määritellään suhteessa selaimen oletuskokoon tai periytymisen kautta saatuun kokoon. Useimpien selainten oletusfonttikoko on 16 pikseliä. Tällöin larger-arvon saava fontti on selaimesta riippuen 1,2 kertaa suurempi ollen näin 19,2 pikseliä. Vastaavankokoisen fontin tuottaa myös arvo font-size: 120%.^[1]

Ongelmia

Fonttikoon määrittäminen ei kuitenkaan ole näin yksinkertaista. Periytyminen (inheritance) aiheuttaa ongelmia, sillä eri selaimet käsittelevät sisäkkäisiä elementtejä eri tavoin. Eri selaimissa myös oletusfontti saattaa olla eri kokoinen. Internet Explorerin 5-versiossa oletusfonttikoko on suurempi kuin 6-versiossa. Yhteensopivuustilassa (quirks mode) IE6:n näyttämä oletusfonttikoko on normaalia suurempi. IE6 asettuu yhteensopivuustilaan, mikäli ennen dokumenttityypin määrittelyä on esimerkiksi kommentteja tai jos dokumenttityyppi puuttuu kokonaan.

Mittayksiköt

Fonttikoko voidaan määritellä myös kiinteiden mittayksiköiden avulla. Kiinteitä mittayksiköitä ovat pt (piste), pc (pica), in (tuuma), cm (senttimetri) ja mm (millimetri). Kiinteistä yksiköistä on hyötyä vain, jos näyttölaitteen fyysiset ominaisuudet ovat tiedossa. Sen vuoksi niitä ei kannata käyttää ruudulta luettavan tekstin määrittelyissä.

Pikseli on osaltaan kiinteä, mutta myös suhteellinen kokoyksikkö. 12 pikselin fontti on aina 12 pikselin fontti, mutta pikselin koko määrittyy käytetyn näyttölaitteen ominaisuuksien mukaan. 1600×1200 pikselin resoluutiossa 17 tuuman näytöllä yksi pikseli on pienempi kuin 800×600 pikselin resoluutiossa vastaavan kokoisella näytöllä.

Internet Explorerin tekstinsuurennos ei vaikuta pikseleinä määritettyihin fontteihin, jolloin käyttäjä ei halutessaan voi helposti suurentaa tekstiä. Tästä syystä pikseliä ei suositella käytettäväksi fonttikokoa määriteltäessä.

Suhteellisia kokomääritelmiä ovat em, ex ja %. Em on saanut nimensä M-kirjaimesta – 1 em on keskimääräisen suuren M-kirjaimen korkeus eli versaaliaakkosten H-korkeus. Tavallisesti tämä koko on selaimessa 16 pikseliä. Vastaavasti ex on gemena-aakkosten x-korkeus. Versaalilla tarkoitetaan suuria kirjaimia ja gemenalla pieniä kirjaimia.^[2]

Monet eri selaimet näyttävät samankokoisiksi määritellyt fontit hieman eri kokoisina. Typografin on oltava tietoinen näistä eroista ja tarvittaessa muokattava oma tyylisivunsa eri selaimille. On myös huolehdittava siitä, että fontit ovat tarpeeksi suuria, jotta ne säilyisivät helppolukuisina.

Luettavuus

Monet keski-ikäiset eivät pysty lukemaan painettua tekstiä tai 10-12 pikselin ruutufonttia ilman silmälaseja. Käyttäjä voi toki suurentaa fonttia, jos hän tietää kuinka se tehdään, mutta fontin suurentaminen saattaa rikkoa sivuston näkyvän rakenteen. Vastaavasti liian suuri fonttikoko voi myös olla ongelmallinen. Fontti saattaa tavallaan â??hyökätä silmilleâ? ja käyttäjä joutuu perääntymään näytöltä kauemmaksi tai pienentämään fonttia selaimesta voidakseen lukea tekstiä paremmin. Myös fontin pienennys rikkoo helposti sivuston rakenteen.

On viisasta varautua ulkoasun suunnittelussa siihen, että käyttäjä saattaa muuttaa fonttikokoa, jolloin ulkoasun ja visuaalisen ilmeen on pystyttävä joustamaan ja mukautumaan. Visuaalisen ilmeen suunnitteleminen skaalautuvaksi ja elastiseksi helpottaa sen mukautumista erilaisille päätelaitteille ja asetuksille.

3. Tehostekeinot

Tekstin ulkoasuun voidaan vaikuttaa paitsi erikokoisilla ja erilaisilla fonteilla, myös erilaisilla tyyleillä. CSS antaa melko hyvät mahdollisuudet vaikuttaa tekstin ulkoasuun.

Rivit ja välistykset

Rivikorkeus helpottaa lukemista erityisesti silloin, kun tekstirivit ovat pitkiä. Line-height määrittää tekstirivien etäisyyden toisistaan. Letter-spacing määrittää yksittäisen merkin jälkeen tulevan tyhjän tilan ennen seuraavaa merkkiä. Word-spacing puolestaan määrittää vastaavasti yksittäisen sanan jälkeen tulevan tyhjän tilan leveyden. Kerning-tukea ei nykyisissä selaimissa vielä ole, mutta CSS3-tuen myötä sellainen on tulossa. Kerningin avulla voidaan vaikuttaa tiettyjen merkkien välien leveyteen. Esimerkiksi W- ja T -kirjaimia täytyy usein käytettävästä fontista riippuen siirtää lähemmäksi seuraavaa merkkiä, jotta kirjainten väli ei muodostuisi liian avaraksi.

Whitespacella eli tyhjällä tilalla tai välistyksellä voidaan mm. erottaa tietyt sanat helposti muun tekstin seasta tai esittää nimikirjaimet selkeämmin. CSS:n letter-spacingin ja word-spacingin ohella on tarjolla myös white-space -määre, jonka avulla on mahdollista määrittää, kuinka elementin sisäisiä välilyöntejä käsitellään. Unicode-merkistössä on omat symbolinsa eri kokoisille välistyksille, jolloin mahdollisuudet tekstin muokkaamiseen laajentuvat. On kuitenkin mahdollista, että selain, joka tällaista merkistöä ei tue, näyttää tyhjää tilaa kuvastavien merkkien tilalla merkkipaikkaa osoittavan neliösymbolin.^[3]

Sisennykset

Text-indent sisentää kappaleen ensimmäisen tekstirivin. Tätä tapaa käytetään tavallisesti painetussa tekstissä korostamaan kappalevaihtoja ja helpottamaan seuraavan kappaleen löytämistä. Myös tyhjä rivi kappaleiden välissä auttaa havaitsemaan kappaleenvaihdon, mutta sisennyksellä saadaan tekstiin pientä rosoisuutta, joka auttaa kiinnittämään katseen juuri kappaleen alkuun. Mikäli tilaa tekstille on niukalti, voi pelkkä sisennyskin olla täysin riittävä kappale-erotin.

Tekstin tasaus

Text-align eli tekstin tasaus mahdollistaa tekstin tasaamiseen oikealle, vasemmalle tai molempiin laitoihin sekä keskittämisen. Vasemmalta oikealle luettavan tekstin suositeltavin tasaus on vasen laita. Keskitystä käytetään usein mm. otsikoissa tai listoissa, mutta keskitystä tulisi välttää, sillä keskitetyn tekstin lukeminen on hankalaa. Siististi tasattu teksti on paitsi helppolukuisempi, myös esteettisempi ja visuaalisesti miellyttävämpi.

Molempien laitojen tasaus on hyvin ongelmallinen erityisesti kapeilla palstoilla tai mikäli teksti sisältää hyvin pitkiä sanoja. Ilman tavutusta sanojen välistykset muodostuvat hyvin pitkiksi, jolloin silmä karkaa helposti luettaessa seuraamaan tekstistä löytyviä aukkoja. Tavutettuna ja oikein toimiessaan molempien laitojen tasaus muodostaa liian kiinteän tekstikappaleen, jonka lukeminen saattaa olla monille hyvin hankalaa. Katse eksyy helposti väärälle riville ja viimeksi luetun kohdan uudelleenlöytäminen on vaikeaa.

Tavutus

Tavutuksen apuna voidaan käyttää ns. pehmeitä tavumerkkejä (soft hyphen), jotka niitä tukevissa selaimissa kirjoittavat tavuviivan ja jakavat sanan kahdelle riville, mikäli sana sijoittuu rivin loppuun, eikä mahdu kokonaisuudessaan yhdelle riville. Monet selaimet eivät tue tämänkaltaista tavutusta, jolloin tavutus ei joko toimi lainkaan tai pahimmassa tapauksessa kaikki tavumerkit näytetään. Lisäksi tavutuksen laatiminen pitkään tekstiin on hyvin työlästä ja hankaloittaa tekstin myöhemmin tapahtuvaa muokkausta. Tulevaisuudessa on mahdollista, että tuki tavutukselle löytyy selaimista itsestään, mutta kattavaa tukea maailman monille eri kielille saataneen odottaa vielä pitkään.^{[4], [5]}

Kontrasti ja värit

Tekstin kontrasti ja väri vaikuttavat luettavuuteen paljolti. Liian vähäinen kontrasti heikentää luettavuutta ja liian voimakas häikäisee silmiä ja aiheuttaa ns. jälkikuvailmiön, jollainen syntyy, kun katsomme pitkään kirkasta valonlähdettä ja siirrämme sitten katseemme toiseen paikkaan. Sopiva kontrasti helpottaa lukemista eikä rasita silmiä.

Oikeilla värivalinnoilla voidaan vaikuttaa visuaaliseen ilmeeseen positiivisesti. Keskenään harmoniset värit tukevat ulkoasua ja miellyttävät silmää. Hyvin räikeät värit puolestaan suorastaan kirkuvat ja vaikeuttavat lukemista. Värivalinnoissa on huomioitava eri värisokeuden ilmenemismuodot ja vältettävä voimakkaita vastavärejä (esim. punainen-vihreä, punainen-sininen) tai liian räikeitä ja pahimmillaan jopa epileptisiä kohtauksia aiheuttavia väriyhdistelmiä (punainen-keltainen). Esimerkiksi tuotemerkeissä ja logoissa tällaiset väriyhdistelmät voivat toimia hyvinkin, mutta tekstimuotoisen informaation esittämisessä niitä kannattaa välttää.

Muut tehosteet

Text-transformin avulla voidaan muuttaa tekstin esitysmuodoksi versaali, eli suuraakkoset tai gemena, eli pienaakkoset tai määrittää jokaisen sanan alkukirjain versaaliksi. Jälkimmäistä käytetään erityisesti englanninkielisissä otsikoissa. Kun rakenne erotetaan ulkoasusta, voidaan versaali teksti muuttaa myöhemmin helposti gemenaksi ja päinvastoin CSS-tyylien avulla. Suuraakkosia käytetään tyypillisesti otsikoissa ja niillä voidaan korostaa esimerkiksi lyhenteitä.

Text-decoration mahdollistaa tekstin alleviivauksen, yliviivauksen tai päälleviivauksen sekä myös vilkkumisen. Alleviivattu teksti tulkitaan tavallisesti linkiksi, joten alleviivauksen käyttöä korostuskeinona kannattaa välttää. Font-weight määrittää kirjasimen paksuuden. Lihavointi on tavallisimpia tehostekeinoja. Font-stylen avulla fontista saadaan kursiivia (italic) tai vinoa (oblique). Font-variant muuttaa tekstin kapiteeliksi, eli versaalitekstiksi, jossa alkukirjainta lukuunottamatta versaaliaakkoset ovat gemena-aakkosten kokoisia. Text-shadow lisää tekstille varjostuksen, jolla voidaan helposti parantaa tekstin erottuvuutta etenkin otsikoissa. Tämä ominaisuus toimii tällä hetkellä vain Mac OS X:n Safarissa.

On myös muistettava, että liiallinen tehosteiden käyttö heikentää niiden vaikutusta. Jos leipätekstissä joka toinen sana on lihavoitu, lihavointi ei enää vastaa tarkoitustaan, eikä lihavoitu sisältö enää erotu muun tekstin joukosta kuten alunperin oli tarkoitus.

4. Yhteenveto

Valitse fontti käyttötarkoituksen mukaan. Comic Sans MS on tarkoitettu etupäässä hauskoihin ja epävirallisiin dokumentteihin, kuten lasten syntymäpäiväkutsuihin. Impact puolestaan on toimiva otsikoissa, muttei leipätekstissä.

Varmista, että fonttisi on tarpeeksi suuri, muttei liian suuri, jotta luettavuus säilyisi hyvänä. Varmista, että olet määritellyt fonteille vaihtoehdot ja geneerisen tyyliperheen siltä varalta, että lukijan järjestelmästä ei kaikkia fontteja löydy. Suosi suhteellisia fonttikokoja. Vältä kiinteitä kokoja, ellet tiedä lukijasi päätelaitteiden ominaisuuksia.

Varmista, että tekstin kontrasti on sopiva, eikä tarpeettomia tehostekeinoja ole käytetty. Suunnittele tehosteet ja korostukset huolella ja käytä niitä vain luettavuuden parantamiseksi ja visuaalisen ilmeen selkiyttämiseksi. Vältä tekstin korvaamista kuvalla, mutta jos muita vaihtoehtoja ei ole, älä unohda alt-tekstiä tai vaihtoehtoisen sisällön tarjoamista.

Kokeile, miltä tekstisi näyttää eri selaimissa ja käyttöjärjestelmissä pehmennyksen kera ja ilman. Kokeile myös suurentaa ja pienentää tekstiä.

Webbitypografian ja tekstimuotoisen informaation ei tarvitse olla tylsää ja tavallista. Näillä yksinkertaisilla tehostekeinolla ja saavutettavuus- ja luettavuusnäkökulman huomioinnilla voidaan saada ihmeitä aikaan. Muista, että tehosteet ovat kuin mausteita. Sopivasti käytettynä ne tuovat sivustosi sisällön hyvin esille, korostavat visuaalista ilmettä, parantavat luettavuutta ja miellyttävät näköhermoja. Liiallisesti ja huolimattomasti käytettynä ne polttavat silmiä, karkottavat potentiaaliset asiakkaat ja antavat paitsi itse sivustosta, myös sen takana olevasta tahosta ei-toivotun kuvan.

Lähteet ja viitteet

1: Cascading Style Sheets – Level 2 CSS2 Specification – Fonts
2: Anatomy of a Character
3: General Punctuation – Test for Unicode support in Web browsers
4: Tavutusvihje-esimerkki
5: Soft hyphen (SHY) – a hard problem?

Jim Byrne on koonnut tiiviin tietopaketin Accessible Web Typography – an introduction for web designers. HTML-versio on ilmainen.

Jaa artikkeli

Kirjoittaja: Timo Laak

---

Tässä kaksiosaisessa artikkelisarjassa perehdytään typografian ihmeelliseen maailmaan. Se, mikä näyttää paperilla hyvältä, ei välttämättä toimikaan internet-sivulla aivan yhtä hyvin. Web-suunnittelu kaikkine kommervenkkeineen on hyvin haastavaa. Erilaisia huomioitavia asioita kun on kasapäin, eikä typografia ole suinkaan sieltä merkityksettömimmästä päästä.

Millaista fonttia tulisi käyttää? Miten määritellään fonttikoko ja millaisia tehostekeinoja on käytettävissä? Typografisessa valtameressä muhii melkoinen keitos, jonka yhtenä ainesosana on myös saavutettavuus. Ei ole lainkaan yhdentekevää millaisia fontteja ja tehostekeinoja käytetään.

Ensimmäisessä osassa keskitytään webbi- ja printtitypografian keskeisiin eroihin, pohditaan saavutettavuusnäkökulmaa sekä esitellään tavallisimmat fonttityypit ja niiden käyttötarkoitukset.

typo|grafia s. 1 kirjapainotaito 2 kirjan tms. painoasu 3 kirjasinlajin, -koon, merkki- ja rivivälistyksen yms. valinta ja sen lopputulos (Uusi suomalainen sivistyssanakirja)

1. Johdanto

Termi typografia on peräisin kreikan kielen sanoista typos (muodostaa) ja graphein (kirjoittaa). Typografia on satoja vuosia vanha tekniikka ja taiteenlaji, jossa kirjasintyylien, pistekokojen, rivikorkeuksien ja -pituuksien sekä välistyksien ja värien avulla luodaan fyysisessä tai digitaalisessa muodossa olevaa kirjallista materiaalia. Typografian tarkoitus on kuvata tekstuaalisessa muodossa olevaa informaatiota helppolukuisella ja visuaalisesti esteettisellä tavalla.^[1]

Johann Gutenbergin kirjapainosta ja luostarimunkkien Raamatuista on kuljettu pitkä matka nykypäivän digitaaliseen typografiaan. Digitaalinen media paitsi antaa typografialle uusia ulottuvuuksia, myös rajoittaa tyylien ja kirjasinten käyttöä. Web-suunnittelijalta vaaditaankin aivan toisenlaista typografian tuntemusta kuin hänen printtikollegaltaan.

2. Digitaalinen typografia

Painotyön resoluutio eli pistekoko tuumaa kohden (dpi – dots per inch) on jopa 2400 dpi kun taas sähköisen näyttölaitteen resoluutio on tyypillisesti vain 96 dpi.^[2]

Painettu fontti on ja pysyy sellaisena kuin se painovaiheessa oli. Painettu fontti näyttää aina samalta, eikä sitä voi muuttaa. Digitaalinen fontti sen sijaan on erilainen eri näyttölaitteilla ja -asetuksilla. Digitaalisen fontin näkyminen lukijalle internet-selaimessa riippuu siitä, onko kyseistä fonttia saatavilla lukijan käyttämässä käyttöjärjestelmässä tai ohjelmistossa.

Digitaaliseen mediaan erikoistuneen typografin on tunnettava erilaiset selainohjelmat, käyttöjärjestelmät ja niiden rajoitteet. Hänen on myös tiedettävä, mitkä fontit ovat turvallisia käyttää ja miltä ne näyttävät eri päätelaitteilla. Kaiken tämän jälkeenkään typografi ei voi tietää, mitä fontteja käyttäjällä järjestelmässään on. Käyttäjä on saattanut poistaa osan turvallisista oletusfonteista. Käyttäjä saattaa myös ohittaa typografin valinnat ja käyttää omaa tyylitiedostoaan tai määrittää oman mielensä mukaisen fonttikoon.

Käyttäjä ei ehkä hyödynnä käyttöjärjestelmän anti-aliasointi-, eli fonttien pehmennysominaisuuksia. Pehmennetty fontti on miellyttävän näköinen ja helppolukuinen. Pehmentämätön fontti puolestaan on karkea ja reunoiltaan rosoinen, kuten esimerkkikuvan perusteella voidaan havaita. Hyvin pienikokoiset fontit muuttuvat pehmennettyinä helposti suttuisiksi ja vaikealukuisiksi, jolloin monet järjestelmät näyttävät tietynkokoiset fontit automaattisesti pehmentämättöminä. Windows XP:ssä ei näyttöfonttien pehmennys ole oletuksena käytössä ja moni käyttäjä saattaakin olla tästä ominaisuudesta autuaan tietämätön.

Onko typografiaan panostaminen internetissä siis turhaa? Ei suinkaan, sillä typografialla voidaan vaikuttaa ratkaisevasti visuaaliseen ilmeeseen. Monet käyttäjät eivät muuta selainohjelmansa asetuksia. He eivät ehkä tiedä, että fonttikokoa voi suurentaa tai että he voivat määrittää mieleisensä oletusfontin kaikille sivuille tai ehkä he eivät vain halua tai näe tarvetta tehdä niin. Typografiaan panostamalla voidaan vähentää tarvetta muuttaa ja muokata olemassaolevia tyylejä ja parantaa sivuston yleisilmettä sekä korostaa markkinoitavaa tuotetta tai brandia.

3. Saavutettavuusnäkökulma

Digitaalisella typografialla on yksi merkittävä etu puolellaan. Heikkonäköinen ei aina näe painettua tekstiä ilman apuvälineitä (silmälasit, suurennuslaitteet). Sokea henkilö ei pysty lukemaan painettua tekstiä lainkaan muutoin kuin muuttamalla sen digitaaliseen muotoon kuvanlukijan ja tekstintunnistusohjelman avulla.

Digitaalinen teksti on jo valmiiksi digitaalisessa muodossa, jolloin näkövammaisen on mahdollista lukea se ruudunlukijan tai pistekirjoitusnäytön avulla. Digitaalinen teksti on myös helpommin muokattavissa, kopioitavissa ja siirrettävissä toiseen ympäristöön tai päätelaitteeseen. Digitaalista tekstiä voidaan suurentaa vapaasti, kirjasin voidaan vaihtaa lukijalle mieleiseksi sekä värejä ja kontrastia muuttaa. Digitaalinen typografia näin ollen poistaa merkittäviä painetun typografian rajoitteita ja lisää informaation saavutettavuutta.

Myös digitaalisessa typografiassa on omat ongelmansa, joista tärkeimpiä ovat resoluutio, saatavilla olevat fontit sekä käyttäjän näyttölaitteen fonttiasetukset. Tekstisisällön esittäminen kuvana poistaa näitä ongelmia, mutta samalla se myös poistaa digitaalisuuden edut. Digitaalinen kuva ei ole tekstiä, vaikka kuvassa tekstiä olisikin. Kuvan suurentaminen ja muokkaaminen ei ole yhtä yksinkertaista kuin tekstin.

Näkövammainen ei välttämättä näe kuvaa, eikä siten voi lukea kuvamuodossa olevaa tekstiä. Suunnittelunäkökulmasta katsottuna kuvamuotoon asetellun tekstin muokkaaminen tai korjaaminen jälkikäteen on työlästä. Kuvatiedoston fyysinen koko on myös moninkertainen tekstitiedostoon verrattuna.

Saavutettavuuden varmistamiseksi kuvien käyttöä tekstin sijaan tulee ehdottomasti välttää. Aina tämä ei välttämättä ole mahdollista. Monet liike- ja tuotemerkit, sekä yritysten logot ovat tietyntyylistä tekstiä, jota on toistaiseksi mahdoton esittää internet-sivulla tekstimuodossa. Hyvä esimerkki tästä on Coca-Cola Companyn tunnettu koristeellinen tekstilogo. Mikäli teksti korvataan kuvalla, on varmistuttava, että kuvan informaatio on myös näkövammaisen tai heikkonäköisen saavutettavissa. Alt-tekstin tai vaihtoehtoisen tekstimuotoisen informaation tarjoaminen on siis erittäin suositeltavaa. Toinen mahdollinen ratkaisu on hyödyntää esimerkiksi sIFR-tekniikkaa, jossa tekstiä voidaan esittää JavaScriptin ja Flashin avulla ja silti säilyttää saavutettavuus.

4. Millainen fontti?

Ei ole lainkaan yhdentekevää millaista kirjasintyyppiä eli fonttia käytetään tekstuaalisen sisällön ilmaisemiseksi. Eri fontit on suunniteltu erilaisia tarkoituksia varten. Fontit voivat olla koristeellisia, juhlallisia, jämäköitä ja virallisia, mutta myös hauskoja ja epävirallisia, taiteellisia, moderneja tai futuristisia. Fontit ja grafiikka muodostavat yhdessä dokumentin visuaalisen ilmeen, oli kyse sitten painetusta tai sähköisestä informaatiovälineestä.

Fonttityypit jaetaan geneerisiin päätyyleihin ominaisuuksiensa mukaan. Päätteellinen (serif) fontti on hyvin yleinen sanomalehdissä ja painetussa tekstissä (Esimerkki Georgiasta). Päätteellisten fonttien pienet koukerot ja väkäset auttavat katsetta soljumaan kirjaimesta seuraavaan ja helpottavat lukemista. Päätteellisiä fontteja käytetään myös paljon internet-sivuilla, vaikka niillä onkin taipumus muuttua sumeaksi ja suttuiseksi liian pienikokoisena näytöllä esitettyinä.

Päätteetön (sans-serif) fontti on suoraviivainen ja tasainen, eikä siinä ole serif-fonttien tapaan käytetty paksunnoksia tai koukeroita (esimerkkikuva Verdanasta). Päätteetön fontti on usein välistykseltään avara ja näytöllä tarkka ja helppolukuinen. Nykyisten näyttöjen alhainen resoluutio tekee suoraviivaisesta ja yksinkertaisesta fontista selkeämmän ja helppolukuisemman.

Muita fonttityyppejä ovat mm. tasalevyinen monospace, jota käytetään erityisesti ohjelmakoodin esittämiseen tekstieditoreissa sekä hyvin koristeellinen ja taiteellinen fantasia ja vino kirjasin eli kursiivi. Internet-sivuilla käytetään tavallisimmin päätteellisiä ja päätteettömiä fontteja.

Muutamat ns. ydinfontit (core fonts) määritellään turvallisiksi perusfonteiksi, joita on turvallista käyttää internet-sivuilla. Nämä fontit löytyvät useimmista järjestelmistä ja on hyvin todennäköistä, että käyttäjällä on ne järjestelmässään, jolloin internet-sivu näkyy käyttäjälle typografin suunnitelmien mukaisena.

Arial, Arial Black, Comic Sans MS, Courier New, Georgia, Impact, Times New Roman, Trebuchet MS ja Verdana ovat Microsoftin ydinfontteja ja ne löytyvät pääsääntöisesti lähes kaikista nykyaikaisista Windows-sekä Macintosh-järjestelmistä.^[3]

Eri ohjelmistojen, kuten Internet Explorerin ja Microsoft Officen mukana toimitetaan lisäksi runsaasti muita fontteja, jotka tavallisesti löytyvät monista järjestelmistä. Koska CSS-tyylimäärittelyillä on mahdollista määrittää vaihtoehtoisia fontteja, on ydinfonttien ulkopuolisiakin fontteja melko turvallista käyttää. On vain muistettava tarjota tarpeeksi vaihtoehtoja, sekä määrittää viimeiseksi vaihtoehdoksi geneerinen fonttiperhe (serif, sans-serif jne.), jolloin järjestelmä näyttää oikean tyyppisen oletusfontin, mikäli typografin määrittelemiä fontteja ei järjestelmästä löydy.

Lopuksi

Saavutettavuusnäkökulman huomioiminen on hyvin keskeinen tekijä internet-sivuja suunniteltaessa. Sivun sisällön välittyminen lukijalle on hyvin olennaista koko sivun olemassaolon perusteena. Jos potentiaalinen lukija ei pääse sisältöön käsiksi, menettää koko sivu tarkoituksensa. Nykyteknologian levitessä yhä useampiin koteihin yhä erilaisemmat ihmiset tulevat käyttämään internetin palveluita. Monet keski-ikäiset eivät esimerkiksi pysty lukemaan ilman silmälaseja samaa tekstiä kuin heidän lapsensa.

Sarjan toisessa osassa keskitytään fonttien näkyvyyteen ja tehostekeinoihin, joilla luettavuutta voi parantaa.

Lähteet ja viitteet

1: http://en.wikipedia.org/wiki/Typography
2: http://www.sitepoint.com/article/anatomy-web-fonts
3: http://www.upsdell.com/BrowserNews/res_fonts.htm#a01

ClearType Tuner on työkalu, jolla Windows XP:n näyttöfonttien pehmennysominaisuuksia voi muokata (toimii Internet Explorerilla).

Jaa artikkeli