Kako preizkusiti dostopnost: brezplačna orodja in ročni pregledi

Tole zgodbo slišimo pogosto. Nekdo zažene Lighthouse, dobi zeleno oceno 100 za dostopnost in gre naprej. Teden pozneje stranka piše, da ni mogla plačati, ker obrazca za kartico ni mogoče doseči s tipkovnico. Res je oboje. Samodejno preverjanje je bilo uspešno, spletno mesto pa je resnično osebo vseeno pustilo na cedilu.

Ta vodnik pokaže, kako pravilno preizkušati z majhnim proračunom: katera brezplačna orodja zagnati, 15-minutno rutino ročnih preverjanj, prvi poskus z bralnikom zaslona in kdaj se splača plačati strokovni pregled.

Ali mi samodejni preverjevalnik lahko pove, ali je moje spletno mesto dostopno?

Ne. Samodejni preverjevalniki hitro najdejo nekaj težav, na številna vprašanja o dostopnosti pa lahko odgovori le človek. Ko je britanska vladna digitalna služba (Government Digital Service) preizkusila 10 orodij na strani s 143 znanimi napakami, je najboljše našlo 41 %. W3C pove naravnost: orodja za vrednotenje „ne morejo določiti dostopnosti, lahko pri tem le pomagajo.“

Preizkus GDS (odpre se v novem zavihku) je iz februarja 2017, njegovih 41 % (Asqatasun) pa je vključevalo tudi pozive orodja k ročnim preverjanjem. Orodja so se od takrat izboljšala, vrzel pa ima isti vzrok. Programska oprema lahko ugotovi, da slika nima nadomestnega besedila. Ne more pa ugotoviti, da je „rdeča obleka“ napačen opis fotografije modre moške obleke ali da je vrstni red fokusa smiseln.

Preverjevalnik zato obravnavajte kot dimni detektor, ne kot temeljit pregled stavbe. Zagnati ga je vseeno vredno: WebAIM Million 2026 (odpre se v novem zavihku) je zaznavne napake našel na 95,9 % milijona najbolj obiskanih domačih strani, zato lahko večina spletnih mest hitro marsikaj izboljša. Kot pravi vodnik W3C za izbiro orodij (odpre se v novem zavihku): „Potrebna je človeška presoja.“

Katera brezplačna orodja za preizkušanje dostopnosti naj uporabim?

Uporabite enega ali dva samodejna preverjevalnika, preverjevalnik kontrasta in bralnik zaslona. Orodja uporabljajo različna pravila in rezultate poročajo različno, zato dva preverjevalnika običajno ujameta več kot eden. Vsako spodnje orodje ima brezplačno različico. Preden se nanj zanesete, preverite trenutne pogoje, saj se imena, funkcije in cene spreminjajo.

Kaj lahko ročno preverim v 15 minutah?

Kar veliko. W3C-jeva Easy Checks (odpre se v novem zavihku) zajemajo naslove strani, nadomestno besedilo, naslove v besedilu, kontrast, povezave za preskok, viden fokus tipkovnice, jezik strani, povečavo, podnapise in oznake obrazcev. Izberite eno pomembno stran, na primer stran izdelka ali obrazec za rezervacijo, in vsakemu preverjanju namenite minuto ali dve. Našli boste stvari, o katerih ne poroča noben preverjevalnik.

W3C pravi, da ta preverjanja „zajemajo le nekaj težav z dostopnostjo“, zato niso celovita ocena. Kljub temu je to najbolje porabljena četrt ure:

1. Naslov strani (1 minuta). Ali zavihek brskalnika pove, kaj je stran, na primer „Rezervacija mize | Rozina kuhinja“, namesto povsod „Domov“?
2. Slike (2 minuti). Prikažite nadomestno besedilo z WAVE ali podobnim orodjem. Je točno? Ali se okrasne slike preskočijo?
3. Naslovi (2 minuti). Izpišite naslove in jih preberite same zase. Ali delujejo kot kazalo vsebine?
4. Kontrast (2 minuti). Preverite osnovno besedilo, drobno sivo besedilo, besedilo na gumbih in besedilo na slikah.
5. Tipkovnica (4 minute). Odložite miško in se s tipko Tab pomikajte po strani (glejte naslednji razdelek).
6. Povečava (2 minuti). Ali pri 200 % in nato 400 % še vedno lahko vse preberete in uporabljate meni brez vodoravnega drsenja?
7. Obrazci in jezik (2 minuti). Kliknite oznako vsakega polja; v dobro izdelanem obrazcu se kazalec postavi v polje. V poročilu orodja preverite, ali je jezik strani naveden.

Kako preizkusim s tipkovnico?

Odložite miško. S tipko Tab se pomikate naprej, s Shift+Tab nazaj, z Enter odprete povezave, s preslednico ali Enter pritisnete gumbe, s puščicami pa se premikate po menijih in izbirnih gumbih. Vsak interaktivni element mora biti dosegljiv, vedno morate videti, kje ste, in nikoli se ne smete zatakniti.

Na Macu Safari ob pritisku tipke Tab preskakuje povezave, dokler v njegovih naprednih nastavitvah ne vklopite možnosti „Press Tab to highlight each item on a webpage“ (s tipko Tab označi vsak element na spletni strani). Nato preverite:

• Ali vedno vidite, kje ste? Če obroba fokusa izgine, se uporabnik tipkovnice izgubi.
• Je vrstni red logičen? Fokus naj sledi vrstnemu redu branja.
• Je kaj prekrito? Pripeta glava ali pasica s piškotki, ki skrije element s fokusom, krši merilo Fokus ni zakrit (Focus Not Obscured) v WCAG 2.2.
• Ali lahko spet odidete? Odprite vsak meni, pojavno okno in izbirnik datuma ter jih poskusite zapustiti. Escape naj zapre pogovorna okna.
• Ali deluje celotna pot? Brez miške dodajte izdelek, spremenite količino, uveljavite kodo za popust in pridite do plačila.

Vsako napako zapišite natančno: „Izbire velikosti na strani izdelka ni mogoče odpreti s tipko Enter ali preslednico“ bo popravljena veliko hitreje kot „tipkovnica ne deluje“.

Kako prvič preizkusim z bralnikom zaslona?

Začnite z bralnikom zaslona, ki ga vaša naprava že ima, ali z NVDA v sistemu Windows, in poslušajte eno stran. Ne poskušate ga uporabljati kot strokovnjak. Preverjate, ali so naslovi, povezave, gumbi, slike in polja obrazcev prebrani s smiselnimi imeni in ali nič pomembnega ne ostane tiho.

• Mac: Command+F5 vklopi in izklopi VoiceOver; Control+Option+U odpre rotor, seznam naslovov, povezav in kontrolnikov obrazcev.
• Windows: v NVDA s tipko H skačete med naslovi, z Insert+F7 pa odprete seznam povezav in naslovov.
• Telefon: vklopite VoiceOver (iPhone) ali TalkBack (Android) in podrsajte desno, da se premikate od elementa do elementa. Najprej se naučite, kako ga izklopiti.

Prisluhnite temu, kar je najpomembnejše. V WebAIM-ovi anketi med uporabniki bralnikov zaslona iz leta 2024 (odpre se v novem zavihku) je 71,6 % anketirancev povedalo, da se po dolgi strani najprej pomikajo po naslovih, zato začnite tam. Nato prikličite seznam povezav: pet povezav „Preberi več“ nikomur ne pove ničesar. „Dodaj v košarico, temno modri pulover“ je uporaben gumb, „gumb“ pa ne. Na koncu izpolnite obrazec in preverite, ali sta vsako polje in vsaka napaka prebrana.

Sklepe delajte previdno. Če se vam zdi, da ne deluje, verjetno res ne; če se zdi v redu, to še ni dokaz. Kako dejansko delajo izkušeni uporabniki, preberite v članku kako osebe z invalidnostjo uporabljajo splet.

Kako preverim povečavo, prerazporeditev in razmik besedila?

Povečajte brskalnik na 200 % in preverite, ali se besedilo poveča, ne da bi bilo odrezano ali se prekrivalo. Nato preizkusite prerazporeditev: pri 400-odstotni povečavi v oknu širine 1.280 pikslov se mora vsebina prilegati brez vodoravnega drsenja. Na koncu povečajte razmik med črkami, besedami, vrsticami in odstavki ter preverite, da se nič ne pokvari ali izgine.

To ustreza merilom WCAG Sprememba velikosti besedila (Resize Text, 1.4.4), Prerazporeditev (Reflow, 1.4.10) (odpre se v novem zavihku) in Razmik besedila (Text Spacing, 1.4.12) (odpre se v novem zavihku). Merilo prerazporeditve uporablja širino 320 pikslov CSS, kar je po navedbah W3C „enakovredno začetni širini vidnega polja 1280 pikslov CSS pri 400-odstotni povečavi“. Merilo razmika besedila zahteva, da se nič ne izgubi, ko bralec nastavi višino vrstice na 1,5-kratnik velikosti pisave, razmik za odstavki na 2-kratnik, razmik med črkami na 0,12-kratnik in razmik med besedami na 0,16-kratnik.

Zaznamek za razmik besedila (bookmarklet), majhen skript, shranjen kot zaznamek, z enim klikom uveljavi vse štiri vrednosti. Iščite besedilo, ki se razliva iz gumbov, in oznake, odrezane ob robu. Pri 400-odstotni povečavi prenosnik prikaže približno toliko kot majhen telefon, zato dobro izdelano odzivno spletno mesto večino tega že izpolnjuje.

Kako preverim obrazce, napake in zaključek nakupa?

Vsak pomemben obrazec izpolnite trikrat: enkrat pravilno, enkrat z vsemi polji praznimi in enkrat z namernimi napakami. Vsako polje mora imeti vidno oznako, vsaka napaka mora biti pojasnjena z besedami ob svojem polju, v polja za geslo in potrditveno kodo pa mora biti mogoče lepiti.

• Napake. Rdeče obarvan napis „Neveljaven vnos“ ni dovolj. „Vnesite datum veljavnosti v obliki MM/LL“ ob polju je dovolj. Po oddaji naj se fokus premakne na povzetek napak ali na prvo polje s težavo.
• Prijave in kode. Po merilu dostopnega preverjanja pristnosti (odpre se v novem zavihku) v WCAG 2.2 blokiranje lepljenja ali upraviteljev gesel ne ustreza, razen če obstaja drug način prijave.
• CAPTCHA in časovne omejitve. Uporabniki bralnikov zaslona so v WebAIM-ovi anketi CAPTCHA označili za najbolj problematičen element na spletu. Preverite, ali obstaja dostopna alternativa in ali je časovne omejitve mogoče podaljšati.

Naš kontrolni seznam za dostopnost spletnega mesta vsebuje popolnejši seznam za trgovine, vključno s pasicami s piškotki in pojavnimi okni.

Kaj vključuje strokovni pregled dostopnosti in kdaj ga potrebujem?

Pregled dostopnosti je strukturiran pregled, ki ga strokovnjak opravi po določenem standardu, običajno WCAG 2.1 ali 2.2 na ravni AA. Združuje samodejne preglede z ročnim preizkušanjem in preizkušanjem s podporno tehnologijo na vaših ključnih predlogah in poteh, konča pa se s poročilom, v katerem so naloge razvrščene po prednosti. Potrebujete ga, ko za vas velja zakon, pred večjo objavo ali ko stranke zahtevajo dokaze.

Preden se dogovorite za ceno, vprašajte:

• Po katerem standardu, različici in ravni boste preizkušali?
• Katere predloge in poti so vključene? Za trgovino: domača stran, kategorije, izdelek, košarica, zaključek nakupa, strani računa in obrazci.
• Ali preizkušate ročno z bralniki zaslona, tipkovnico in povečavo ter v katerih brskalnikih in na katerih napravah?
• Ali poročilo težave razvrsti po resnosti, navede, kje so, in predlaga popravke?
• Ali je vključen ponovni preizkus?

Cene se zelo razlikujejo glede na ponudnika, državo in obseg, zato primerjajte, kaj je vključeno. Če za vas velja Evropski akt o dostopnosti, pregled podpre tudi vašo javno izjavo; naš vodnik po Evropskem aktu o dostopnosti pojasnjuje, za koga velja.

Zakaj preizkušati z uporabniki z invalidnostjo?

Ker izpolnjevanje standarda in enostavnost uporabe nista isto. Zaključek nakupa lahko izpolni vsako merilo WCAG in uporabniku bralnika zaslona vseeno vzame dvajset minut. W3C pravi, da vrednotenje z uporabniki z invalidnostjo „odkrije težave z uporabnostjo, ki jih samo vrednotenje skladnosti ne odkrije“, vaši ekipi pa pokaže, kako ljudje spletno mesto dejansko uporabljajo.

Laboratorija ne potrebujete. Nekaj preizkusov vašega najpomembnejšega opravila, na primer iskanju izdelka in plačilu, vas bo naučilo več kot še en krog samodejnih pregledov. Udeležence poiščite prek invalidskih organizacij, raziskovalnih agencij ali med svojimi strankami in jim plačajte porabljeni čas. Naj uporabljajo svoje naprave in nastavitve. Vodnik W3C o vključevanju uporabnikov v vrednotenje (odpre se v novem zavihku) opisuje praktično plat.

Kaj naj naredim z rezultati?

Težave razvrstite po tem, kako močno ovirajo ljudi in kje se pojavljajo, popravite jih v kodi in vsebini samega spletnega mesta, ponovno preizkusite in zabeležite, kar še ni rešeno. Neoznačeno polje v zaključku nakupa je pomembnejše od zdrsa pri kontrastu v nogi, popravek v skupni predlogi pa popravi vsako stran, ki jo uporablja.

1. Določite prednost. Najprej ovire na ključnih poteh (zaključek nakupa, rezervacija, registracija), nato skupne predloge, nato posamezne strani.
2. Popravite pri izvoru. Spremenite temo, komponento ali vsebino in ne odpravljajte le simptomov.
3. Ponovno preizkusite. Ponovite ista preverjanja, ročno in z orodji.
4. Dokumentirajte. Znane težave z datumi navedite v svoji izjavi o dostopnosti. Novejša merila pojasnjuje naš vodnik po WCAG 2.2.
5. Ponavljajte. Vsaki novi izdaji dodajte preverjanje s tipkovnico in samodejni pregled.

Če uporabljate pripomoček za dostopnost, tudi naš, preizkušajte z zaprtim pripomočkom. Plošča, kot je SiteAccessible, obiskovalcem ponudi dodatne načine za prilagoditev strani, WCAG pa sprašuje, ali stran deluje v privzetem stanju. Nekatere sheme pregledov ne ocenjujejo strani, na katerih deluje skript prekrivne rešitve, zato se najprej posvetujte s pregledovalcem.