WCAG 2.1 koodarille: Näin täytät saavutettavuusvaatimukset teknisesti oikein

WCAG 2.1 koodarille: Näin täytät saavutettavuusvaatimukset teknisesti oikein

Jos kehität verkkopalveluja Suomessa, saavutettavuus ei ole enää valinnainen ominaisuus. Se on laki. Tässä artikkelissa käymme läpi WCAG 2.1 -standardin teknisestä näkökulmasta: mitä sinun on koodarina oikeasti tehtävä, jotta verkkosivusi täyttää saavutettavuusvaatimukset AA-tasolla.

Mikä laki velvoittaa?

  • EU:n saavutettavuusdirektiivi (2016/2102)
  • Digipalvelulaki (306/2019) – velvoittaa julkista sektoria, sekä tietyissä tapauksissa yksityisiä toimijoita

Tekninen mittari: WCAG 2.1 AA-taso – kaikki ”A” ja ”AA” -tason kriteerit on täytettävä.

WCAG 2.1 teknisestä näkökulmasta

WCAG 2.1 rakentuu neljän periaatteen varaan. Alla tärkeimmät tekniset kohdat jokaisesta:

1. Havaittava

  • Kuville alt-tekstit:
    <img src="tuote.jpg" alt="Tuotekuva: vihreä reppu">
  • Riittävä kontrasti: Tekstin ja taustan kontrastisuhde vähintään 4.5:1
  • Skaalautuva teksti: Käytä suhteellisia yksiköitä (rem, em)
  • Semanttinen HTML:
    <main><section><h1>Otsikko</h1></section></main>

2. Hallittava

  • Näppäimistöllä toimivuus: Kaikkien toimintojen on toimittava ilman hiirtä
  • Fokus näkyvä: Älä poista selaimen oletusfokusta
    button:focus { outline: 2px solid #005fcc; }
  • Ohituslinkki alussa:
    <a href="#main" class="skip-link">Siirry sisältöön</a>
  • Looginen tabbailujärjestys ja otsikkohierarkia

3. Ymmärrettävä

  • Virheviestit ja ohjeet lomakkeissa:
    <div class="error">Anna sähköpostiosoite</div>
  • Sivun kieli määriteltävä:
    <html lang="fi">
  • Navigointi ja käyttöliittymä pysyy johdonmukaisena

4. Toimintavarma

  • Validi HTML: Tarkista W3C Validatorilla
  • ARIA-attribuutit vain kun tarpeen:
    <div role="button" tabindex="0" aria-pressed="false">Aseta</div>

Testaaminen: työkalut koodarille

Yhteenveto

WCAG 2.1 AA-tason täyttäminen ei vaadi mustaa magiaa – se vaatii huolellisuutta, semanttista HTML:ää ja saavutettavan käyttöliittymän suunnittelua. Kun saavutettavuus rakennetaan suoraan koodiin, siitä hyötyvät kaikki käyttäjät – ja samalla vältetään lain rikkominen.

Vinkki:

Tee saavutettavuustestit osaksi CI-prosessia – esimerkiksi axe-core-työkaluilla automatisoit osan tarkastuksesta jo build-vaiheessa.

Tarvitsetko apua saavutettavuuden tekemiseen verkkosivuille tai saavutettavuusauditointia? Ole yhteydessä!

Powerpanda AI Builder - palvelun sopimusehdot

1. Sopimuksen kohde, toimitus ja palvelun sisältö

Palvelu käsittää Powerpandan tuottaman Panda AI -verkkosivuston sekä sen ylläpidon ja hosting-palvelun Powerpandan osoittamalla palvelimella.

Sivusto rakennetaan aluksi tilapäisosoitteeseen, jota Asiakas voi halutessaan käyttää myös sivuston virallisena osoitteena sivuston valmistuttua. Mikäli Asiakas haluaa domaininsa yhdistettävän sivustoon, Asiakas vastaa domainin yhdistämisestä Powerpandan palvelimeen. IP-osoite toimitetaan Asiakkaalle sivuston valmistumisen jälkeen.

Sivuston valmistumisen yhteydessä Asiakkaalle luovutetaan riittävät käyttöoikeudet ja tunnukset sivuston sisällön päivittämistä varten. Asiakas sitoutuu säilyttämään sivuston hallintatunnuksia huolellisesti. Mikäli tunnusten joutuminen vääriin käsiin aiheuttaa Toimittajalle ongelmia tai vahinkoa, Asiakas vastaa asiasta kuin omanaan.

Palveluun sisältyvä asiakastuki ei käsitä sivuston jatkokehitystyötä. Mahdolliset Asiakkaan toimesta pyydettävät jatkokehitystyöt laskutetaan Toimittajan voimassa olevan tuntiveloituksen mukaan.

Toimittaja huolehtii sivuston päivittäisestä palvelintason varmuuskopioinnista, ja varmuuskopioita säilytetään 14 vuorokautta (vrk). Palveluun sisältyy enintään viisi gigatavua (5 Gt) levytilaa. Toimittajalla on oikeus veloittaa määrän ylittävästä levynkäytöstä 5 € (alv 0%) jokaiselta alkavalta ylittyvältä gigatavulta.

Asiakas sitoutuu siihen, ettei se säilytä palvelimella tai WordPressin mediakansiossa sivuston toimintaan liittymätöntä materiaalia. Sivustolla saa käyttää ainoastaan turvallisia, yleisesti tunnettuja ja säännöllisesti päivitettäviä lisäosia. Vanhentuneet tai koodiltaan puutteelliset lisäosat voivat vaarantaa sivuston tietoturvan. Toimittajalla on oikeus ilman ennakkoilmoitusta poistaa käytöstä tai poistaa kokonaan tietoturvan kannalta vaaralliseksi katsomansa lisäosa Asiakkaan palvelusta.

2. Sopimusaika ja irtisanominen

Sopimus tulee voimaan tilaushetkellä ja on voimassa yhden (1) vuoden määräaikaisena tilausjaksona.

Toimittajalla on oikeus olla hyväksymättä asiakasta. Tällaisessa tilanteessa asiakkaan mahdollisesti jo maksama maksu palautetaan täysimääräisesti.

Palvelulla on 100 % tyytyväisyystakuu laskettuna 30 päivää tilauksesta, jolloin maksu palautetaan asiakkaalle täysimääräisenä.

Irtisanominen on tehtävä kirjallisena osoitteeseen ai@powerpanda.fi. Sopimus uusiutuu automaattisesti aina uudeksi 12 kuukauden määräaikaisjaksoksi, ellei Asiakas irtisano sopimusta kirjallisesti sähköpostitse samaan osoitteeseen (ai@powerpanda.fi) viimeistään yhtä (1) kuukautta ennen kuluvan tilausjakson päättymistä.

3. Maksuehdot ja palvelun sulkeminen

Palvelu maksetaan tilausjakson alussa Stripe-maksupalvelun kautta tai laskulla erikseen pyydettäessä.

Mikäli Asiakkaan maksu viivästyy, Toimittajalla on oikeus sulkea Asiakkaan palvelu ja sivusto tilapäisesti tai lopullisesti, kunnes kaikki erääntyneet maksut on suoritettu. Palvelun sulkeminen ei vapauta Asiakasta maksuvelvollisuudesta.

4. Oikeudet ja omistajuus

Asiakas saa täydet omistus- ja käyttöoikeudet tilaamaansa verkkosivustoon ja sen räätälöityihin sisältöihin sen jälkeen, kun kaikki Toimeksiantoon liittyvät maksut on suoritettu 100-prosenttisesti Toimittajalle.

Toimittajan taustajärjestelmät, mahdolliset lisenssit ja Panda AI -ohjelmistokomponentit säilyvät Toimittajan tai kolmansien osapuolten omaisuutena.

5. Referenssioikeus

Toimittajalla on oikeus käyttää Asiakkaalle tekemäänsä toimitusta referenssinä omassa markkinoinnissaan.

Referenssioikeus käsittää oikeuden mainita Asiakas Toimittajan asiakkaana sekä antaa yleisluontoinen kuvaus Toimeksiantojen sisällöstä ja palveluista.

6. Materiaalin säilyttäminen

Toimittaja säilyttää ja hoitaa huolellisesti hallussaan olevaa Asiakkaan omaisuutta ja materiaalia Asiakkaan lukuun aktiivisen sopimuskauden ajan.

Sopimuksen päättyessä Toimittajalla ei ole velvollisuutta säilyttää Asiakkaan dataa palvelimillaan.

7. Työn hyväksyntä, reklamaatio ja vastuunrajoitus

Toimittaja ilmoittaa Asiakkaalle sivuston valmistumisesta. Mikäli Asiakas ei kahden (2) viikon kuluessa valmistumisesta esitä reklamaatiota sivustoon liittyen, katsotaan sivusto hyväksytyksi ja valmistuneeksi. Sen jälkeen toteutettavat, Asiakkaan aloitteesta annettavat muutostyöt laskutetaan Toimittajan voimassa olevan tuntiveloituksen mukaisesti.

Sopijapuolet tekevät muut mahdolliset huomautukset ja valitukset kohtuullisessa ajassa syyn havaittuaan tai siitä, kun syy olisi normaalilla huolellisuudella pitänyt havaita. Toimittaja reklamoi mainosmedioille tai alihankkijoille Asiakkaan puolesta tämän sopimuksen osalta.

Sopijapuolet noudattavat lainsäädäntöä, hyvää kauppatapaa ja mainontaa koskevia, Suomessa hyväksyttyjä Kansainvälisen kauppakamarin (ICC) sääntöjä. Toimittaja vastaa siitä, että projekti ja sen lopputulos ovat tämän Sopimuksen ja yhteyshenkilöiden antamien ohjeiden ja päätösten mukaisia.

Asiakas vastaa sivustolla julkaistavasta tekstisisällöstä, kuva-aineistoista, tiedoista sekä niihin liittyvistä tekijänoikeuksista ja oikeellisuudesta myös sivuston julkaisun jälkeen. Toimittaja ei vastaa sivuston sisällöstä, tekoälyn tuottamista teksteistä tai niissä mahdollisesti olevista asiavirheistä millään tavalla.

Sopijapuoli on vastuussa toiselle Sopijapuolelle aiheutuvista välittömistä vahingoista, jotka johtuvat Toimeksiannon olennaisista virheistä tai laiminlyönneistä. Vastuunrajoitus koskee nimenomaan välittömiä vahinkoja, eikä Sopijapuoli ole vastuussa liikevaihdon vähenemisestä, muusta tulon menetyksestä, saamatta jääneestä voitosta tai mistään muustakaan välillisestä vahingosta. Sopijapuolen vastuu rajoittuu kaikissa tapauksissa enintään Asiakkaan palvelusta maksamaan summaan voimassa olevan tilausjakson osalta koskien sitä Toimeksiantoa, johon vahinko kohdistuu ja jossa se ilmenee.

Vahingonkorvausta on vaadittava kirjallisesti yhden kuukauden kuluessa vahingonkorvausvaatimuksen perusteena olevan virheen havaitsemisesta tai siitä, kun virhe olisi pitänyt havaita.

8. Kolmansien osapuolten palvelut ja ylivoimainen este (Force Majeure)

Palvelu hyödyntää kolmansien osapuolten teknologioita (kuten Google Gemini AI, Stripe, WordPress-lisäosat ja nimipalvelut). Toimittaja ei vastaa kolmansien osapuolten palvelukatkoista, rajapintamuutoksista tai verkkohyökkäyksistä aiheutuvista haitoista.

Kumpikaan osapuoli ei vastaa viivästyksistä tai vahingoista, jotka johtuvat sen vaikutusmahdollisuuksien ulkopuolella olevasta ylivoimaisesta esteestä (Force Majeure).

9. Tietosuoja

Toimittaja käsittelee Asiakkaan antamia henkilötietoja voimassa olevan tietosuojalainsäädännön (GDPR) sekä Powerpandan tietosuojaselosteen mukaisesti.

Tekoälyn sivustolle luoma tietosuojaseloste toimii pohjana, ja Asiakas on velvollinen tarkistamaan tietosuojaselosteen heti sivuston julkaisun jälkeen sekä tekemään siihen oman toimintansa kannalta oleelliset korjaukset ja täydennykset.

Ota yhteyttä