Juurdepääsetavuse Inspektor käivitab automaatseid WCAG 2.1 Level AA kontrolle mis tahes veebilehel ja toodab kategoriseeritud aruande juurdepääsetavuse probleemidest. Tuvasta ebapiisavad värvikontrastsuse suhted, puuduvad pildi alt-tekstid, sobimatud ARIA rollid ja atribuudid, puuduvad vormi sildid, klaviatuuriga navigeerimise probleemid ja puuduvad orientiirpiirkonnad — ühe klõpsuga elemendi esiletõstmisega iga leitud probleemi jaoks.
Veebi juurdepääsetavus ei ole valikuline — see on paljudes jurisdiktsioonides seaduslik nõue ja oluline 15% maailma elanikkonnale, kes elab puuetega. Kuid juurdepääsetavuse probleemid on tavapärase arenduse ja testimise ajal nähtamatud. Nupp võib näha hea välja, kuid olla ekraanilugejatele täiesti juurdepääsmatu, kuna see on stiliseeritud div ilma rolli atribuudita. Tekst võib sulle loetav olla, kuid ei läbi kontrastsuse nõudeid nägemisprobleemiga kasutajatele. Juurdepääsetavuse Inspektor toob need nähtamatud probleemid automaatselt esile. See kontrollib kümneid WCAG 2.1 Level AA kriteeriume, sh värvikontrastsuse suhteid (minimaalne 4,5:1 normaalse teksti jaoks, 3:1 suure teksti jaoks), puuduvat alt-teksti piltidel, puuduvaid silte vormi sisenditele, ebasobivaid ARIA rolle ja atribuute, puuduvaid dokumendi orientiire (nav, main, footer) ja klaviatuuri fookuse indikaatoreid. Iga probleem sisaldab mõjutatud elementi, rikutud spetsiifilist WCAG kriteeriumi ja soovitust, kuidas seda parandada. Klõpsa mis tahes probleemil, et tõsta esile element lehel.
Käivitab automaatseid kontrolle WCAG 2.1 Level AA edukuskriteeriumite vastu, sh tajutavuse, kasutatavuse, mõistetavuse ja robustsuse kategooriad. Iga kontroll näitab spetsiifilist kriteeriumi (nt 1.4.3 Kontrastsus, 1.1.1 Mittekustutuste Sisu) ja läbimise/ebaõnnestumise staatust.
Arvutab kontrastsuse suhte teksti ja taustavärvi vahel iga tekstielemendi jaoks lehel. Märgistab elemendid alla 4,5:1 normaalse teksti jaoks või 3:1 suure teksti jaoks (18px+ või 14px+ paks). Näitab tegelikku suhet ja nõutavat miinimumsuhtet.
Skannib iga img, svg ja image rolli elementi. Märgistab puuduvad alt-atribuudid, tühjad alt-id mittedekooratiivsetel piltidel ja liiga üldised alt-tekstid ("pilt", "foto"). Soovitab, kas iga pilt vajab kirjeldavat alt-teksti, tühja alt-teksti (dekoratiivne) või role="presentation".
Kontrollib ebasobivat ARIA rolli kasutust (rollid valedel elementidel), puuduvaid nõutavaid ARIA atribuute (nt aria-label ikooni nuppudel), duplikaatseid ID-sid, millele viidatakse aria-labelledby kaudu, ja puuduvaid orientiirpiirkondi (pole main, pole nav). Soovitab semantilisi HTML alternatiive.
Tagab, et igal vormi sisendil (tekst, e-post, parool, märkeruut, valik) on seotud silt — kas sildi elemendi kaudu vastava for/id, aria-label või aria-labelledby kaudu. Sildistamata sisendid on ekraanilugejatele juurdepääsmatud.
Probleemid kategoriseeritakse Vigadeks (peab parandama — juurdepääsu tõkked), Hoiatusteks (peaks parandama — potentsiaalsed tõkked) ja Läbinuteks (kinnitatud juurdepääsetav). Vigade arv kuvatakse prominentselt. Klõpsa mis tahes probleemil, et tõsta esile mõjutatud element lehel.
Enne uue lehe või funktsiooni käivitamist käivita Juurdepääsetavuse Inspektor, et probleemid varakult tabada. Puuduv alt-tekst, sildistamata vormi väljad ja kontrastsuse rikkumised on arenduse ajal lihtsad parandada, kuid tootmises avastamine on kulukas.
Paljud jurisdiktsioonid nõuavad WCAG 2.1 Level AA vastavust (ADA USA-s, EAA EL-is). Käivita inspektor oma avalike lehtede peal, et tuvastada vastavuse lüngad enne, kui need muutuvad õiguslikeks riskideks.
Lisa juurdepääsetavuse kontroll oma QA protsessi osana. Pärast visuaalset QA-d ja funktsionaalset testimist käivita Juurdepääsetavuse Inspektor, et kontrollida, kas rakendamine ei too sisse juurdepääsetavuse taandarenguid.
Käivita inspektor oma praegusel saidil meeskonnakoosolekul, et näidata reaalseid juurdepääsetavuse probleeme. Visuaalne esiletõstmine ja selged selgitused aitavad arendajatel mõista, milline näeb välja juurdepääsetav märgistus ja miks see on oluline.
Auditeeri lehti, mis sisaldavad kolmanda osapoole vidinaid, manustatud sisu või kasutajate loodud HTML-i. Need allikad toovad sageli sisse juurdepääsetavuse probleeme (puuduv alt-tekst, kontrastsuse rikkumised), mille eest oled siiski vastutav lehe omanikuna.
Ava DevSuite Pro ujuv dokk ja klõpsa Juurdepääsetavuse Inspektori ikoonil. Tööriist skannib lehe DOM-i juurdepääsetavuse probleemide jaoks.
Ilmub kategoriseeritud aruanne vigadega (punane), hoiatustega (kollane) ja läbinutega (roheline). Iga sektsioon loetleb konkreetsed probleemid koos mõjutatud elementide ja WCAG kriteeriumite viidete.
Klõpsa mis tahes probleemil, et tõsta esile mõjutatud element lehel värvitud äärised ja kerida selleni. Ühendus aruande ja DOM elemendi vahel on kohene.
Iga probleem sisaldab konkreetset soovitust: "Lisa alt-tekst, mis kirjeldab pildi sisu", "Suurenda fondi värvi kontrastsust vähemalt 4,5:1-ni", "Lisa sildi element koos for='email'".
Tee muudatused oma koodis, laadi leht uuesti ja käivita audit uuesti. Vigade arv peaks vähenema, kui probleemid lahendatakse. Sihtige nullvigu.
Paigaldage DevSuite Pro tasuta ja avage 39+ arendustööriista oma brauserile.
