{"id":158,"date":"2022-11-01T14:05:46","date_gmt":"2022-11-01T12:05:46","guid":{"rendered":"https:\/\/papunet.net\/saavutettavuus\/?page_id=158"},"modified":"2023-01-31T09:19:43","modified_gmt":"2023-01-31T07:19:43","slug":"saavutettavuuden-testaaminen-itse","status":"publish","type":"page","link":"https:\/\/papunet.net\/saavutettavuus\/ohjeita-ja-oppaita\/saavutettavuuden-arviointi\/saavutettavuuden-testaaminen-itse\/","title":{"rendered":"Saavutettavuuden testaaminen itse"},"content":{"rendered":"\n<p>Verkkosivuston saavutettavuutta kannattaa testata my\u00f6s itse. Kun sivuston kehitt\u00e4j\u00e4t testaavat sivustoa ja asettuvat itse erilaisten k\u00e4ytt\u00e4jien asemaan, he saavat hyv\u00e4n kuvan sivujen teknisest\u00e4 toimivuudesta ja osittain my\u00f6s k\u00e4ytett\u00e4vyydest\u00e4.<\/p>\n<p>N\u00e4in on mahdollista havaita ja korjata sivuston ongelmia \u2013 my\u00f6s saavutettavuusongelmia.<\/p>\n<p>Kaikkien verkkosivuston kehitt\u00e4misess\u00e4 mukana olevien kannattaa testata verkkosivuston saavutettavuutta \u2013 suunnittelijoiden, koodaajien ja sis\u00e4ll\u00f6ntuottajien. Erilaisia k\u00e4ytt\u00e4ji\u00e4 ja k\u00e4ytt\u00f6tilanteita voidaan j\u00e4ljitell\u00e4 k\u00e4ytt\u00e4m\u00e4ll\u00e4 sivustoa erilaisilla p\u00e4\u00e4telaitteilla, apuv\u00e4lineill\u00e4 ja selaimilla.<\/p>\n<p>On huomioitava, ett\u00e4 sivuston testaaminen itse ei korvaa oikeilla k\u00e4ytt\u00e4jill\u00e4 toteutettua saavutettavuus- ja k\u00e4ytett\u00e4vyystestausta.<\/p>\n<h2>Testaa saavutettavuus apuv\u00e4lineill\u00e4<\/h2>\n<p>Sivustoa voi kokeilla k\u00e4ytt\u00e4\u00e4 erilaisilla apuv\u00e4lineill\u00e4. Ruudunlukuohjelmalla on mahdollista kokeilla, miten n\u00e4k\u00f6vammainen k\u00e4ytt\u00e4j\u00e4 kokee sivuston ja milt\u00e4 sivusto kuulostaa luettuna.<\/p>\n<p>Kun verkkosivut kuunnellaan ruudunlukuohjelmalla, huomataan, onko sivujen tekstisis\u00e4lt\u00f6 vaikeaselkoista.<\/p>\n<p>Ruudunlukuohjelmia ohjataan yleens\u00e4 n\u00e4pp\u00e4imist\u00f6ll\u00e4. Niill\u00e4 voidaan siis ainakin osittain testata sivuston saavutettavuutta my\u00f6s niille k\u00e4ytt\u00e4jille, jotka k\u00e4ytt\u00e4v\u00e4t tietokonetta vain n\u00e4pp\u00e4imist\u00f6n avulla.<\/p>\n<h2>Testaa saavutettavuus eri p\u00e4\u00e4telaitteilla<\/h2>\n<p>Verkkosivustoa kannattaa kokeilla k\u00e4ytt\u00e4\u00e4 mahdollisimman monella erilaisella p\u00e4\u00e4telaitteella ja varmistaa, ett\u00e4 sivusto on niill\u00e4 mahdollisimman saavutettava.<\/p>\n<p>Verkkosivuston saavutettavuus voi riippua siit\u00e4, mill\u00e4 laitteella sit\u00e4 k\u00e4ytet\u00e4\u00e4n. Sivusto saattaa n\u00e4ytt\u00e4\u00e4 erilaiselta ja toimia eri tavoin riippuen siit\u00e4, onko k\u00e4yt\u00f6ss\u00e4 tietokone, tabletti vai \u00e4lypuhelin.<\/p>\n<p>Lis\u00e4ksi sivuston k\u00e4ytett\u00e4vyyteen voivat vaikuttaa laitteiden erilaiset k\u00e4ytt\u00f6j\u00e4rjestelm\u00e4t (esim. Windows, macOS, Linux) ja niiden versiot. My\u00f6s laitteiden n\u00e4yt\u00f6n koko ja tarkkuus vaihtelee.<\/p>\n<p>Suosittelemme testaamaan verkkosivustoa seuraavilla p\u00e4\u00e4telaitteilla ja k\u00e4ytt\u00f6j\u00e4rjestelmill\u00e4:<\/p>\n<ul>\n<li>PC-tietokoneet: Microsoft Windows 7 ja sit\u00e4 uudemmat versiot<\/li>\n<li>Mac-tietokoneet: macOS<\/li>\n<li>Android-\u00e4lypuhelimet<\/li>\n<li>iPhone-\u00e4lypuhelimet<\/li>\n<\/ul>\n<h2>Testaa saavutettavuus eri selaimilla ja selainversioilla<\/h2>\n<p>Verkkosivuston testaaminen mahdollisimman monilla eri selaimilla ja niiden versioilla saattaa paljastaa erilaisia saavutettavuuteen liittyvi\u00e4 ongelmia.<\/p>\n<p>Kaikki sivustolla k\u00e4ytetyt ratkaisut eiv\u00e4t v\u00e4ltt\u00e4m\u00e4tt\u00e4 toimi kaikilla eri selaimilla tai vanhemmilla selainversioilla.<\/p>\n<p>Sivuston visuaalinen ilme saattaa olla erilainen selaimesta riippuen. Kun sivustoa k\u00e4ytet\u00e4\u00e4n jollain apuv\u00e4lineell\u00e4, se saattaa toimia eri tavoin eri selaimilla.<\/p>\n<p>Suosittelemme testaamaan verkkosivustoa n\u00e4ill\u00e4 suosituimmilla selaimilla:<\/p>\n<ul>\n<li>Chrome<\/li>\n<li>Safari<\/li>\n<li>Firefox<\/li>\n<li>Edge<\/li>\n<\/ul>\n<h2>Testaa saavutettavuus pelk\u00e4ll\u00e4 n\u00e4pp\u00e4imist\u00f6ll\u00e4<\/h2>\n<p>On t\u00e4rke\u00e4\u00e4, ett\u00e4 sivusto ja sen kaikki toiminnot ovat k\u00e4ytett\u00e4viss\u00e4 my\u00f6s ilman hiirt\u00e4. Moni k\u00e4ytt\u00e4j\u00e4 saattaa vierailla verkkosivuilla k\u00e4ytt\u00e4en pelkk\u00e4\u00e4 n\u00e4pp\u00e4imist\u00f6\u00e4.<\/p>\n<p>Sivuston saavutettavuus n\u00e4pp\u00e4imist\u00f6ll\u00e4 on erityisen t\u00e4rke\u00e4\u00e4 n\u00e4k\u00f6vammaisille ruudunlukuohjelman k\u00e4ytt\u00e4jille ja niille k\u00e4ytt\u00e4jille, joilla on syyst\u00e4 tai toisesta vaikeuksia k\u00e4ytt\u00e4\u00e4 hiirt\u00e4.<\/p>\n<p>Sivustoa kannattaa selata k\u00e4ytt\u00e4m\u00e4ll\u00e4 sarkainta (Tab \u21b9), nuolin\u00e4pp\u00e4imi\u00e4 ja Enter-n\u00e4pp\u00e4int\u00e4 ja tarkkailla samalla seuraavia asioita:<\/p>\n<ul>\n<li>Toimivatko kaikki sivuston toiminnot, kuten erilaiset lomakkeissa k\u00e4ytetyt elementit, pelkill\u00e4 n\u00e4pp\u00e4inkomennoilla?<\/li>\n<li>Onko k\u00e4ytt\u00e4j\u00e4lle selv\u00e4\u00e4, mit\u00e4 sivuston kohtaa ja mit\u00e4 toimintoa h\u00e4n k\u00e4ytt\u00e4\u00e4? Piirtyyk\u00f6 esimerkiksi kaikkien sivuston linkkien ymp\u00e4rille reunaviiva, kun sivustoa selataan k\u00e4ytt\u00e4m\u00e4ll\u00e4 sarkainta?<\/li>\n<li>Liikkuuko sarkaimella (Tab \u21b9) k\u00e4ytett\u00e4v\u00e4 kohdistin sivulla eteenp\u00e4in loogisessa j\u00e4rjestyksess\u00e4, kun sivustoa selataan sarkaimella? Kohdistimen tulisi tavallisesti liikkua vasemmalta oikealle ja ylh\u00e4\u00e4lt\u00e4 alas.<\/li>\n<\/ul>\n<h2>Testaa saavutettavuus ilman javascripti\u00e4 ja CSS:\u00e4<\/h2>\n<p>HTML-pohjaisilla verkkosivuilla k\u00e4ytet\u00e4\u00e4n usein my\u00f6s muita web-teknologioita, kuten Javascripti\u00e4 tai CSS:\u00e4. Osa n\u00e4ist\u00e4 toteutuksista saattaa joissain tilanteissa parantaa saavutettavuutta.<\/p>\n<p>T\u00e4st\u00e4 huolimatta on syyt\u00e4 varmistaa, ett\u00e4 sivusto toimii ja on saavutettava my\u00f6s silloin, kun n\u00e4m\u00e4 tekniikat on otettu pois k\u00e4yt\u00f6st\u00e4 tai kun selain tai laite ei tue niit\u00e4.<\/p>\n<p>Erityisesti on syyt\u00e4 varmistaa, ett\u00e4 sivuston olennaisimmat toiminnot toimivat ilman Javascripti\u00e4. Verkkosivustoa ei ole syyt\u00e4 suunnitella esimerkiksi niin, ett\u00e4 sille sis\u00e4\u00e4nkirjautuminen vaatii Javascripti\u00e4.<\/p>\n<p>Yleens\u00e4 sivut toimivat varmimmin eri k\u00e4ytt\u00e4jille ja ovat mahdollisimman saavutettavia, kun ne on toteutettu mahdollisimman yksinkertaisesti.<\/p>\n<h2>Testaa saavutettavuus ilman v\u00e4rej\u00e4 ja k\u00e4\u00e4nnetyill\u00e4 v\u00e4reill\u00e4<\/h2>\n<p>V\u00e4rit ovat usein hyv\u00e4 tapa korostaa asioita. Ne eiv\u00e4t saisi kuitenkaan olla verkkosivustolla ainoa keino korostaa merkityst\u00e4.<\/p>\n<p>Kaikki k\u00e4ytt\u00e4j\u00e4t eiv\u00e4t n\u00e4e v\u00e4rej\u00e4 samalla tavalla. T\u00e4m\u00e4 saattaa johtua esimerkiksi n\u00e4k\u00f6vammasta, v\u00e4risokeudesta, kulttuurisista eroista, selaimen tai laitteen asetuksista tai kirkkaasta auringonpaisteesta.<\/p>\n<p>Heikosti n\u00e4kev\u00e4 k\u00e4ytt\u00e4j\u00e4 saattaa selata verkkosivustoa k\u00e4\u00e4nnetyill\u00e4 v\u00e4reill\u00e4, sill\u00e4 osalle vaalea teksti tummalla pohjalla on helpommin luettavissa.<\/p>\n<p>N\u00e4ist\u00e4 syist\u00e4 on t\u00e4rke\u00e4\u00e4, ett\u00e4 verkkosivulla ei korosteta tai merkit\u00e4 elementtej\u00e4 pelk\u00e4n v\u00e4rin avulla. Esimerkiksi tekstin seassa olevaa linkki\u00e4 ei kannata korostaa pelk\u00e4ll\u00e4 v\u00e4rill\u00e4, vaan linkkiteksti kannattaa my\u00f6s alleviivata.<\/p>\n<p>Testaa siis sivustoa ja arvioi sen saavutettavuutta ottamalla verkkoselaimen v\u00e4rit pois k\u00e4yt\u00f6st\u00e4 ja tarkastele sivustoa mustavalkoisena.<\/p>\n<p>On t\u00e4rke\u00e4\u00e4, ett\u00e4 eri tavoilla korostettujen elementtien merkitys on k\u00e4ytt\u00e4j\u00e4lle selv\u00e4\u00e4 my\u00f6s ilman v\u00e4rej\u00e4 tai silloin, kun v\u00e4rit on k\u00e4\u00e4nnetty.<\/p>\n<h2>Suurenna sivustoa selaimesta<\/h2>\n<p>Jotkut k\u00e4ytt\u00e4j\u00e4t haluavat suurentaa verkkosivustoilla olevaa sis\u00e4lt\u00f6\u00e4 selaimesta, jos sivun teksti on heille liian pient\u00e4 luettavaksi.<\/p>\n<p>Testaa, ett\u00e4 verkkosivustoa on mahdollista suurentaa selaimesta k\u00e4sin aina 200 prosenttiin asti. Varmista, ett\u00e4 sivuston rakenne pysyy edelleen kasassa ja sis\u00e4lt\u00f6 on luettavaa ja ymm\u00e4rrett\u00e4v\u00e4\u00e4.<\/p>\n<h2>Automaattiset saavutettavuustarkistusty\u00f6kalut<\/h2>\n<p>Automaattiset tarkistusty\u00f6kalut ovat hyv\u00e4 lis\u00e4 sivustojen saavutettavuustarkistukseen. Ne saattavat auttaa verkkosivuston kehitt\u00e4ji\u00e4 l\u00f6yt\u00e4m\u00e4\u00e4n sivuston l\u00e4hdekoodista erilaisia teknisi\u00e4 saavutettavuusongelmia.<\/p>\n<p>Tarkistusty\u00f6kalut eiv\u00e4t kuitenkaan yksin\u00e4\u00e4n riit\u00e4 havaitsemaan l\u00e4hesk\u00e4\u00e4n kaikkia saavutettavuusongelmia tai osaa ehdottaa ratkaisua niihin.<\/p>\n<p>Verkkosivut kannattaa testata my\u00f6s automaattisilla tarkistusty\u00f6kaluilla, jotka tarkistavat sivun HTML- ja joskus my\u00f6s CSS-l\u00e4hdekoodin. Ty\u00f6kalut etsiv\u00e4t koodista mahdolliset saavutettavuuden kannalta kriittiset virheet.<\/p>\n<p>Usein n\u00e4iden ongelmien korjaaminen tekee sivustosta teknisesti saavutettavan apuv\u00e4lineiden k\u00e4ytt\u00e4jille.<\/p>\n<p>Osa tarkistusty\u00f6kaluista on selaimeen asennettavia selainlaajennuksia ja osa toimii verkkopalveluna.<\/p>\n<p>Verkkopalveluun kopioidaan tarkastettavan sivun internetosoite, jolloin palvelu tarkastaa sivun saavutettavuuden. Yleens\u00e4 ty\u00f6kalut tarkastavat vain yhden alasivun kerralla.<\/p>\n<p>On olemassa my\u00f6s ty\u00f6kaluja tekstin ja taustan v\u00e4lisen tummuuskontrastin tarkastamiseen. Monessa saavutettavuusohjeistuksessa tummuuskontrastille on annettu tarkat arvot, joiden tulee t\u00e4ytty\u00e4, jotta sivusto on saavutettava.<\/p>\n\n","protected":false},"excerpt":{"rendered":"<p>Verkkosivuston saavutettavuutta kannattaa testata my\u00f6s itse. Kun sivuston kehitt\u00e4j\u00e4t testaavat sivustoa ja asettuvat itse erilaisten k\u00e4ytt\u00e4jien asemaan, he saavat hyv\u00e4n kuvan sivujen teknisest\u00e4 toimivuudesta ja osittain my\u00f6s k\u00e4ytett\u00e4vyydest\u00e4. N\u00e4in on mahdollista havaita ja korjata sivuston ongelmia [&hellip;]<span class=\"moretag\">Lue lis\u00e4\u00e4&#8230;<\/span><\/p>\n","protected":false},"author":10,"featured_media":0,"parent":155,"menu_order":2,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-158","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/158","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/users\/10"}],"replies":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/comments?post=158"}],"version-history":[{"count":0,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/158\/revisions"}],"up":[{"embeddable":true,"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/pages\/155"}],"wp:attachment":[{"href":"https:\/\/papunet.net\/saavutettavuus\/wp-json\/wp\/v2\/media?parent=158"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}