Käytännön neuvoja saavutettavien tiedostojen tekemiseen

13.11.2018 Käytännön neuvoja saavutettavien tiedostojen tekemiseen Verkkopalvelujen saavutettavuus AVIn saavutettavuuskiertue, Vaasa 13.11.2018 Kirsi Ylänne, Celia 1

Celia Saavutettavan kirjallisuuden ja julkaisemisen asiantuntijakeskus Toimii opetus- ja kulttuuriministeriön ohjauksessa Tuottaa ja välittää kirjallisuutta saavutettavassa muodossa Äänikirjoja, pistekirjoja, e-kirjoja Aineistoja saavat käyttää henkilöt, joilla on lukemiseste eli jotka eivät voi lukea kirjoja tavanomaiseen tapaan (TOL 17 ) Celianet verkkokirjasto ja äänikirjapalvelu lukemisesteisille henkilöille Kirsi Ylänne @kirsiylanne 2

Saavutettavat tiedostot? Lakiluonnoksessa (HE 60/2018) määritellään: verkkosivustolla [tarkoitetaan] verkkotunnuksella yksilöitäviä digitaalisia tekstisisältöjä, tiedostoja, kuvia, lomakkeita ja muita toisinnettavissa olevia tietosisältöjä, jotka ovat käytettävissä tietoverkossa erilaisilla päätelaitteilla ja niissä olevilla ohjelmistoilla; Direktiivissä puhutaan toimisto-ohjelmien tiedostomuodoista eli Adobe Portable Document Format (PDF-tiedostot), Microsoft Office -asiakirjat eli Word-, Excel- tai PowerPointtiedostot tai niiden (avoimen lähdekoodin) vastineet (OpenOffice, LibreOffice) 3

Laki edellyttää 17 : - - sovelletaan digitaalisissa palveluissa oleviin toimistoohjelmien tiedostomuotoihin, jotka on julkaistu 23 päivän syyskuuta 2018 jälkeen. Perusteluissa tarkennetaan: Vaikka tiedostomuotoja koskee saavutettavuusvaatimukset jo 23 päivän syyskuuta 2018 jälkeen julkaisuihin tiedostoihin, ei lain säännökset tule sovellettavaksi näihin tiedostoihin kuin vasta siinä vaiheessa, kun digitaaliseen palveluun aletaan soveltaa lain säännöksiä. Tällaiset tiedostot olisi kuitenkin tarvittaessa annettava saavutettavassa muodossa, jos niitä pyydetään lain 10 :n 2 momentin nojalla saavutettavuuspalautetta käyttäen tai tiedostoja tarvitaan henkilön etujen, oikeuksien ja velvollisuuksien toteuttamiseen. 4

Siis Kaikki 23.9.2018 jälkeen julkaistut pdf-, PowerPoint- ja Wordtiedostot pitää tehdä saavutettaviksi viimeistään 23.9.2020 eli samaan aikaan kuin koko verkkopalvelun, jos verkkopalvelu on julkaistu ennen 23.9.2018. Mutta jos tiedostoa tarvitaan henkilön etujen tai oikeuksien toteuttamiseen, tiedosto olisi annettava saavutettavassa muodossa tarvittaessa. Pdf-lomakkeet ym. tulostettavat lomakkeet Ohjeet etujen tai oikeuksien toteuttamiseen EN 301 549 v2.1.2 luku 10 Non-web documents 5

Samat periaatteet kuin verkkosivuissa Selkeä ja ymmärrettävä rakenne Ymmärrettävä kieli Kuville on annettava vaihtoehtoiset tekstit Värikontrasteja ja tekstin ulkonäköä koskevat vaatimukset otettava huomioon (WGAG 2.1:ssa uusia vaatimuksia) Linkit on nimettävä ymmärrettävästi Taulukot tiedon esittämiseen, ei tekstin asetteluun Saavutettavuusvaatimusten noudattaminen parantaa tiedostojen laatua kaikille lukijoille! Myös asiantuntijalukijat hyötyvät saavutettavista tiedostoista. 6

Digitaalinen vs. painettu Huomaa, että digitaalinen lukeminen on erilaista kuin painetun tekstin lukeminen. Lukija ei välttämättä näe pieneltä näytöltä lainkaan koko sivua eikä ainakaan kahden sivun aukeamaa. Älä siis tee taittoa vain printtiä varten. Mieti siis, onko kyseessä lainkaan tulostettavaksi tarkoitettu tiedosto. Miten helpotat lukemista ja silmäilemistä näytöltä? Onko tarpeen nähdä linkin url? Tutustu editointityökalusi ominaisuuksiin. Onko siinä jokin työkalu tarkistaa saavutettavuus/esteettömyys/helppokäyttöisyys/käytettävyys? 7

Miten luoda saavutettava Word-dokumentti 1/7 Käytä tyylejä! Muokkaa ulkoasua vain tyylien avulla Aloitus-valikko > Tyylit Hiiren kakkospainike > Muokkaa Tee dokumentille selkeä rakenne ja kirjoita selkeää kieltä. Merkitse otsikot otsikkotyyleillä Pääotsikko Otsikko 1 Alaotsikot Otsikko 2, alaotsikon alaotsikko Otsikko 3, jne. Ruudunlukuohjelma löytää otsikkotyylit ja niiden avulla saat helposti luotua myös sisällysluettelon 8

Miten luoda saavutettava Word-dokumentti 2/7 Korosta lihavoimalla. Kursiivia on hankalampi lukea. Suositus fonttikooksi on vähintään 12 pt. Käytä helposti luettavaa fonttia. Vältä kikkailua. Ykköset, iit ja ällät erottuvat toisistaan, nollat ja oot erottuvat jne. Arial (20): 100 lootaa, 10 Oskaria, 1 Ilkka Verdana (20): 100 lootaa, 10 Oskaria, 1 Ilkka Trebuchet MS (20): 100 lootaa, 10 Oskaria, 1 Ilkka Times New Roman: 100 lootaa, 10 Oskaria, 1 Ilkka 9

Miten luoda saavutettava Word-dokumentti 3/7 Tasaa teksti vasempaan laitaan ja jätä oikea reuna liehuksi. Käytä riittävän väljää riviväliä (1,5) ja kirjainten välistystä (merkkiväliä). ÄLÄ KIRJOITA SUURAAKKOSILLA tai KAPITEELEILLA ILMAN HYVÄÄ SYYTÄ. Suuraakkosia on hankalampi lukea. Kielenhuoltajien ohjeita toki on syytä noudattaa: EU, VRK, WWF, jne. Nämä ohjeet auttavat etenkin henkilöitä, joilla on lukivaikeus. 10

Miten luoda saavutettava Word-dokumentti 4/7 Käytä luetteloissa sopivaa tyyliä. Jos luettelossa on asiat tietyssä järjestyksessä, käytä numeroitua listaa. Vältä roomalaisia numeroita. Ruudunlukuohjelmat lukevat ne kirjaimina. IV luku luetaan iivee luku tai X luku luetaan äks luku Käytä myös luetteloissa riittävää väljyyttä eri luettelon kohtien välillä. 11

Miten luoda saavutettava Word-dokumentti 5/7 Nimeä linkit kuvaavasti etenkin leipätekstin keskellä. Lisää tietoja löydät AVIn Verkkopalvelujen saavutettavuus sivulta. Käytä URL:ia mieluummin vaikka lähdeluettelossa tai viitteissä: Verkkopalvelujen saavutettavuus [verkkoaineisto]. AVI [Viitattu 2018-11-13]. Saatavissa: https://www.avi.fi/web/avi/saavutettavuus Lisää > Linkitä 12

Miten luoda saavutettava Word-dokumentti 6/7 Tee taulukot Wordin työkalulla Tee taulukoille otsikkorivi Varmista, että taulukkojen solujen sisältö on luettavissa järkevässä järjestyksessä liikkumalla sarkainnäppäimellä solusta toiseen. Jos käytät palstoja, tee se Asettelu > Palstat toiminnon avulla, älä taulukoilla. Ruudunlukuohjelmat kertovat missä taulukon rivillä ja sarakkeessa kohdistin on. 13

Miten luoda saavutettava Word-dokumentti 7/7 Kirjoita kuville vaihtoehtoiset tekstit. Siirrä kursori kuvan päälle ja paina hiiren kakkospainiketta. Office 365: Valitse kohta: Muokkaa vaihtoehtokuvausta Word 2016: Valitse avautuvasta ikkunasta kolmas kohta Asettelu ja ominaisuudet. Valitse kohta Vaihtoehtoinen teksti. Kirjoita kohtaan Kuvaus selostus kuvan sisällöstä. Älä kirjoita mitään kohtaan Otsikko. Ruudunlukuohjelmat eivät lue otsikkoa, vaan ne lukevat kuvauksen sisällön siinä kohtaa, jossa kuva dokumentissa on. 14

Viimeistele Worddokumentti 1/2 Nimeä tiedosto kuvaavasti. Anna dokumentille otsikko Tiedosto > Tiedot > Ominaisuudet: Otsikko 15

Viimeistele Worddokumentti 2/2 Määritä dokumentin kieli. Tarkista > Kieli > Määritä tekstintarkistuskieli. Voit myös määrittää dokumentissa olevan vieraskielisen tekstin kielen maalaamalla ensin tekstin. Tarkista lopuksi saavutettavuus: Tiedosto > Tiedot > Tarkista asiakirja Tarkista helppokäyttöisyys Korjaa mahdolliset virheet. 16

Dokumenttipohjat kuntoon Varmista, että oman organisaatiosi Word-dokumenttipohjat ovat kunnossa. Huolehdi siitä, että organisaatiosi ohjeistus saavutettavien Worddokumenttien tekemiseen on kunnossa. Apuna voit käyttää Saavutettavasti.fi-sivuston Word-ohjeita. Sivustolta voi ladata ohjeet Word-dokumenttina. Jos organisaatio tuottaa pääosin pdf-dokumentteja, selvitä mitä ohjelmia pdf-tiedostojen tuottamiseen käytetään ja missä vaiheessa saavutettavuusominaisuudet kannattaa lisätä. 17

Saavutettava pdf-tiedosto On koodattu PDF eli rakenteet (otsikot, kappaleet, listat, taulukot ym.) on merkattu tunnisteilla. Sisällön lukujärjestys on määritelty. Kuvilla on tekstivastineet eli kuvien olennainen sisältö on selostettu ns. alt-tekstinä. Pääkieli on määritetty. Ominaisuuksissa on määritelty dokumentin otsikko. Tiedostossa on käytetty helposti luettavaa fonttia. Tekstin ja taustan välillä on riittävä sävykontrasti. Lomakekentät on merkattu tunnisteiden avulla, kentissä on vihjeteksti ja kentistä toiseen pystyy siirtymään ilman hiirtä. Pitkässä dokumentissa on kirjanmerkit. 18

Pdf Word-tiedosta Jos tuotat pdf:n Word-dokumentista, tee ensin Word-dokumentista saavutettava. Tarkista Word-dokumentti. Muunna Word pdf-muotoon (Tiedosto >) Vie-toiminnolla Luo PDF- tai XPStiedosto Ennen kuin painat Julkaise, valitse Asetukset Valitse Asiakirjan rakenteen tunnisteet helppokäyttötoimintoa varten ÄLÄ käytä toimintoa Tulosta pdf! 19

Adobe Acrobat Pro DC 1/3 Jos tuotat pdf:n Adobe Acrobat Prolla, seuraa Acrobatin ohjeita Esteettömien PDF-tiedostojen luominen ja esteettömyyden tarkistaminen Voit muokata aiemmin tehtyä pdf-tiedostoa. Työkalut > Mukauta: Ohjattu makrotoiminta Valitse oikean laidan luettelosta Salli käyttö 20

Adobe Acrobat Pro DC 2/3 Paina Aloita. Seuraa ohjeita. Vaiheita on kolme: 1. Valmistele 2. Aseta kieli ja koodimerkinnät 3. Suorita käytettävyyden tarkistus Lisäohjeita on Acrobat Pron sivuilla kohdassa Käytettävyysseikat. 21

Adobe Acrobat Pro DC 3/3 Voit tehdä Käytettävyys-tarkistuksen myös suoraan. Valitse: Työkalut > Suojaa ja standardoi: Käytettävyys Tee Täysi tarkastus Vasempaan laitaan tulee raportti. Korjaa virheet menemällä virheen kohdalle ja painamalla hiiren kakkosnäppäintä. Näin aukeaa muokkausikkuna. Huomaa, että suojattua pdf-tiedostoa ei pysty korjaamaan. 22

Pdf-lomakkeet Paras tuottaa Adobe Acrobat Pro ohjelmalla. Vaihtoehtoja: Html-lomake Mahdollisuus saada saavutettava Word-dokumentti täytettäväksi Jos et varma pdf-lomakkeesi saavutettavuudesta, kerro käyttäjille selvästi saavutettavasta vaihtoehdosta. 23

PowerPoint-esitykset Hyvin samat periaatteet kuin Word-dokumenteissa Selkeä otsikointi, selkeä rakenne Riittävä kontrasti tekstin ja taustan välillä Kuville vaihtoehtoiset tekstit Tarkista, tarkista, tarkista: Avaa PowerPointin Tiedosto-valikon Tiedot-kohdasta Tarkista ongelmien varalta -valikko ja käynnistä toiminto Tarkista helppokäyttöisyys. Seuraa ohjeita virheiden korjaamisessa. Mieti, kannattaako suullisen esityksen tukena ollut esitys laittaa verkkoon jakoon. Onko se ymmärrettävä yksinään? Jos tallennat esityksen pdf-muodossa, muista antaa ominaisuuksissa tiedostolle otsikko. Ohjeita Saavutettavasti.fi-sivustolla 24

Kuvat ja niiden saavutettavuus Miten laatia kuville vaihtoehtoinen teksti? Mitä vaatimuksia on väreille ja värikontrasteille? 25

Vaihtoehtoiset tekstit: Mitä pitää ottaa huomioon? Kuvan vaihtoehtoisen tekstin pitäisi välittää tekstinä kuvasta se tieto, mikä jää saamatta jos kuvaa ei näe. Kuvan konteksti eli ympäröivä teksti on aivan oleellinen. Onko tekstissä viitattu suoraan kuvaan? Esim. Kuvassa 12 on - - Jos tekstissä viitataan suoraan kuvaan, vaihtoehtoisena tekstinä on kerrottava kuvan oleellinen sisältö. Jos sisältö tulee esille itse tekstissä, voi vaihtoehtoisessa tekstissä kertoa tämän. Jos kuvalla on kuvateksti, älä toista sitä. Pohdi myös, mikä on kuvan tarkoitus siinä kohdassa, jossa se on? Sijoita kuva mahdollisimman sopivaan kohtaan tekstin joukkoon. 26

Tee näin Kirjoita vaihtoehtoinen teksti lyhyesti ja napakasti Ei ole olemassa mitään enimmäismerkkimäärää, tuhatta sanaa ei kuitenkaan kannata käyttää. Käytä lukijalle sopivaa kieltä ja sanastoa Tutut termit ja sanat eli sama tyyli kuin itse dokumentin tekstissä. Älä aloita sanalla Kuva tai Kuvassa, sillä ruudunlukuohjelma kyllä kertoo, että kyseessä on kuva tai grafiikka. Päätä vaihtoehtoinen teksti pisteeseen. Näin ruudunlukuohjelma pitää tauon vaihtoehtoisen tekstin lopussa. Jos kyseessä on puhtaasti kuvituskuva, tee hyvin lyhyt vaihtoehtoinen teksti. 27

Kaavioiden ja kuvaajien vaihtoehtoiset tekstit Raporteissa ja asiakirjoissa saattaa olla runsaasti erilaisia kuvaajia ja kaavioita. Myös niille on annettava vaihtoehtoinen teksti. Kuvaajien selostaminen sanallisesti voi olla hyvin työlästä. 28

Kaavioiden alt-tekstit 1/2 Alt-teksti: Oppilaiden osallistuminen koulun toiminnan suunnitteluun, järjestämiseen ja arviointiin. Huomaa toisto kuvatekstin kanssa. Onko kuvan numeroita annettu missään? Lähde: https://thl.fi/fi/tilastot-ja-data/tilastotaiheittain/terveyden-ja-hyvinvoinnin-edistaminen/hyvinvoinninja-terveyden-edistaminen-peruskouluissa-tea-2015 29

Kaavioiden alt-tekstit 2/2 Voiko kaavion tai kuvaajan tiedot antaa numeromuodossa esim. taulukkona? Huom. Ei kuvaa taulukosta, vaan html-taulukko! Jos kaavion tai kuvaajan tietoja ei voi antaa numeromuodossa, onko kuvaajien pääpiirteet selostettu tekstissä? Jos on, voit viitata tekstiin. Jos ei ole, kerro kuvaajasta oleellisin tieto. Esimerkiksi huippu- ja laskukohdat, kehityssuunnat (määrä kasvussa / laskussa) Alt-tekstissä ei valitettavasti voi olla linkkiä, joten jos linkität taulukkoon, anna linkki kuvan vieressä. 30

Esim. kuva ja taulukko Kuvassa alt= eli ruudunlukuohjelma hyppää kuvan yli. Kuvan alla on html-taulukko, joka sisältää saman tiedon kuin kuvassa on esitetty. Lähde: GOV.UK: https://accessibility.blog.gov.uk/2016/11/01/resultsof-the-2016-gov-uk-assistive-technology-survey/ 31

Värien käytöstä Väri ei saa olla ainoa keino välittää tietoa. Siis esimerkiksi EI näin: Punaisella on merkitty vältettävät asiat ja vihreällä sallitut. Kovat rasvat Kuidut Alkoholi Kananmunat Kasvikset Värin lisäksi pitää olla jokin muukin keino välittää tieto, esimerkiksi muoto, symboli tai selkeä teksti. Käytettyjen värien välinen kontrastiero on oltava riittävä. Muista ottaa huomioon värisokeat. 32

WCAG 2.1 esimerkki 1 Viivojen värin ja valkoisen taustan suhteen oltava väh. 3:1. Lähde: W3C: WCAG 2.1: Understanding, non-text-contrast WCAG 2.0:n kriteeri 1.4.1 Värien käyttö: väriä ei käytetä ainoana visuaalisena keinona välittää informaatiota. Huomaa muodot viivoissa. 33

WCAG 2.1 esimerkki 2 Tekstit värien vieressä Lohkot erottuvat toisistaan Keltaisen lohkon ympärillä kehys (keltainen yksin liian vaalean sävyinen) Lähde: W3C: WCAG 2.1: Understanding, non-text-contrast 34

Videot Verkkopalvelujen saavutettavuus AVIn saavutettavuuskiertue, Vaasa 13.11.2018 Kirsi Ylänne, Celia 35

Vaatimukset videoista Verkkopalveluun tallennettujen videoiden on oltava saavutettavia 23.9.2020 alkaen. Suoria videolähetyksiä vaatimukset eivät koske. Tallennetut videot on tehtävä saavutettaviksi 14 vuorokauden kuluessa julkaisemisesta. 36

Tekstitys videoihin Videoissa pitää olla tekstitys, paitsi kun video on tekstin mediavastine ja sellaiseksi merkitty. (WCAG 2.0:n vaatimus 1.2.2) Siis: videota ei tarvitse tekstittää, jos verkkopalvelussa on annettu videon sisältämä tieto tekstinä ja video on tarjolla tekstin tueksi. Tästä kannattaa kysyä valvontaviranomaisen tulkinta koskien esim. kaupunginvaltuuston kokousten videotallenteita Pitääkö kokousten tai seminaarien videotallenteet tekstittää vai riittääkö tarjota kokousten asiakirjat saavutettavassa muodossa tai tarjota seminaarien esityksistä kirjalliset esitysdiat? 37

Tekstitys palvelee monia Oleellista henkilöille, joilla on kuulovamma Hyödyllistä, kun Videon äänen laatu on heikko Videota katselee paikassa, jossa ei voi lisätä äänen voimakkuutta Kuulokkeet ovat rikki Huom! Kyseessä siis kielensisäinen tekstitys Suomenkielisessä videossa suomenkieliset tekstit Tarvittaessa myös muiden kuin ihmisäänien kuvailu Esimerkiksi: [kova pamaus], [oveen koputetaan] caption (äänet) vs subtitle (vain dialogi) YouTubessa on oma työkalu tekstittämiseen. Vieraskielisten videoiden suomenkielisiä tekstityksiä voivat lukea myös näkövammaiset. 38

Muita vaatimuksia Videolle pitää olla erillinen ääniselite silloin, kun (WCAG 2.0:n vaatimus 1.2.5) videon ääni itsessään ei riitä videon sisällön ymmärtämiseen Ei tarvita, jos videossa on kuvailutulkkaus eli äänen avulla välitetään videosta silmin havaittavat asiat Esimerkiksi kun videossa näytetään kylttiä, jossa on tekstiä, luetaan teksti ääneen Kuvailutulkkaus sijoitetaan videossa kohtiin, joissa ei dialogia tai muita tärkeitä ääniä Vinkki: Ohjevideoiden selkeyteen saa apua Selkokeskuksen selkovideoiden teko-ohjeista 39

Kirsi Ylänne, saavutettavuusasiantuntija kirsi.ylanne@celia.fi @kirsiylanne Kiitos!