Kotisivujen saavutettavuusdirektiivi: mitä yrityksen pitää tehdä?

Kotisivujen saavutettavuusdirektiivi: mitä yrityksen pitää tehdä?

Kotisivujen saavutettavuusdirektiivi koskettaa yhä useampaa suomalaista yritystä – eikä kyse ole pelkästään julkisesta sektorista. Euroopan saavutettavuusdirektiivi (European Accessibility Act, EAA) laajentaa velvoitteet yksityiselle sektorille, ja kesäkuusta 2025 alkaen vaatimukset koskevat myös monia verkkokauppoja ja digitaalisia palveluja. Jos yrityksesi myy tuotteita tai palveluita verkossa, tämä artikkeli kertoo, mitä sinun pitää konkreettisesti tehdä.

Mikä saavutettavuusdirektiivi oikeastaan on?

EU:n saavutettavuusdirektiivi (EAA) astui voimaan kansallisella tasolla Suomessa digipalvelulain päivityksenä. Sen tavoite on yksinkertainen: digitaalisten palvelujen pitää toimia kaikille – myös niille, joilla on näkö-, kuulo-, motorinen tai kognitiivinen rajoite.

Käytännössä direktiivi viittaa WCAG 2.1 AA -tason kriteereihin. Nämä ovat teknisiä ohjeita, jotka määrittävät esimerkiksi miten tekstin kontrasti, näppäimistönavigaatio ja ruudunlukijan tuki pitää toteuttaa.

Yleinen väärinkäsitys on, että saavutettavuus koskee vain julkisia palveluja tai isoja yrityksiä. Ei koske. Direktiivin piiriin kuuluvat muun muassa verkkokaupat, pankkipalvelut, sähköiset matkaliput ja viestintäpalvelut – koosta riippumatta. Mikroyritykset (alle 10 henkilöä ja liikevaihto alle 2 miljoonaa euroa) saavat poikkeuksen tietyissä tilanteissa, mutta jo pieni verkkokauppa voi ylittää rajan nopeasti.

Mitä saavutettavuus tarkoittaa kotisivuilla käytännössä?

Saavutettavuus ei ole erillinen projekti – se on osa hyvää käyttäjäkokemusta ja käyttöliittymäsuunnittelua. Suurin osa vaadituista muutoksista parantaa sivustoa kaikille käyttäjille, ei pelkästään erityisryhmille.

Keskeisimmät asiat, jotka pitää olla kunnossa:

Riittävä värikontrasti. Tekstin ja taustan välinen kontrastisuhde pitää olla vähintään 4,5:1 normaalille tekstille. Tämä kuulostaa tekniseltä, mutta käytännössä se tarkoittaa: vaaleanharmaata tekstiä valkoisella taustalla ei saa käyttää. Kontrastin voi testata ilmaisella WebAIM Contrast Checker -työkalulla.

Näppäimistönavigaatio. Koko sivusto pitää pystyä käyttämään pelkällä näppäimistöllä – ilman hiirtä. Tab-näppäimellä siirtyminen elementistä toiseen, Enter-näppäimellä valitseminen. Testaa itse: avaa sivustosi ja yritä käyttää sitä pelkällä Tabilla.

Alt-tekstit kuvissa. Jokainen informatiivinen kuva tarvitsee kuvaavan alt-tekstin. Dekoratiiviset kuvat merkitään tyhjällä alt-attribuutilla (alt=””). WordPress tekee tämän helpoksi, kunhan muistat täyttää kentän joka kerta kun lisäät kuvan.

Lomakkeiden saavutettavuus. Jokaisella lomakekentällä pitää olla label-elementti, virheviestien pitää olla selkeitä ja lomakkeen pitää toimia ruudunlukijalla. Pelkkä placeholder-teksti ei riitä kentän tunnisteeksi.

Looginen otsikkorakenne. H1, H2, H3 – otsikkotasot eivät ole visuaalisia valintoja vaan rakenteellisia. Ruudunlukija käyttää niitä navigointiin. Älä hyppää H1:stä suoraan H4:ään vain koska fonttikoko näyttää paremmalta.

Saavutettavuusdirektiivi ja responsiivisuus kulkevat käsi kädessä

Responsiivinen sivusto on saavutettavuuden perusta. Direktiivi edellyttää, että sisältö on käytettävissä eri laitteilla ja näytön koilla – ja tämä tarkoittaa myös sitä, että sivuston pitää toimia suurennettuna 200 prosenttiin ilman sisällön katoamista tai vaakavierityksen tarvetta.

Käytännössä moni WordPress-teema hoitaa responsiivisuuden kohtalaisesti, mutta saavutettavuusongelmat piilevät usein yksityiskohdissa: modaali-ikkunat eivät sulkeudu Esc-näppäimellä, valikot eivät avaudu näppäimistöllä, tai karuselli pyörii ilman pysäytysmahdollisuutta.

Askel askeleelta: näin tarkistat sivustosi saavutettavuuden

1. Aja automatisoitu tarkistus. Asenna selaimeen WAVE- tai axe DevTools -lisäosa. Se tunnistaa yleisimmät ongelmat: puuttuvat alt-tekstit, kontrastivirheet, puuttuvat label-elementit. Huomaa kuitenkin, että automaattiset työkalut löytävät arviolta vain 30–40 % ongelmista.

2. Testaa näppäimistöllä. Käy sivusto läpi pelkällä Tab-näppäimellä. Näkyykö focus-kehys jokaisessa linkissä ja painikkeessa? Pääsetkö päävalikkoon, lomakkeisiin ja ostoskoriin ilman hiirtä?

3. Kokeile ruudunlukijaa. Macissa VoiceOver on valmiina (Cmd+F5), Windowsissa NVDA on ilmainen. Kuuntele miltä sivustosi kuulostaa – se paljastaa nopeasti puuttuvat otsikkotasot ja epäselvät linkkitekstit.

4. Tarkista mobiilisaavutettavuus. Ovatko painikkeet riittävän isoja (vähintään 44×44 pikseliä)? Toimiiko navigaatio yhdellä kädellä?

5. Kirjoita saavutettavuusseloste. Direktiivi edellyttää, että sivustolla on julkinen saavutettavuusseloste. Siinä kerrotaan mitä standardia noudatetaan, mitkä osat eivät vielä ole saavutettavia ja miten käyttäjä voi antaa palautetta.

Tyypillisiä virheitä joita näen toistuvasti

Yksi yleisimmistä ongelmista suomalaisilla yritysten sivuilla on ”Lue lisää” -linkit ilman kontekstia. Ruudunlukija lukee pelkän ”Lue lisää” – käyttäjä ei tiedä mistä aiheesta. Ratkaisu: ”Lue lisää konversio-optimoinnista” tai aria-label-attribuutti.

Toinen toistuva ongelma on evästebannerin saavutettavuus. Moni evästetyökalu peittyy sivun päälle niin, että näppäimistökäyttäjä ei pääse sen ohi tai sen sisällä olevat painikkeet eivät saa focusta. Tämä linkittyy suoraan myös GDPR-vaatimusten noudattamiseen – evästeiden hallinta pitää olla saavutettavaa.

Kolmas klassikko: PDF-tiedostot ilman saavutettavuusmerkintöjä. Jos jaat hinnastoja, esitteitä tai lomakkeita PDF-muodossa, nekin kuuluvat direktiivin piiriin.

Saavutettavuus on myös bisneshyöty

Suomessa arvioidaan olevan yli miljoona ihmistä, joilla on jokin toimintarajoite – pysyvä tai tilapäinen. Se on valtava yleisö, joka jää tavoittamatta, jos sivusto ei toimi heille.

Saavutettavuuskorjaukset parantavat lähes poikkeuksetta myös hakukonenäkyvyyttä. Puhdas HTML-rakenne, kuvaavat alt-tekstit ja looginen otsikkohierarkia ovat samoja asioita, joita Google arvostaa. Samalla sivuston käytettävyys paranee kaikille – myös niille, jotka selaavat puhelimella kirkkaassa auringonvalossa tai hitaalla yhteydellä.

Jos haluat perehtyä esteettömyyden tekniseen toteutukseen tarkemmin, lue opas kotisivujen esteettömyydestä.

UKK – Usein kysytyt kysymykset

Koskeeko saavutettavuusdirektiivi pientä yritystäni?
Jos yrityksesi myy tuotteita tai palveluita verkossa ja ylittää mikroyrityksen rajan (yli 10 henkilöä tai yli 2 miljoonan euron liikevaihto), direktiivi koskee sinua. Mikroyrityksillä on rajattu poikkeus, mutta saavutettavuuden perusasiat kannattaa silti hoitaa kuntoon – ne parantavat sivuston laatua ja hakukonenäkyvyyttä.

Mitä tapahtuu, jos sivusto ei täytä saavutettavuusvaatimuksia?
Suomessa Etelä-Suomen aluehallintovirasto valvoo digipalvelulain noudattamista. Käytännössä valvonta etenee huomautuksista ja toimintamääräyksistä eteenpäin. Sanktiot voivat olla taloudellisia, mutta suurempi riski on mainehaitta ja menetetyt asiakkaat.

Riittääkö automaattinen saavutettavuustarkistus?
Ei yksinään. Automaattiset työkalut löytävät vain osan ongelmista – esimerkiksi puuttuvat alt-tekstit tai kontrastivirheet. Ne eivät pysty arvioimaan sisällön ymmärrettävyyttä, navigaation loogisuutta tai ruudunlukijakokemusta kokonaisuutena. Paras tulos syntyy yhdistämällä automatisoitu tarkistus, manuaalinen testaus ja käyttäjäpalaute.

Yhteenveto

Saavutettavuusdirektiivi ei ole byrokratiaa vaan käytännön vaatimus, jonka noudattaminen tekee sivustostasi paremman kaikille käyttäjille. Aloita yksinkertaisista asioista: aja WAVE-tarkistus, testaa näppäimistöllä, korjaa kontrastit ja alt-tekstit. Kirjoita saavutettavuusseloste ja tee esteettömyydestä jatkuva osa sivuston ylläpitoa – ei kertaluontoinen projekti.