Euroopan esteettömyysdirektiivi: mitä se vaatii verkkosivustoltasi ja mitä valvonta on osoittanut

Direktiiviä 2019/882 on sovellettu 28. kesäkuuta 2025 alkaen. Toisin kuin useimmat digitaaliset säännöt, se ei ollut hiljainen alku. Ranskalainen tuomioistuin määräsi Carrefourin saattamaan verkkosivustonsa vaatimusten mukaiseksi päiväsakon uhalla, ja kansalliset valvontaelimet ovat tehneet toimialakohtaisia tarkastuksia siitä lähtien.

Se, mikä tekee esteettömyysdirektiivistä erilaisen muihin tämän aallon säädöksiin verrattuna, on että vaatimustenmukaisuutta ei voi esittää. Joko sivustoa voi käyttää näppäimistöllä tai ei voi. Joko lomakkeen virheilmoitukset ilmoitetaan ruudunlukijalle tai eivät. Tarkastus on suora, ja kuka tahansa voi tehdä sen.

Kenelle se koskee

Direktiivi kattaa tuotteet ja palvelut, jotka on tarkoitettu kuluttajille. Digitaalisella puolella se tarkoittaa:

Verkkokauppa, kaikki kuluttajille suunnattu myynti verkossa.
Kuluttajapankkipalvelut, mukaan lukien verkkopankki ja mobiilisovellukset.
Sähköiset viestintäpalvelut ja niiden käyttöliittymät.
Audiovisuaalisten mediapalvelujen käyttöoikeuspalvelut, kuten suoratoistoalustojen käyttöliittymät.
Matkustajaliikenteen palvelut: lipunmyynti, aikataulut, matkatiedot lento-, linja-auto-, rautatie- ja vesiliikenteessä.
Sähkökirjat ja niiden lukuohjelmistot.
Itsepalvelupäätteet: pankkiautomaatit, lipunmyyntiautomaatit, lähtöselvitysautomaatit, maksupäätteet.

Mikroyritykset, joilla on alle 10 työntekijää ja enintään 2 miljoonan euron vuosiliikevaihto tai tase, on vapautettu palveluvelvoitteista. Tämä on kapea poikkeus, ja se ei koske tuotteita.

Yksi väärinkäsitys kannattaa oikaista. Jos yritys myy verkossa kuluttajille, se on soveltamisalassa, riippumatta siitä kuinka pieni tai suuri, ellei se ole mikroyritys. B2B-verkkokauppa jää pääsääntöisesti ulkopuolelle, mutta jos sama alusta palvelee molempia, käytännön ratkaisu on rakentaa esteettömästi kerran.

Tekninen mittapuu

Direktiivi asettaa toiminnalliset vaatimukset, ei tekniset yksityiskohdat. Yhdenmukaistettu standardi, joka luo vaatimustenmukaisuusolettaman, on EN 301 549, joka nykyisessä versiossaan vastaa WCAG 2.1 -tasoa AA. Päivitystä WCAG 2.2:een on odotettu, ja on järkevää rakentaa sitä vasten, koska erot ovat pieniä ja pääosin parannuksia.

Käytännössä tämä tarkoittaa neljää periaatetta: havaittava, hallittava, ymmärrettävä ja toimintavarma.

Mitä tämä oikeasti tarkoittaa koodissa

Suurin osa esteettömyystyöstä ei ole eksoottista. Se on samojen kymmenen asian korjaamista kaikkialla.

Semanttinen HTML ensin

Div, jossa on klikkauskäsittelijä, ei ole painike. Se ei saa kohdistusta, se ei reagoi välilyöntiin tai enteriin, eikä se kerro ruudunlukijalle mitään.

Suurin yksittäinen parannus useimmilla sivustoilla on korvata rakennetut komponentit oikeilla elementeillä: button, a, label, fieldset, nav, main ja otsikkotasot h1:stä h6:een oikeassa järjestyksessä. ARIA on korjauskerros, ei lähtökohta.

Näppäimistön käytettävyys kokonaan

Jokainen toiminto, joka on tehtävissä hiirellä, on oltava tehtävissä näppäimistöllä. Ei näppäimistöansoja. Looginen kohdistusjärjestys, joka vastaa visuaalista järjestystä. Näkyvä kohdistusindikaattori, joka täyttää kontrastivaatimukset.

Modaalit ovat toistuva ongelmakohta: kohdistus on siirryttävä modaaliin auettaessa, pysyttävä sen sisällä, palattava avaavaan elementtiin suljettaessa, ja Escapen on suljettava se.

Lomakkeet, joita voi täyttää

Jokaisella syötteellä on ohjelmallisesti liitetty otsikko. Ei paikkamerkkejä otsikoina. Virheet on tunnistettava tekstillä, ei vain värillä, liitettävä kenttään ja ilmoitettava avustaville teknologioille. Pakolliset kentät merkittävä ohjelmallisesti.

Kassalomakkeet ovat esteettömyysdirektiivin ydinaluetta verkkokaupassa, ja ne ovat myös yleensä monimutkaisimmat sivut sivustolla.

Kontrasti ja tekstin koko

Vähintään 4,5:1 normaalille tekstille, 3:1 suurelle tekstille ja käyttöliittymäkomponenteille. Tekstin on skaalauduttava 200 prosenttiin ilman että sisältöä katoaa tai toiminnallisuus rikkoutuu.

Tämä on tyypillisesti se kohta, jossa suunnittelutiimi vastustaa, koska harmaa harmaalla näyttää hillityltä. Se on myös yksi helpoimmista havainnoista automaattisessa testauksessa, mikä tarkoittaa että se löytyy.

Tekstivastineet ja media

Merkitykselliset kuvat tarvitsevat kuvaavan alt-tekstin. Koristeelliset kuvat tarvitsevat tyhjän alt-attribuutin, ei puuttuvaa. Videot tarvitsevat tekstityksen, ja tallennettu ääni tarvitsee tekstiversion.

Ikonipainikkeet ilman saavutettavaa nimeä ovat toinen jatkuva löydös. Roskakori-ikoni on ruudunlukijalle «painike», ellei sille anneta nimeä.

Dynaaminen sisältö ja tilamuutokset

Kun sisältö muuttuu ilman sivulatausta, avustavien teknologioiden on saatava tieto. Live-alueet ilmoituksille, kohdistuksen hallinta näkymän vaihtuessa, ja lataustilat, jotka on ilmoitettu eikä vain animoitu.

Yhden sivun sovellukset epäonnistuvat tässä lähes oletuksena, koska reitin vaihto ei siirrä kohdistusta eikä ilmoita otsikon muutosta.

Aikarajat ja liike

Jos on aikaraja, käyttäjän on voitava pidentää tai poistaa se, paitsi kapeissa poikkeuksissa. Automaattisesti liikkuva, vierivä tai päivittyvä sisältö tarvitsee pysäytysmahdollisuuden. Karusellit ovat klassinen rikkoja.

Esteettömyysseloste

Palveluntarjoajien on annettava tietoa siitä, miten palvelu täyttää esteettömyysvaatimukset. Käytännössä tämä on julkinen seloste, joka kattaa:

Kuvauksen palvelusta ja siitä, miten se on esteetön.
Sovelletut vaatimukset ja käytetty standardi.
Tiedossa olevat puutteet ja aikataulu niiden korjaamiseen.
Palautekanava, jonka kautta käyttäjät voivat ilmoittaa esteistä.
Valvontaelimen tiedot.

Puutteiden ilmoittaminen ei ole heikkouden myöntämistä. Seloste, joka väittää täydellistä vaatimustenmukaisuutta, kun automaattinen testi löytää 200 rikkomusta, on huonompi kuin rehellinen seloste korjaussuunnitelmalla.

Kohtuuton rasite ja perusteellinen muutos

Direktiivi sallii poikkeuksen, jos vaatimusten täyttäminen aiheuttaisi kohtuuttoman rasitteen tai edellyttäisi tuotteen tai palvelun perusteellista muuttamista.

Tämä ei ole vapaakortti. Vetoaminen edellyttää dokumentoitua arviota, joka ottaa huomioon kustannukset suhteessa kokonaiskustannuksiin, arvioidut kustannukset ja hyödyt suhteessa hyötyyn vammaisille henkilöille sekä organisaation resurssit. Arvio on toimitettava valvontaelimelle pyynnöstä ja uusittava vähintään viiden vuoden välein.

Käytännössä useimmat vetoamiset, joita näemme, eivät kestäisi tarkastelua. «Uudelleensuunnittelu on kallista» ei ole arvio.

Miten valvonta on toiminut

Kuvio ensimmäisenä vuotena on ollut ennustettava:

Valitukset ovat tärkein käynnistin. Direktiivi vaatii jäsenvaltioita perustamaan menettelyn, jolla kuluttajat voivat ilmoittaa vaatimustenvastaisuudesta. Käyttäjät, jotka eivät voi käyttää sivustoa, ilmoittavat siitä.

Automaattinen tarkastus on ensimmäinen suodatin. Valvontaelimet ajavat automaattisia työkaluja koko toimialoille. Automaattiset työkalut löytävät ehkä kolmanneksen ongelmista, mutta ne löytävät ne halvalla ja laajassa mitassa.

Oikeustoimet ovat mahdollisia ja niitä on käytetty. Carrefour-tapaus Ranskassa on huomionarvoinen, koska se osoitti, että päiväsakot ovat käytettävissä oleva keino, ja koska se koski suurta yritystä, jolla oli resurssit tehdä työ.

Julkisilla hankinnoilla on kerrannaisvaikutus. Julkisen sektorin ostajien on hankittava esteettömiä ratkaisuja. Toimittajat, jotka eivät ole vaatimusten mukaisia, putoavat pois tarjouskilpailuista.

Realistinen tapa korjata olemassa oleva sivusto

Se, mikä toimii, ei ole täydellinen tarkastus, jota seuraa vuoden mittainen korjausprojekti. Se on tämä:

Aja automaattinen skannaus koko sivustolle ja lajittele löydökset tyypeittäin, ei sivuittain. Sama puuttuva otsikko toistuu 400 sivulla, koska se on yhdessä komponentissa. Korjaa komponentti kerran.

Korjaa suunnittelujärjestelmä ennen sivuja. Painikkeet, syötteet, modaalit, välilehdet, pudotusvalikot, taulukot. Suurin osa rikkomuksista periytyy näistä. Yksi komponenttikirjaston korjauskierros poistaa suurimman osan löydöksistä koko sivustolta.

Tee manuaalinen testaus ydinpolulle. Etusivu, haku, tuotesivu, ostoskori, kassa, tili. Näppäimistöllä, sitten ruudunlukijalla. Automaattiset työkalut eivät kerro, onko kassa oikeasti läpäistävissä.

Ota käyttäjiä mukaan. Tunti oikean ruudunlukijan käyttäjän kanssa löytää asioita, joita mikään työkalu ei löydä, ja se muuttaa tiimin suhtautumista tehokkaammin kuin mikään koulutus.

Estä regressio. Lisää esteettömyystestit CI:hin, tee esteettömyydestä osa määritelmää valmiista, ja tarkasta uudet komponentit ennen kuin ne pääsevät kirjastoon. Ilman tätä olet samassa tilanteessa 18 kuukauden kuluttua.

Miksi tämä kannattaa muutenkin

Esteettömyys korreloi vahvasti asioiden kanssa, joita tuotetiimit muutenkin haluavat.

Semanttinen merkkaus on sitä, mitä hakukoneet lukevat. Selkeät lomakevirheet vähentävät kassan hylkäämistä. Näppäimistön käytettävyys tekee sivustosta nopeamman tehokäyttäjille. Kontrastivaatimukset parantavat luettavuutta kirkkaassa auringonvalossa puhelimella, mikä on suuri osa liikennettä.

Ja kohderyhmä ei ole marginaalinen. Noin joka neljäs aikuinen EU:ssa elää jonkinasteisen toimintarajoitteen kanssa, ja väestön ikääntyessä osuus kasvaa.

Missä me autamme

Rakennamme ja korjaamme käyttöliittymiä yrityksille, jotka toimivat Euroopassa, mikä nykyään tarkoittaa esteettömiä komponenttikirjastoja, korjauskierroksia olemassa oleville alustoille ja CI-portteja, jotka estävät takapakin.

Jos sinulla on sivusto, joka on soveltamisalassa ja josta et ole varma, aloita automaattisella skannauksella ja näppäimistöläpikäynnillä kassapolulla. Se kertoo aika tarkasti, missä olet.

Kirjoita osoitteeseen office@c9group.dev, jos haluat apua. Lisää eurooppalaisesta työstämme EU-markkinoille tuloa käsittelevällä sivulla, ja koko sääntelykuva oppaassamme EU:n digitaaliseen sääntelyyn 2026.

Olemme insinöörejä emmekä juristeja. Soveltamisalaa koskevat päätökset ja kohtuutonta rasitetta koskevat arviot kuuluvat juristeillenne.