Design with business impact



Samankaltaiset tiedostot
Design with business impact

Opintopolun esteettömyyshaasteet

ESTEETTÖMYYSTESTAUSRAPORTTI TAPAHTUMAKALENTERI JA BLOGI / THL.FI

ESTEETTÖMYYSTESTAUSRAPORTTI ETUSIVU JA FINRISKI-LASKURI / THL.FI

Ohjeita informaation saavutettavuuteen

ESTEETTÖMYYSTESTAUSRAPORTTI / THL. Annanpura Oy /

ARVO - verkkomateriaalien arviointiin

KANSALAISKIOSKI Käyttöohje

ESTEETTÖMYYSTESTAUSRAPORTTI / VIRTU.FI/ LOMAKKEET. Annanpura Oy /

Yliopistojen erilliset palautteet. Webropol kyselyn tulokset. RAPORTTI 2 Uudet värit portaaliin Testipäivä: sekä kysely Webropolissa

Suomen virtuaaliammattikorkeakoulu VPN peli > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Arcada yrkeshögskola Hållbar utveckling v 0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

1. Selkokielisen verkkopalvelun graafinen ja looginen rakenne

Selkokielisen sivuston saavutettavuuden arvioinnin heuristiikat

Tik Tietojenkäsittelyopin ohjelmatyö Tietotekniikan osasto Teknillinen korkeakoulu KÄYTTÖOHJE. LiKe Liiketoiminnan kehityksen tukiprojekti

Selkokielisen sivuston saavutettavuuden arvioinnin heuristiikat

Opetusmateriaalin visuaalinen suunnittelu. Kirsi Nousiainen

Saavutettavuuswebinaari

Verkkosivustojen saavutettavuuden tarkistuslista

ARVO - verkkomateriaalien arviointiin

Savonia ammattikorkeakoulu Miten tilintarkastajan tulee toimia? v. 0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Suomi.fi: Asiointi ja lomakkeet osion käyttöliittymämallien käyttäjätestaus. Testaustulosten esittely

Lasten Liike iltapäivät

Opettajan pikaopas Opintojaksopalaute-järjestelmään

Kirjan toteutus BoD easybook -taittotyökalun avulla

Oulun seudun ammattikorkeakoulu Aineistojen polku kirjastoon > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Suomen virtuaaliammattikoulu Kaasutustekniikka v. 0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Suomen virtuaaliammattikorkeakoulu Vetokoe v.0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Tampereen kaupungin www-palvelun käyttäjäkysely

Päänäkymä Opiskelijan ohjeet Kurssin suorittaminen Opettajan ohjeet kurssin teko

Suomen virtuaaliammattikorkeakoulu Boolen operaattorit v. 0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Canva CV NÄIN PÄÄSET ALKUUN CANVA CV:N TEOSSA: Canva on graafisen suunnittelun

Suomen virtuaaliammattikorkeakoulu Teknillinen mekaniikka monivalinta aihio > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Muutama sana saavutettavuudesta Virpi Jylhä, Näkövammaisten liitto ry

Saavutettavuus > Tapio Haanperä Saavutettavuusasiantuntija tel

Digitaalisen median tekniikat. Esteettömyys ja käytettävyys Harri Laine 1

TIETOKONEEN ASETUKSILLA PARANNAT KÄYTETTÄVYYTTÄ

virkailija.opintopolku.fi

Kennelliiton Omakoira-jäsenpalvelu Ohje Kennelpiireille, osoitelistat

Heuristinen arviointi. Laskari 7

Yleistä. Suositukset. Rakenne

Evaluointidokumentti

Internetin hyödyt ja vaarat. Miten nettiä käytetään tehokkaasti hyväksi?

Oulun ja Pohjois Karjalan ammattikorkeakoulu Virtuaalivasikan kasvatuspeli v. 0.5 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Käyttöohje. Versiohistoria: versio Mari Kommenttien perusteella korjattu versio

Ohjeet What matters to me palvelun käyttöönottoon

Suvi Junes Tietohallinto / Opetusteknologiapalvelut 2012

VANHEMPIEN KÄYTTÖLIITTYMÄN OHJEET

KÄYTTÖOHJE / Ver 1.0 / Huhtikuu WordPress KÄYTTÖOHJE Sotkamo 2016

KESKUSTANUORTEN NETTISIVUT- OHJEITA PIIRIYLLÄPITÄJÄLLE 1. KIRJAUTUMINEN

Entiteetit erotetaan muusta tekstistä & ja puolipiste. esim. copyright-merkki näkyy sivulla

Sami Hirvonen. Ulkoasut Media Works sivustolle

ESTEETTÖMYYSKATSAUS / KANSALLISMUSEO.FI Annanpura Oy /

Tervetuloa käyttämään ehopsia

ejuttu ohjeet kuinka sitä käytetään.

Tampereen ammattikorkeakoulu Verkkokeskustelu > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Ryhmäläisten nimet:

Tekstieditorin käyttö ja kuvien käsittely

Tallennus ja tiedostot

Käyttäjätestausraportti/ finna.fi. Annanpura Oy /

MOBISITE-TYÖKALUN SISÄLTÄMÄT TOIMINNOT

Suvi Junes/Pauliina Munter Tietohallinto / Opetusteknologiapalvelut 2014

Lyseopaneeli 2.0. Käyttäjän opas

Suomen virtuaaliammattikorkeakoulu Teknillinen mekanikka fem tutorials > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

HYVÄKSILUKEMISEN TEKEMINEN ILMAN ENNAKKOPÄÄTÖSTÄ

Oppilaan opas. Visuaaliviestinnän Instituutti VVI Oy. Versio 0.2 ( )

Kaislanet-käyttöohjeet

VERKKOKIRJOJEN JA DIGILEHDEN KÄYTTÖOHJE

Jotta voit käyttää Facebookia täytyy sinun ensiksi luoda sinne käyttäjätili. Käyttäjätilin luominen onnistuu noudattamalla seuraavia ohjeita.

Artikkelien muokkaaminen sekä sisältöeditorin peruskäyttö

Osallistavan suunnittelun kyselytyökalu

Kansalaisten asenteet rakennetun ympäristön esteettömyyteen liittyen. Tutkimuksen keskeisimmät tulokset Tiedekeskus Heureka 20.6.

Verkkokirjoittaminen. Verkkolukeminen

Pikaohjeet videovastaanottoa varten

Videovastaanotto. Ohje asiakkaalle

Oulun kaupungin verkkosivuston saavutettavuuden arviointi (WCAG 2.0)

Helsingin ammattikorkeakoulu Stadia Verkkosivujen silmäiltävyys ja selailtavuus v. 0.9 > 80 % % % < 50 %

Suomen virtuaaliammattikorkeakoulu XML_mark_up_language > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

ESTEETTÖMYYSKATSAUS / PORI.FI Annanpura Oy /

Suomen virtuaaliammattikorkeakoulu Vedenpuhdistus > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Käyttöohje. Ticket Inspector. Versio 1.0. Sportum Oy

Mitä direktiivi käytännössä velvoittaa?

OHJE Jos Kelaimeen kirjautuminen ei onnistu Windows-koneilla

ILMOITUSSOVELLUS 4.1. Rahanpesun selvittelykeskus REKISTERÖINTIOHJE. SOVELLUS: 2014 UNODC, versio

Sivuston nopeus. (vanhentumista ei ole määritetty)

Sisällysluettelo 1 Johdanto Root, koko Opalan pääkäyttäjä

ESTEETTÖMYYSKATSAUS / SEINÄJOKI Annanpura Oy /

Suomen virtuaaliammattikorkeakoulu Kestävää kehitystä etsimässä v. 0.9 > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

SAAVUTETTAVUUSRAPORTTI / finna.fi. Annanpura Oy /

ividays BLOG Design Elina / Tomi / Timo / Otso /

Virtuaaliammattikorkeakoulu Taide kasvatus taidekasvatus > 80 % % % < 50 % Suhteellinen osuus maksimiarvosta (%)

Opintojaksopalautejärjestelmä Opettajan OPAS

Sinulla voi olla puhelimessasi, tabletissasi tai kotikoneellasi muitakin Google-tunnuksia, mutta käytä koulutöihisi koulun Google-tunnusta.

KESTI Kestävän aluerakentamisen uudet teknologiat ja menetelmät Itämeren alueella / Esteettömyys ja kestävä kehitys aluerakentamisessa

Ohjeistus opiskelijalle opinnäytetyön tallentamiseksi Theseus-verkkokirjastoon.

SELVITYS PRO GRADUJEN KÄYTÖSTÄ TAIDEKIRJASTOSSA

Kiipulan ammattiopisto. Liiketalous ja tietojenkäsittely. Erja Saarinen

Kotisivu. Hakutoiminnon on oltava hyvin esillä lähes kaikilla kotisivuilla. Hakutoiminto on hyvä sijoittaa heti kotisivun yläosaan.

Oman videon toimittaminen Tangomarkkinat laulukilpailuun 2015

Transkriptio:

Design with business impact

Omahoitopolut esteettömyysarvio TUTKIMUSRAPORTTI Jan Nikander & Anne Kaikkonen, 9. tammikuuta

RAPORTIN RAKENNE 1. Päähavainnot 2. Havainnot aihepiireittäin Kyselyyn navigoiminen Lomakkeet Tulosten arviointi 3. Suositukset Liite A Tutkimuksen toteutus 3

Kuinka lukea havaintoja! Havainnoilla on neljä prioriteettitasoa, jotka kuvaavat ongelmien kriittisyyttä Positiivinen Kriittinen Havainnolla on erittäin suuri vaikutus käyttäjäkokemukseen Merkittävä Heikentää käyttäjäkokemusta selkeästi Vähäinen Saattaa vaikuttaa käyttäjäkokemukseen Suositus tai kehitysidea

Päähavainnot 5

PÄÄHAVAINNOT Yleisellä tasolla palvelu on melko selkeä käyttää ja esteettömyys on pääpiirteittäin huomioitu suunnittelussa. Merkittävimmät esteettömyysongelmat liittyvät sisältöjen luettavuuteen ja ymmärrettävyyteen, ruudunlukijaongelmiin, virheilmoitusten puutteeseen ja yksittäisiin puutteisiin lomakkeiden toteuttamisessa. Kyselyssä on merkittäviä ruudunlukijaan liittyviä puutteita. Lisäksi kyselyä ei pysty tällä hetkellä täyttämään pelkästään näppäimistöä käyttäen. Varsinkin heikkonäköisten on vaikea erottaa kuvien päälle asetettuja sisältöjä palvelussa käytettyjen heikkojen kontrastien johdosta. Käyttäjille ei kerrota täyttövirheistä lomakkeissa ja palvelu sallii virheelliset syötteet. Koska järjestelmä ei tällä hetkellä tarjoa virheilmoituksia, niiden esteettömyyttä ei voitu tässä yhteydessä arvioida. Käyttäjille ei kerrota mitkä kentistä ovat pakollisia. Liu utettavat valitsimet verenpaineelle ja kolesterolille ovat erittäin ongelmallisia esteettömyyden ja yleisen käytettävyyden näkökulmasta, sillä ruudunlukijat eivät lue niitä selkeästi ja niiden käyttö vaatii motorista tarkkuutta. Vaikka palvelussa käytetään alt-textiä kuvallisen sisällön (ja kuvien päällisten tekstien) kuvailuun, tulisi niiden olla vielä konkreettisempia. 6

Havainnot käyttötapauksittain 7

Kyselyyn navigoiminen 8

KYSELYYN NAVIGOIMINEN 9

KYSELYYN NAVIGOIMINEN Sydän- ja verisuonitautien, diabeteksen ja muistisairauksien pääsivun taustasivun ja tekstin välinen kontrasti ei ole riittävä. Kuvan tausta on liian rauhaton tekstin selkeän näkymisen ja erottumisen kannalta. Tekstin luettavuus tai erottuvuus ei parane kontrastia korostamalla. Luettavuutta testattiin OS X:n monokromaattisuus- ja kontrastisäädöin. Etusivulla käytetty kuva ja tekstin asemointi suhteessa taustakuvaan on merkittävästi parempi. Luettavuuden nimissä tekstin sijoittamista kuvien päälle tulisi kuitenkin aina välttää, mikäli vain mahdollista. Etusivun ikoneiden tekstit ovat melko pienellä kirjasinkoolla ja värivalinnan johdosta ne erottuvat melko heikosti taustasta. Lisäksi etusivun ikonit erottuvat heikohkosti taustasta. Tekstit (ja ikonit) eivät välttämättä erotu kovinkaan hyvin taustassa, mikäli ne on sijoitettu kuvan päälle. Pienet nuolet ikonien alla eivät välttämättä indikoi riittävän selvästi, että tekstiä painamalla voi navigoida toisaalle sivustolla. Ikonien näkyvyyttä ja vuorovaikutuksellisuutta voi korostaa käyttämällä jonkinlaista taustakuvasta poikkeavaa taustaa, mikä tekee elementeistä selvemmin taustasta erottuvia. 10

Lomakkeet 11

LOMAKKEET RAKENNE 12

LOMAKKEET RAKENNE Lomakkeen sisällöt tulisi tasata vasemmasta reunasta. Tällä hetkellä tekstikentät eivät ole tasan muiden sisältöjen kanssa, mikä voi vaikuttaa lomakkeen luettavuuteen ja tekee osaltaan yleisvaikutelmasta rauhattoman. Otsakkeiden ja vastausvaihtoehtojen sijoittelu vaikeuttaa kokonaisuuden hahmottamista ja yhteen kuuluvien elementtien tunnistamista. Esimerkiksi Nainen -painike on lähempänä Ikä -otsikkoa kuin mitä Mies -painike on Sukupuoli -otsikkoa. Vastaajan edistymistä kyselyn täyttämisessä tulisi kommunikoida visuaalisesti selkeämmällä tavalla vastaajille. Kaikki erityisryhmät eivät välttämättä ymmärrä tämänhetkistä ratkaisua, missä on käytetty numeraalista informaatiota viittaamaan edistymiseen. 13

LOMAKKEET - TÄYTTÄMINEN 14

LOMAKKEET - TÄYTTÄMINEN Palvelu sallii virheellisten tietojen syöttämisen ja tallentamisen. Tällä hetkellä palvelu esimerkiksi sallii vastaajan iäksi 1313 (tai asd ) ja koulutukseksi 155 (tai heippa ). Palvelu ei kerro käyttäjälle tämän täyttäneen lomakkeeseen virheellisiä tietoja. Käyttäjälle on ehdottomasti kerrottava täyttövirheistä lomakkeessa. Koska palvelussa ei tällä hetkellä esitetä virheilmoituksia, ei niiden esteettömyyttä voitu tässä yhteydessä arvioida. Kenttien pakollisuutta ei ilmaista millään tapaa palvelussa. Tämä on merkittävä käytettävyys- ja esteettömyysongelma, sillä vastaajan on mahdotonta tietää onko kaikkiin kenttiin pakko vastata luotettavien tulosten kannalta. 15

LOMAKKEET - SELKOKIELISYYS 16

LOMAKKEET - SELKOKIELISYYS Osa kysymyksistä on pitkiä (yli 80 merkkiä) ja niiden lauserakenne on melko polveileva. Tämä saattaa vaikeuttaa luettavuutta varsinkin kognitiivisista ongelmista kärsiville (esim. lukihäiriö). Selkokielisyyden nimissä kysymysten loogisen rakenteen on oltava mahdollisimman yksinkertainen, niissä on käytettävä aktiivia ja vältettävä lauseenvastikkeiden käyttöä ja lauserakenteen on oltava suora. Täten esimerkiksi kysymys Sisältyykö päivääsi yleensä vähintään puoli tuntia liikuntaa työssä ja/tai vapaa-ajalla, arkiliikunta mukaan lukien? olisi parempi esittää seuraavassa muodossa: Liikutko vähintään puoli tuntia päivittäin? ja mahdollisesti eritellä erillisessä virkkeessä mitä liikuntamuotoja tämä sisältää. Kyselyssä käytetään jonkin verran lääketieteellistä ammattisanastoa (HDLkolesteroli, systolinen verenpaine yms), mitä tulisi pyrkiä välttämään. Terveilläkin kansalaisilla (kognitiivisista häiriöistä kärsivistä henkilöistä puhumattakaan) voi olla merkittäviä ongelmia ymmärtää mitä nämä käsitteet tarkoittavat. 17

LOMAKKEET - KIRJASINKOKO 18

LOMAKKEET - KIRJAISINKOKO Kirjasinkoon muuttaminen ei vaikuta sivuston leipätekstiin, vaan ainoastaan otsakkeisiin. Tämä on merkittävä esteettömyysongelma, sillä heikkonäköiset käyttäjät (joilla usein ei ole näkövammaisuuden diagnoosia) muuttavat usein fonttikokoa selaimestaan. Nämä käyttäjät eivät pysty siis suurentamaan tekstikokoa helpottaakseen palvelun käyttöä. Tekstin kirjasinkoon suurentaminen selaimesta saa lomakkeen otsaketekstin menemään itsensä kanssa päällekäin. 19

LOMAKKEET LIU UTTIMET 20

LOMAKKEET LIU UTTIMET Liu utettavien valitsimien käyttö verenpaineen ja kolesterolien määrittelyyn ovat ongelmallinen ratkaisu. Ruudunlukija ei osaa lukea sisältöä mielekkäässä muodossa, sillä koodi ei sisällä metatietoa siitä mitä tietoja ruudunlukija päätyy lukemaan. Nyt käyttäjä saa vain kuulla skaalan ääripäiden numeraalisen sisällön. Liu uttimien käyttö vaatii merkittävää motorista tarkkuutta käyttäjältään. Vanhusten ja motorisista häiriöistä kärsivien voi olla merkittävän vaikea löytää oikea arvo valitsimen avulla. Lisäksi lomakkeen käyttäminen tabletilla voi vaikeutua merkittävästi tämän ratkaisun johdosta. Vaihtoehtoisen tekstikentän käyttäminen on hyvä ratkaisu, mutta kentät eivät toimi kunnolla. Ensimmäinen kenttä salli verenpaineeksi joko 80 tai 240. Muihin kenttiin päätyneiden syöttövirheiden korjaaminen on myös työlästä, sillä teksti tulee maalata ja vasta tämän jälkeen poistaa/syöttää uusi arvo. Valitsimesta luopuminen ja pelkissä tekstikentissä pitäytyminen on suotavaa selkeyden, käytettävyyden ja esteettömyyden näkökulmista. 21

LOMAKKEET RUUDUNLUKIJA 22

LOMAKKEET RUUDUNLUKIJA Lomakkeissa käytetyistä tekstikentistä puuttuu esteettömyyden kannalta olennaisia tietoja. Lomakkeiden kenttien koodiin on merkittävä ovatko ne editoitavia, missä muodossa tieto on syötettävä ja onko kyseessä pakollinen kenttä. Nämä ovat kriittisiä tietoja varsinkin ruudunlukijaa käyttäville käyttäjille, jotka täyttävät tietoja lomakkeeseen sen perusteella mitä koodissa ilmaistaan. Ruudunlukijat eivät pysty välttämättä lukemaan lomakkeen ohjeita, mikä vaikeuttaa lomakkeen täyttämistä erilaisista näkövaikeuksista kärsivien osalta. Ruudunlukija ei välttämättä pysty lukemaan painoindeksi-kenttään automaattisesti päivittyvää tietoa. Kotikunta-kentässä käytetty väliviivaratkaisu tekee kentän ymmärtämisestä ruudunlukijalla vaikeaa, sillä ruudunlukija toistaa/lukee kaikki merkit. Väliviivat on poistettava tästä ja korvattava pelkästään tekstillä Valitse. 23

LOMAKKEET SELAINYHTEENSOPIVUUS Toisin kuin Chrome-selaimella, lomakkeen sivujen välillä ei pysty liikkumaan Firefox- tai Safari-selaimella pelkästään näppäimistöä käyttämällä, sillä Jatka -painiketta ei pysty aktivoimaan tabulaattorilla. Tämä on merkittävä ongelma motorisista häiriöistä kärsiville, sillä he usein turvautuvat näppäimistöön selatessaan sisältöjä internetissä. Chrome-selaimella lomakkeen täyttö pelkästään näppäimistöä käyttämällä ei onnistu. Radiopainikkeiden välillä liikkuminen on mahdollista, mutta tietyn kohdan valitseminen vastaukseksi ei onnistu. Safari-selaimella painikkeita ei voi selata ollenkaan ja tabulaattorilla pystyy siirtymään ainoastaan tekstikenttien välillä. Vaaleansinisen näppäimistön fokuksena olevan elementin ympärillä olevan reunuksen kontrasti ei ole riittävän suuri taustaan nähden. 24

Tulokset 25

TULOKSET 26

TULOKSET Tulos-sivun sisältämät tekstit ovat melko pitkiä ja leipäteksti on erittäin pienellä otsikoihin verrattuna. Otsikot ja leipäteksti kilpailevat käyttäjän huomiosta ja varsinkin lukihäiriöisten voi olla vaikea keskittyä leipätekstin lukemiseen, kun visuaalisesti voimakkaammat elementit vetävät heidän katseen puoleensa. Lisäksi lopetussivulla esiintyy jonkin verran selkokielisyysongelmia, missä käyttäjälle tarjotaan vihjeitä terveyden edistämiseen. Tekstit olivat melko pitkiä, niissä käytetään passiivia ja lauserakenteet ovat melko haastavia. Tekstit voivat olla myös ongelmallisia lukea näytönsuurentajalla, sillä sisältö ei välttämättä mahdu näkymään kerralla. Tulos-sivulla olevassa Tee testi uudestaan -painikkeessa käytetty kontrasti on riittämätön. Tämä on erityisen ongelmallista värinäön ongelmista kärsiville ja vanhuksille. 27

Suositukset 28

SUOSITUKSET 1/2 Kuvien ja tekstien välisestä asianmukaisesta kontrastista on pidettävä huoli, sillä tällä hetkellä sivustolla käytetyt kuvat tekevät keskeisemmästä tekstisisällöstä vaikeasti luettavaa. Vaihtoehtoisesti kuvista on luovuttava. Kyselyn kolmannella sivulla käytetyt liu uttimet ovat esteettömyyden ja käytettävyyden kannalta huono ratkaisu ja niistä on luovuttava. Visuaalisuus ei tuo ratkaisun heikkouksiin verrattuna riittävää lisäarvoa käyttöön. Ruudunlukijat on huomioitava vielä paremmin suunnittelutyössä, sillä tällä hetkellä lomakkeen kentät sisältävät merkittäviä puutteita. Ruudunlukijasyötteen testaaminen ja oikolukeminen voidaan tehdä esimerkiksi Firefoxin Fangs-liitännäisellä. Kuvien alt-textejä tulisi hioa vielä konkreettisemmin sisältöä kuvaaviksi. 29

SUOSITUKSET 2/2 Omahoitopolkujen saavutettavuudesta eri selaimilla on huolehdittava. Tällä hetkellä kyselyn täyttäminen ei onnistu eri syistä yhdelläkään testatuista selaimista (Chrome, Firefox ja Safari) pelkästään näppäimistöä käyttämällä. Chromella ei pystynyt tekemään valintoja radiopainikkeisiin, Safari hyppäsi näiden yli kokonaan ja Firefoxilla ei pystynyt siirtymään kyselyn sivujen välillä. 30