Mis on veebi juurdepääsetavus? WCAG ja kaasav disain selgitatuna

Veebi juurdepääsetavus tähendab veebisaitide ja rakenduste ehitamist nii, et puuetega inimesed saaksid neid kasutada — olgu nad pimedad ja kasutavad ekraanilugejat, ei saa hiirt kasutada, on nägemispuudega või värvipimedad, kurdid või on neil kognitiivsed või õpiraskused. Praktikas taandub see sellistele asjadele nagu pildialternatiivid, piisav värvikontrast, korralikult märgistatud vormid ja kõik toimib ainult klaviatuuriga. Selle rahvusvaheline standard on WCAG, W3C veebisisu juurdepääsetavuse juhised.

Juurdepääsetavust lühendatakse sageli a11y-ks — „a“, siis 11 tähte, siis „y“.

Miks juurdepääsetavus AI-ga ehitamisel oluline on

AI rakenduste ehitajad on head rakenduste tootmisel, mis näevad õiged välja. Juurdepääsetavus puudutab peamiselt seda, mida ekraanipildilt ei näe: kas nupp on päriselt nupp, kas sisendväljal on silt, mida ekraanilugeja suudab välja öelda, kas menüüni saab Tab-klahviga jõuda.

Seepärast on oluline küsida:

• Seda on lihtne märgata. Kohandatud stiilis rippmenüü võib välja näha täiuslik ja olla hiireta kasutamatu. Sa ei märka seda, kui ei testi.
• Varakult õigesti tegemine on odavam. Juurdepääsetavate komponentide küsimine esimesest päringust maksab peaaegu midagi. Valmis rakenduse parandamine tähendab iga ekraani puudutamist.
• See aitab kõiki. Subtiitrid aitavad inimesi mürarikkas keskkonnas, hea kontrast aitab telefonikasutajaid päikese käes ja selged sildid aitavad kõiki vorme kiiremini täita.
• See kattub SEO-ga. Korralikud pealkirjad, kirjeldavad lingid ja alt-tekstid aitavad ka otsingumootoritel sinu lehti mõista — vaata AI-ehitatud veebisaitide SEO.
• Võib olla nõutud. Sõltuvalt sellest, kus tegutsed ja keda teenindad, võib juurdepääsetavus olla seaduslik kohustus.

Igapäevane võrdlus

Mõtle hoone sissepääsule.

Trepp sobib paljudele inimestele. Kaldtee sobib ratastooli kasutajatele — ja ka lapsevankritega vanematele, kaubakärudega kulleritele ja kohvritega reisijatele. Automaatuksed, selged sildid, liftinuppudel pimedatähed ja hea valgustus eemaldavad igaühe jaoks mingi takistuse.

Veebi juurdepääsetavus on sama idee digiruumide jaoks: sinu rakenduse kaldteed, sildid ja käsipuud. Ja nagu hoones, on kaldtee plaanidesse lisamine palju lihtsam kui see pärast betooni tahkumist lisada.

WCAG lühidalt

WCAG-i avaldab W3C veebi juurdepääsetavuse algatus. Praegune versioon on WCAG 2.2, mis avaldati esmakordselt 2023. aasta oktoobris. See on tagasiulatuvalt ühilduv: WCAG 2.2-le vastav sisu vastab ka 2.1-le ja 2.0-le ning W3C soovitab kasutada viimast versiooni. WCAG 2.2 on kinnitatud ka rahvusvahelise standardina ISO/IEC 40500:2025. Väga erinev WCAG 3 on arendamisel varajase mustandina, mitte valmis standardina.

WCAG on korraldatud nelja põhimõtte järgi, mida sageli meeldetuletamiseks nimetatakse POUR-iks:

Iga juhend sisaldab testitavaid edukuskriteeriume kolmel tasemel:

• Tase A — miinimum. Nende nurjumine blokeerib mõned inimesed täielikult.
• Tase AA — tavapärane sihttase, mida enamik seadusi ja poliitikaid silmas peab.
• Tase AAA — kõrgeim tase. Kohati kasulik sihtida, kuid W3C ei soovita nõuda seda terve saidi jaoks, sest osa sisu ei suuda seda täita.

WCAG 2.2 lisas 2.1-le üheksa edukuskriteeriumi, sealhulgas Sihtmärgi suurus (miinimum) tasemel AA — klõpsatavad sihtmärgid peaksid üldiselt olema vähemalt 24 x 24 CSS-pikslit, erandidega — ja Juurdepääsetav autentimine (miinimum), mis piirab sisselogimisetappe, mis nõuavad mälu või pusle lahendamist, näiteks parooli uuesti sisestamist ilma, et seda võiks kleepida. Samuti eemaldas see vanaaegse „Parsing“ kriteeriumi, kuna see on aegunud.

Töönäide: registreerimisvorm

Siin on registreerimisvorm, mida AI võib luua, ja mida juurdepääsetavuse kontroll leiab:

Ükski neist parandustest ei muuda vormi välimust palju. Kõik need muudavad aga seda, kas mõned inimesed saavad seda üldse kasutada.

Põhimõisted

Levinud väärarusaamad

• „Juurdepääsetavus on oluline ainult pimedatele kasutajatele.“ See hõlmab nägemis-, motoorseid, kuulmis-, kõne- ja kognitiivseid puudeid, samuti ajutisi olukordi nagu murtud käsi.
• „Juurdepääsetavad saidid näevad igavad välja.“ Juurdepääsetavus piirab mõnda asja — kontrasti, fookusstiile, teksti suurust —, kuid hea välimusega juurdepääsetavad saidid on pigem reegel kui erand.
• „Automaatne kontroll näitab 100, seega oleme valmis.“ Automaattööriistad leiavad ainult osa probleemidest. Kas alt-tekst on tõesti mõtestatud või kas voog on ekraanilugejaga mõistlik, vajab inimese kontrolli.
• „Ülekatte vidin muudab meid vastavaks.“ Peale kinnitatud tööriistariba ei saa parandada puuduvaid silte ega katkist klaviatuuriligipääsu sinu koodis. Paranda allikas.
• „Meil pole puudega kasutajaid.“ Sa võid lihtsalt mitte teada. Paljud puuded ei ole nähtavad ja inimesed, kes takistusele satuvad, lahkuvad tavaliselt lihtsalt.

Mida paluda AI-ehitajalt

• „Ehita see vastavaks WCAG 2.2 tasemele AA.“
• „Kasuta semantilist HTML-i: päris nupud, lingid, pealkirjad järjekorras ja sildid igal vormiväljal.“
• „Veendu, et iga interaktiivne element töötab ainult klaviatuuriga ja sellel on nähtav fookusstiil.“
• „Kontrolli kõigi tekstide ja ikoonide värvikontrasti — 4,5:1 tavalisele tekstile, 3:1 suurele tekstile ja ikoonidele.“
• „Lisa informatiivsetele piltidele mõtestatud alt-tekst ja dekoratiivsetele tühi alt-tekst.“
• „Näita vormi vigu tekstina, mis on seotud väljaga, mitte ainult värvi kaudu.“
• „Arvesta kasutaja vähendatud liikumise seadistust animatsioonide puhul.“
• „Käivita automaatne juurdepääsetavuse kontroll ja loetle, mida see ei suuda testida, et saaksin selle käsitsi üle vaadata.“

Siis testi ise: pane hiir kõrvale ja proovi oma peamist voogu lõpule viia ainult klahvidega Tab, Shift+Tab, Enter ja tühik. Proovi telefoni sisseehitatud ekraanilugejat pealehel. Suurenda brauseri vaadet 200%-ni ja vaata, kas midagi puruneb.

Juurdepääsetavus Mythexis

Mythex ei sisalda pühendatud juurdepääsetavuse kontrollijat, seega käsitle juurdepääsetavust osana oma päringutest ja testimisest. Palu WCAG 2.2 AA juba esimesest päringust, kontrolli tulemust eelvaates klaviatuuriga ning kasuta /test, et agent klikiks läbi sinu peamised voog enne avaldamist — vaata Rakenduse testimine. Ka SEO retsept palub semantilisi pealkirju ja mõtestatud alt-tekste, mis teenivad mõlemat eesmärki.

Praktilise kontrollnimekirja jaoks vaata kuidas teha oma veebisait juurdepääsetavaks. Disaini kohta loe kuidas AI-ga hea välimusega rakendust disainida ning enne käivitamist kuidas testida rakendust enne käivitamist. W3C-i enda WCAG ülevaade on autoriteetne allikas.

Küsimused