ADA Title III -verkkosivuston vaatimustenmukaisuuslista

Oikeudellinen perusta: ADA Title III ja verkkosivustot

Americans with Disabilities Actin (ADA) Title III kieltää syrjinnän vammaisuuden perusteella julkisissa palvelupaikoissa. ADA säädettiin vuonna 1990, ennen kuin kommerssiaalista verkkoa oli olemassa — mikä on synnyttänyt vuosikymmenten mittaisen oikeuskäytännön siitä, luokitellaanko verkkosivustot “julkisiksi palvelupaikoiksi”.

Nykyinen oikeudellinen tilanne on pääosin ratkaistu osallisuuden puolesta. Suurin osa liittovaltion tuomioistuimista, jotka ovat käsitelleet asiaa, on katsonut, että yleisölle avoimien yritysten ylläpitämät verkkosivustot kuuluvat Title III:n piiriin. Oikeusministeriö (DOJ) julkaisi maaliskuussa 2022 muodollisen ohjeistuksen, joka vahvisti ADA:n koskevan verkkosivustoja. Huhtikuussa 2024 DOJ julkaisi Title II:n (koskee valtion ja paikallishallinnon toimijoita) mukaisen lopullisen säännön, joka nimenomaisesti ottaa käyttöön WCAG 2.1 AA-tason — vahvana viitteenä siitä, mitä Title III lopulta kodifioi.

Käytännön tulos: jos ylläpidät verkkosivustoa, jonka kautta asiakkaat pääsevät käsiksi tuotteisiin, palveluihin tai tietoon, ADA Title III koskee kyseistä verkkosivustoa.

Mitä “saavutettava” tarkoittaa ADA:n mukaan

ADA ei määrittele tiettyä teknistä standardia verkkosivuston saavutettavuudelle. Tuomioistuimet ja DOJ ovat johdonmukaisesti pitäneet Web Content Accessibility Guidelines (WCAG) 2.1 AA -tason noudattamista vertailuarvona sen määrittämisessä, täyttääkö verkkosivusto ADA:n syrjimättömyysvaatimuksen. WCAG 2.1 AA on standardi, jota käytetään lähes kaikissa DOJ:n sovintosopimuksissa ja useimmissa tuomioistuimen valvomissa vaatimustenmukaisuussuunnitelmissa.

Alla oleva tarkistuslista yhdistää kriittisimmät WCAG 2.1 AA -onnistumiskriteerit käytännön vaatimustenmukaisuusvelvoitteisiin.

ADA Title III -verkkosivuston vaatimustenmukaisuuslista

1. Tekstivastineet ei-tekstisisällölle

Jokaisella merkityksellisellä kuvalla on alt-attribuutti, joka kuvaa sen tarkoitusta
Koristeellisilla kuvilla on tyhjä alt="", jotta ruudunlukijat ohittavat ne
Painikkeina tai linkkeinä käytetyillä kuvakkeilla on saavutettavat nimet (aria-labeln tai näkyvän tekstin avulla)
Kaavioilla ja infografiikoilla on tekstikuvaukset tai datataulukot vaihtoehtoina
CAPTCHA tarjoaa äänivaihtoehdon visuaalisen haasteen rinnalla

Miksi tämä on tärkeää: Ruudunlukijan käyttäjät eivät saa mitään tietoa kuvasta, jolla ei ole alt-tekstiä. Kassapainike, joka on merkitty vain kuvakkeella eikä saavutettavalla nimellä, on käytännössä näkymätön ruudunlukijan käyttäjälle.

2. Tekstitykset ja tekstivastineet medialle

Ennalta tallennetuissa videoissa on synkronoidut tekstitykset
Suoratoistetuissa videoissa on reaaliaikaiset tekstitykset
Ennalta tallennetulla pelkällä äänisisällöllä (podcastit) on tekstivastine
Ennalta tallennetuilla videoilla, joissa on tärkeää äänisisältöä, on saatavilla tekstivastine
Automaattisesti luodut tekstitykset tarkistetaan ja korjataan ennen julkaisua

Miksi tämä on tärkeää: Tekstitykset ovat kuurojen ja huonokuuloisten käyttäjien ensisijainen keino päästä käsiksi videosisältöön. Epätarkat automaattisesti luodut tekstitykset eivät täytä vaatimusta.

3. Värit ja visuaalinen suunnittelu

Tietoa ei koskaan välitetä yksin värin avulla (esim. pakolliset kentät merkitään tekstillä tai kuvakkeella, ei vain punaisella reunuksella)
Normaali teksti (alle 18pt / 14pt lihavoitu) täyttää vähintään 4,5:1 kontrastisuhteen taustaansa nähden
Suuri teksti (18pt+ tai 14pt+ lihavoitu) täyttää vähintään 3:1 kontrastisuhteen
Käyttöliittymäkomponenteilla (painikkeet, syöttökentät, kohdistusindikaattorit) on vähintään 3:1 kontrasti viereisiin väreihin nähden
Virhetilat viestivät virheen tekstillä, ei vain värinmuutoksella

Miksi tämä on tärkeää: Noin 8 %:lla miehistä ja 0,5 %:lla naisista on jonkinasteinen värinäön poikkeavuus. Yksin väriin luottaminen sulkee ulos merkittävän osan käyttäjistäsi.

4. Näppäimistösaavutettavuus

Kaikki interaktiiviset elementit (linkit, painikkeet, lomakkeet, valikot, modaalit, päivämääränvalitsimet) ovat saavutettavissa ja käytettävissä yksin näppäimistöllä
Sarkainjärjestys noudattaa loogista, ennustettavaa sekvenssiä
Ei näppäimistöansoja — käyttäjät voivat navigoida sisään ja ulos jokaisesta komponentista vakionäppäimillä
Mukautetut widgetit (pudotusvalikot, liukusäätimet, dialogit) toteuttavat odotetut näppäimistövuorovaikutusmallit
“Siirry pääsisältöön” -linkki on ensimmäinen fokusoitava elementti jokaisella sivulla

Miksi tämä on tärkeää: Käyttäjät, joilla on liikuntarajoitteita ja jotka usein luottavat näppäimistönavigaatioon tai kytkinlaitteisiin, eivät voi käyttää hiirtä. Sivusto, joka vaatii hiiren käyttöä keskeisiin toimintoihin, on heille saavuttamaton.

5. Kohdistuksen näkyvyys

Näppäimistökohdistus on aina näkyvissä — selkeä kohdistusindikaattori (kehys, korostus, alleviivaus) näkyy aktiivisessa elementissä
Kohdistusindikaattoria ei ole vaimennettu outline: none- tai outline: 0-määrityksellä ilman korvaavaa ratkaisua
Kohdistusindikaattorilla on riittävä kontrasti ympäröivään sisältöön nähden

Miksi tämä on tärkeää: Näkyvän kohdistusindikaattorin puuttuessa näppäimistön käyttäjät eivät voi tietää, missä he ovat sivulla — vastaavaa kuin selaisi verkkoa kohdistimetta.

6. Ei kohtauksia laukaisevaa sisältöä

Mikään sisältö ei vilku useammin kuin kolme kertaa sekunnissa
Animaatiot, joita ei voi poistaa käytöstä, eivät kata suuria osia näkymästä korkealla taajuudella
Parallaksiefektit ja automaattisesti toistuvat animaatiot voidaan pysäyttää tai vähentää prefers-reduced-motion-mediakyselyn avulla

Miksi tämä on tärkeää: Valoherkkä epilepsia vaikuttaa merkittävään osaan väestöstä. Yksi vilkkuva mainos voi laukaista kohtauksen.

7. Riittävästi aikaa tehtävien suorittamiseen

Istunnon aikakatkaisut varoittavat käyttäjiä ennen umpeutumista ja antavat heille tavan jatkaa istuntoa
Automaattisesti päivittyvä sisältö (uutisnauhat, live-tulokset, kiertyvät bannerit) voidaan pysäyttää, keskeyttää tai piilottaa
Kriittisiin tehtäviin (kassa, lomakkeen lähetys) ei aseteta aikarajoja ilman riittävää jatkamismekanismia

Miksi tämä on tärkeää: Käyttäjät, joilla on kognitiivisia rajoitteita, liikuntarajoitteita tai jotka käyttävät avustavaa teknologiaa, tarvitsevat usein enemmän aikaa tehtävien suorittamiseen. Äkilliset aikakatkaisut voivat johtaa edistymisen menettämiseen.

8. Navigaatio ja suunnistus

Jokaisella sivulla on yksilöllinen, kuvaava <title>-elementti
Navigaatiovalikot ovat rakenteeltaan ja sijainniltaan johdonmukaisia sivujen välillä
Nykyinen sivun sijainti näytetään navigaatiossa (aktiivinen tila)
Murupolut ovat läsnä syvemmillä sivuilla
Sisällön löytämiseen on useita tapoja (haku, sivukartta tai navigaatio)
Otsikot on rakennettu loogisesti (h1 → h2 → h3) ja kuvaavat osion sisältöä tarkasti

Miksi tämä on tärkeää: Ruudunlukijan käyttäjät navigoivat otsikoiden, maamerkkien ja sivun otsikoiden avulla. Huonosti rakennetut otsikot tekevät sivusta käsittämättömän ruudunlukijalla navigoivalle henkilölle.

9. Lomakkeiden saavutettavuus

Jokaisella lomakekentällä on näkyvä <label>-elementti, joka on ohjelmallisesti yhdistetty siihen
Pakolliset kentät on merkitty tekstillä (ei vain asteriskilla ilman selitystä)
Virheilmoitukset kertovat, missä kentässä virhe on, ja kuvaavat, miten se korjataan
Virheilmoitukset ilmoitetaan ruudunlukijan käyttäjille (aria-liven tai kohdistuksen hallinnan avulla)
Autocomplete-attribuutit ovat läsnä yleisissä syöttökentissä (nimi, sähköposti, osoite, luottokortti)
Lomakkeen lähetys ei aikakatkea hiljaisesti

Miksi tämä on tärkeää: Lomakkeet ovat tapa, jolla käyttäjät asioivat palvelusi kanssa — varaaminen, ostaminen, rekisteröityminen, yhteydenotto. Saavuttamaton kassa on digitaalinen vastine kaupalle, jossa ei ole ramppia.

10. Linkit ja painikkeet

Jokaisella linkillä on kuvaava saavutettava nimi — “Lue lisää” yksinään ei riitä; “Lue lisää [aiheesta]” riittää
Linkit ja painikkeet erottuvat ympäröivästä tekstistä luottamatta yksin väriin
Toimintoja käynnistävät painikkeet on merkitty <button>-elementeiksi, ei tyylitellyiksi <div>- tai <span>-elementeiksi
Linkit, jotka avautuvat uuteen välilehteen tai käynnistävät latauksen, viestivät tästä käyttäjälle

Miksi tämä on tärkeää: Ruudunlukijan käyttäjät selaavat usein listaamalla kaikki sivun linkit. Lista “klikkaa tästä”- ja “lue lisää” -linkkejä ei tarjoa navigaatioarvoa.

11. Kieli ja luettavuus

Sivun ensisijainen kieli on määritetty lang-attribuutissa <html>-elementissä (esim. lang="fi")
Muunkielisissä osioissa on lang-attribuutti sisältävässä elementissä
Lyhenteet avataan ensimmäisellä käyttökerralla tai <abbr title="...">-elementillä tarvittaessa

Miksi tämä on tärkeää: Ruudunlukijat käyttävät kieliattribuuttia oikean ääntämismoottorin valitsemiseksi. Sen puuttuessa saksankielisen moottorin lukema englanninkielinen teksti on lähes käsittämätöntä.

12. Johdonmukainen, ennustettava käyttäytyminen

Kohdistuksen saaminen ei automaattisesti käynnistä kontekstin muutosta (esim. lomake ei lähde kentän saadessa kohdistuksen)
Lomakekentän muuttaminen ei käynnistä odottamatonta navigaatiota tai modaalidialogeja
Samaa toimintoa toteuttavat komponentit on nimetty johdonmukaisesti sivujen välillä

Miksi tämä on tärkeää: Ennustamaton käyttäytyminen on hämmentävää kaikille käyttäjille, mutta erityisesti niille, joilla on kognitiivisia rajoitteita tai jotka luottavat ruudunlukijoihin.

13. PDF-tiedostot ja asiakirjat

Latauksessa olevat PDF-tiedostot on tagattu rakenteen mukaan (otsikot, listat, lukujärjestys)
PDF-lomakekentät on nimetty
Skannatut PDF-tiedostot (vain kuva) on OCR-käsitelty ja tagattu
Word-, Excel- ja PowerPoint-tiedostot käyttävät sisäänrakennettuja saavutettavuusominaisuuksia (otsikkotyylit, alt-teksti, taulukoiden nimet)

Miksi tämä on tärkeää: Tuomioistuimet ja DOJ ovat johdonmukaisesti pitäneet ladattavia asiakirjoja osana verkkosivuston saavutettavaa sisältöä. Saavuttamaton PDF muutoin saavutettavassa kassassa on edelleen este.

14. Mobiilisaavutettavuus

Kaikki toiminnallisuus on käytettävissä sekä pysty- että vaakasuunnassa
Kosketuskohteet (painikkeet, linkit) ovat vähintään 44×44 CSS-pikselia
Sisältö ei vaadi vaakasuuntaista vieritystä standardinäytöillä
Sivusto ei poista käytöstä käyttäjän skaalausta maximum-scale- tai user-scalable=no-määrityksellä viewport-metatagissa

Miksi tämä on tärkeää: Monet vammaiset käyttäjät käyttävät mobiililaitteita ensisijaisena tai ainoana tapana päästä käsiksi verkkoon. Mobiiliesteet sulkevat heidät ulos yhtä tehokkaasti kuin työpöytäesteet.

15. Saavutettavuusseloste

Saavutettavuusseloste on julkaistu ja linkitetty sivuston alatunnisteesta
Seloste tunnistaa standardin, jota sivusto tavoittelee (WCAG 2.1 AA)
Seloste sisältää yhteydenottomekanismin käyttäjille esteiden ilmoittamiseksi
Yhteydenottomekanismi on itsessään saavutettava

Miksi tämä on tärkeää: Saavutettavuusseloste osoittaa vilpittömyyttä ja antaa käyttäjille tien ratkaisuun ennen kuin he hakevat oikeussuojaa. Se on myös vaadittu useissa valtiotason laeissa ja odotettu käytäntö DOJ:n ohjeistuksen mukaan.

Täytäntöönpano ja oikeudenkäyntiriski

ADA Title III ei vaadi kantajia todistamaan tahallista syrjintää. Jos este on olemassa ja jos se estää vammaista henkilöä pääsemästä käsiksi tuotteisiin tai palveluihin, kanne voi edetä. Title III:n mukaiset korvaukset eivät sisällä vahingonkorvauksia (toisin kuin Section 504), mutta ne sisältävät kieltokanteen ja asianajajien palkkiot — jotka ovat usein sarjaoikeudenkäyntien ensisijainen ajuri.

ADA-verkkosivuston saavutettavuusoikeusjuttujen määrä Yhdysvalloissa on kasvanut jyrkästi viime vuosina, ja tuhansia nostetaan vuosittain. Pienet ja keskisuuret yritykset ovat yleisiä kohteita, koska niiden oletetaan investoineen vähemmän todennäköisesti vaatimustenmukaisuuteen.

Jos olet saanut ADA-vaatimuskirjeen, älä jätä sitä huomiotta. Hanki lakimiehen apua nopeasti ja tilaa saavutettavuusauditointi, jotta sinulla on tarkka kuva sivustosi vaatimustenmukaisuudesta.

Vaatimustenmukaisuuden ylläpito ajan mittaan

Kertaluonteinen auditointi ja korjaus ei riitä. Jokainen uusi sivu, ominaisuus tai kolmannen osapuolen integraatio voi tuoda uusia esteitä. Organisaatiot, joilla on pienin oikeudenkäyntiriski, ylläpitävät vaatimustenmukaisuutta jatkuvasti:

Automatisoitu skannaus kehitysprosessiin sisällytettynä havaitsee havaittavat ongelmat ennen kuin ne saavuttavat tuotannon. CI/CD-saavutettavuusintegraatiomme tekee tästä osan jokaista buildia.
Ajastetut manuaaliset auditoinnit tuovat esiin ongelmat, joita automaattiset työkalut eivät havaitse — ruudunlukijan vuorovaikutus, kognitiivinen kuormitus, näppäimistöansat.
Saavutettavuuskoulutus kehittäjille ja sisällöntekijöille estää esteiden syntymisen alusta alkaen.
Käyttäjäpalautemekanismit antavat vammaisille henkilöille suoran kanavan ilmoittaa esteistä ennen kuin niistä tulee oikeudellisia kysymyksiä.

Ilmainen automaattinen skannaus on nopein tapa tunnistaa sivustosi näkyvimmät WCAG-puutteet. Saadaksesi täydellisen kuvan, joka vastaa ADA-altistumistasi, ota yhteyttä tiimiimme keskustellaksesi täydellisestä auditoinnista.