Ostajan apulainen -sivuston saavutettavuusseloste
Ostajan apulainen -sivuston saavutettavuusseloste
Svea Development Oy pyrkii takaamaan Ostajan apulainen -verkkosivuston saavutettavuuden Lain digitaalisten palvelujen tarjoamisesta 306/2019 mukaisesti.
Tämä saavutettavuusseloste koskee Ostajan apulainen -sivustoa.
Saavutettavuuden tila
Tämä verkkosivusto täyttää Verkkosisällön saavutettavuusohjeiden (WCAG) 2.1 tason A ja AA vaatimukset osittain. Vaatimusten noudattamatta jättämiset ja vaatimuksiin sovellettavat poikkeukset mainitaan jäljempänä.
Ei-saavutettava sisältö
Sivustolle on tehty saavutettavuusarviointi. Arvion toteutti Svea Development Oy:n pyynnöstä Eficode Oy marraskuussa 2020.
Ei-saavutettava sisältö esitellään kahdessa eri osassa:
- Saavutettavuusongelmat, joita Laki digitaalisten palvelujen tarjoamisesta 306/2019 koskee
- Kohtuuttomasta rasitteesta johtuvat saavutettavuusongelmat
1. Lain 306/2019 noudattamatta jättäminen
Palvelun saavutettavuudessa on joitain ongelmia. Kriittisimmät saavutettavuusongelmat pyritään korjaamaan vuoden 2021 aikana.
Seuraavassa on kuvaus tunnetuista ongelmista. Jos huomaat palvelussa ongelman, joka ei ole luettelossa, ota meihin yhteyttä. Ongelman perässä on mainittu saavutettavuusohjeiston (WCAG) kriteeri, josta ongelma johtuu.
Tekstikontrastit
Tekstin ja taustan välisissä kontrasteissa havaittiin seuraavia puutteita:
- Sivujen pääotsikko (1.8:1)
- Kappalemäärä-teksti (3.54:1)
- Turkoosin painikkeen valkoinen teksti (2.64:1) ja hover-efekti (2.1:1)
- Keskeytä-painikkeen teksti (1.2:1) ja hover-efekti (1.5:1)
- Tummansinisen painikkeen musta teksti hover-efektissä (1.3:1)
- Turkoosit linkit (2.6:1)
- Syy palautukselle -nimilappu, kun valintaruutuun ei ole tehty valintaa (1.2:1)
- Harmaa ohjeteksti Palautushistoria-sivulla (3.5:1)
Käyttöliittymäelementtien kontrastit
Seuraavien käyttöliittymäkomponenttien ja graafisten elementtien kontrasteissa havaittiin puutteita:
- Tuotepainikkeen sininen nuolikuvake (2.6:1)
- Prosessin vaiheesta kertovat ympyräkuvakkeet (2.2:1)
- Pudotusvalikon nuolikuvake (1.4:1)
- Hymiöt palaute-elementissä (2.7:1)
Yhden sivun sovellus
Ostajan apulainen on yhden sivun sovellus (single page application, SPA). Näissä toteutuksissa uusia sivulatauksia ei tapahdu, joten ruudunlukijakäyttäjille tulee antaa erikseen palaute näkymän vaihtumisesta (4.1.3).
Kohdistuksen hallintaan ja vieritykseen tulee myös kiinnittää lisähuomiota. Kohdistuksen ja vierityksen tulisi siirtyä näkymän vaihtuessa aina sivun alkuun, jotta navigointikokemus säilyy johdonmukaisena (2.4.3).
Myös sivujen omien otsikoiden (title) kanssa on ongelmia, sillä yksittäisillä näkymillä on kaikilla sama otsikko, eikä niiden perusteella voi päätellä läpikäymiensä yksittäisten sivujen sisältöä esim. sivuhistoriasta (2.4.2).
Otsikot
Otsikkotason yli on hypätty kokonaan (esim. Palautus ja Reklamaatio -sivujen toisessa näkymässä h2 → h4)
Otsikot on esitetty ainoastaan lihavoiduin tekstein eikä lainkaan HTML-otsikkotyylein (esim. tuotteiden nimet sivupalkissa, jotka aloittavat oman sisältöosionsa sekä Asiakaspalvelu ja Asiakaspalautukset etusivun Yhteystiedot-osiossa)
Viestisi myyjälle-kenttä (ja lisäksi mahdollisia muita kenttiä kuten hinnanalennus) on visuaalisesti omassa osiossaan Palautus- ja Reklamaatio -sivuilla, mutta ruudunlukijakäyttäjälle se kuuluu ikään kuin edellisen otsikon alle, mikä saattaa antaa osion tarkoituksesta väärän kuvan
Nämä puutteet vaikeuttavat sivujen rakenteen ja tietojen keskinäisten suhteiden ymmärtämistä. (WCAG 1.3.1)
Kielimääritys
Palvelun kieli on määritetty suomeksi kaikkiin kieliversioihin <html lang=“fi”>, minkä vuoksi ruudunlukija lukee englanninkielisetkin tekstit suomalaisittain ja esim. kaikki numerot suomeksi. Tämän seurauksena tekstit ovat hyvin vaikeita ymmärtää ruudunlukijakäyttäjälle. (WCAG 3.1.1)
Sisällön kielimääritykset
Valitusta käyttöliittymäkielestä poikkeavalla sisällöllä tulisi olla omat kielimääritteensä. Kuten sivuston kielilinkit (WCAG 3.1.2)
Tekstivastineet
- Logolinkin alt-teksti ei kerro, mille sivulle se vie (alt-arvo on tällä hetkellä “Svea logo”)
- Lisätyn kuvan alt-arvoksi on määritelty “Lähettämääsi kuvaa ei voitu ladata”, mikä antaa siitä täysin väärän kuvan
(WCAG 1.1.1)
Lisärakenteet
- Vasemman palstan ostoksen tiedoissa on käytetty legend+lista -rakennetta (ruudunlukija ei osaa tulkita tällaista elementtiä) (WCAG 1.3.1)
- Historiatiedoissa jokainen päivämääräkohta on oma <dl>-listansa, mikä ei välttämättä ole tarkoituksenmukaista (WCAG 1.3.1)
- Asiakkaan tiedot- ja Palautus/Reklamaatio -listoista puuttuu ympäröivä <dl>-elementti (WCAG 4.1.1)
Haitarielementit
Ruudunlukijakäyttäjälle ei tarjota haitarielementtien statuksesta mitään tietoa, joten käyttäjän on hyvin vaikea ymmärtää, mistä elementeistä on kyse ja onko ne esitetty avattuina vai suljettuina (4.1.2, 4.1.3).
Huom. sarkainselauksella ei pysty kohdistamaan haitarielementteihin tai infokuvakkeeseen nykyisellään lainkaan (2.1.1) ja yksittäisen tuotteen haitaripainike ja infokuvake ovat myöskin nimeämättömiä (4.1.2).
Lomakekenttien nimilaput
Lomakekentillä ei aina ole ohjelmallisesti yhdistettyjä nimilappuja (label). Näitä kenttiä olivat:
- Viestisi myyjälle -kenttä
- Tuotteiden lukumäärän pudotusvalikot
- Tuotteiden valinnan valintaneliöt
(WCAG 1.3.1)
Valintaryhmät
Palvelussa on joitakin toisilleen vaihtoehtoisia tai toisiinsa liittyviä valintoja, joita ei ole määritelty ohjelmallisesti valintaryhmiksi. Näitä olivat esim.:
- Tuotteiden valinta reklamoitaviksi
- Tuotteiden valinta palautettaviksi
- Olen käyttänyt yhtä tai useampaa palauttamistani tuotteista -valinta
(WCAG 1.3.1, 3.3.2, 4.1.2)
Pakolliset kentät
Pakollisia lomakekenttiä ei ole merkitty palvelussa lainkaan.
Käyttäjä saa palautteen pakollisista kentistä vasta virheilmoituksen muodossa.
(WCAG 3.3.2)
Epäselvät rakenteet
Palvelussa havaittiin seuraavia epäselviä rakenteita:
- Keskeytä-painike ilmestyy sivun h1-elementin sisään, mistä johtuen se voi olla erityisen vaikea löytää ruudunlukijalla (se ei välttämättä saa omaa kohdistusta edes elementtiselauksessa). (1.3.1)
- Kuvan liittämistoiminnallisuudessa on puolestaan kaksi kohdistuksen saavaaelementtiä, Liitä kuva -teksti ja Ota kuva tuotteestasi -kuvake. Ruudunlukijan kohdistuksen saa lisäksi näkymätön “Artboard copy 4”-elementti. Kuvakkeen voisi merkitä selvyyden vuoksi ohitettavaksi (molemmat elementit aktivoivat saman toiminnon eri nimestä huolimatta). Liitä kuva -tekstielementin tulisi olla painike (4.1.2).
Erilliset sisältöalueet
Erityisesti korostettuja sisältöjä ei ole korostettu ruudunlukijakäyttäjälle mitenkään, eikä niissä ole käytetty myöskään otsikkotasoa. Näin ollen sisältöä voi olla vaikea löytää ja hahmottaa omaksi kokonaisuudekseen. (WCAG 1.3.1)
HTML-koodin laatu
Puutteet koodissa saattavat aiheuttaa odottamatonta toimintaa apuvälineiltä. Palvelun jokaisella sivulla havaittiin validaattorin avulla HTML-virheitä. (WCAG 4.1.1)
Näppäimistönavigointi
Kaikkiin elementteihin ei pääse navigoimaan pelkkää näppäimistöä käyttäen. Näitä elementtejä ovat esim:
- Kielivalintalinkit
- Keskeytä-linkki
- Haitarielementit
- Kuvan liittämistoiminnallisuus, myös kuvan poistaminen kun se on lisätty (kuva ei saa näppäinkohdistusta)
- Lisätietopainike
WCAG 2.1.1
Sivujen otsikot
Kaikilla sivuilla sama title- attribuutti (WCAG 2.4.2)
Linkkien merkinnät
Linkeissä epäselvät merkinnät (WCAG 2.4.4)
Useampi reitti
Tällä hetkellä navigointi on sivustolla haastavaa ja sivustolle pitäisi lisätä päänavigaatio (WCAG 2.4.5)
Näkyvä kohdistus
Kaikilla elementeillä ei ole näkyvää näppäimistön kohdistusindikaattoria. Kun käyttäjä navigoi pelkkää näppäimistöä käyttäen, hän siis ei aina näe, missä kohdistus on menossa. Esim.
- Painikkeet vaihtavat kohdistettaessa väriä, mutta värimuutos on tuskin havaittavissa
- Olen käyttänyt yhtä tai useampaa palauttamistani tuotteista -valinta ei saa mitään näkyvää kohdistusta
(WCAG 2.4.7)
Linkkien erottuvuus
Linkkien tulisi erottua ympäröivästä leipätekstistä, tavallisesti alleviivauksella ja värillä. Palvelussa havaittiin yksi tapaus, jossa linkki ei erotu lainkaan muusta tekstistä: sähköpostilinkki. (WCAG 3.2.4)
Prosessin etenemiselementti
Tällä hetkellä Palautus- ja Reklamaatio- prosessien etenemiselementti antaa tietoa ainoastaan näkeville käyttäjille (tosin myös kontrasti on puutteellinen, kuten aiemmin mainittu raportissa sivulla Käyttöliittymäelementtien kontrastit).
Elementti tulisi toteuttaa niin, että siitä saa myös ohjelmallisesti tiedon, missä vaiheessa prosessia ollaan menossa. (WCAG 1.3.1)
Huom. testattaessa todettiin myös, että elementti ei ole oikeassa kohdassa sivun lukemisjärjestyksessä: sen tulisi sijaita vasemman palstan jälkeen, ennen pääsisältöä (1.3.2).
Passiiviset painikkeet
Lomakkeilla käytetään passiivisia jatkamispainikkeita palautteena siitä, että pakollisia tietoja on täyttämättä. Passiivinen painike ei ole selkeä palaute, koska käyttäjä ei saa tietää, miksi painike on passiivinen.
Koska pakollisia kenttiä ei ole palvelussa merkitty, puutteellisen kentän tai mahdollisen virheen päättely on käyttäjälle tavallistakin vaikeampaa. Lisäksi ruudunlukijakäyttäjien voi olla vaikea ylipäätään löytää painiketta.
WCAG 1.3.1, 3.3.1, yleinen saavutettavuus
Palaute-elementti
Palaute-elementti ei ole tällä hetkellä saavutettava näppäimistökäyttäjille tai ruudunlukijalle:
- Kohdistus ei siirry modaali-ikkunaan kuten pitäisi. Ruudunlukijalla sen otsikko saa kohdistuksen lukemisjärjestyksessä vasta sivun keskeltä (2.4.3)
- Itse valintaelementit eivät ole painikkeita (vaan <svg>-elementtejä), joten ne eivät saa ruudunlukijan tai näppäimistökohdistusta lainkaan (2.1.1). Käyttäjä ei pysty tekemään valintaa.
- Ikkunaa ei voi sulkea ESC-painikkeella, joten käyttäjä ei voi piilottaa elementtiä näkyvistä. Kohdistus liikkuu allaolevalla sivulla, mutta päällä oleva elementti haittaa näkyvää kohdistusta (2.4.7)
- Näkymätön elementti jää sivulle ruudunlukijan lukemisjärjestyksessä sen jälkeenkin, kun valinta on tehty ja se on pois näkyvistä (1.3.1)
2. Kohtuuton rasite
Palvelussa ei ole saavutettavuusongelmia, joiden korjaamisessa vedotaan kohtuuttomaan rasitteeseen.
Tämän saavutettavuusselosteen laatiminen
Tämä seloste on laadittu 21.01.2021.
Seloste perustuu ulkopuolisen asiantuntijaorganisaation (Eficode Oy) toteuttamaan arviointiin siitä, täyttääkö verkkosivusto Lain digitaalisten palvelujen tarjoamisesta 306/2019 vaatimukset.
Seloste on tarkistettu ja päivitetty viimeksi 21.1.2021.
Palaute ja yhteystiedot
Huomasitko saavutettavuuspuutteen? Voit ilmoittaa siitä meille ja antaa saavutettavuuteen liittyvää palautetta sähköpostiosoitteeseen support.payments@svea.fi.
Ostajan apulainen -sivuston saavutettavuudesta ja palautteiden käsittelystä vastaa Svea Development Oy.
Lain mukaisena valvontaviranomaisena toimii Etelä-Suomen aluehallintovirasto, joka valvoo säädettyjen velvollisuuksien ja vaatimusten noudattamista.
Täytäntöönpanomenettely
Jos huomaat sivustolla saavutettavuusongelmia, anna ensin palautetta sivuston ylläpitäjälle. Vastauksessa voi mennä 14 päivää. Jos et ole tyytyväinen saamaasi vastaukseen tai et saa vastausta lainkaan kahden viikon aikana, voit antaa palautetta Etelä-Suomen aluehallintovirastoon.
Valvontaviranomaisen yhteystiedot
Etelä-Suomen aluehallintovirasto
Saavutettavuuden valvonnan yksikkö
www.saavutettavuusvaatimukset.fi
Ilmoita saavutettavuusongelmasta verkkolomakkeella
puhelinnumero (vaihde) 0295 016 000