0

HTML pieejamības auditors

Ielīmējiet neapstrādātu HTML un iegūstiet īstu WCAG pieejamības auditu: ar rokām izveidots DOM staigātājs pārbauda attēlus, veidlapu etiķetes, virsrakstu secību un saites tekstu, kā arī īstu relatīvā spilgtuma kontrasta koeficienta kalkulatoru, kas novērtēts pret reālajiem AA/AAA sliekšņiem — nav ārējas bibliotēkas, nekas nekur netiek nosūtīts.

Atsevišķs kontrasta pārbaudītājs

Tieši pārbaudiet jebkuru priekšplāna/fona krāsu pāri — hex, rgb(), hsl() vai nosaukta krāsa, piemēram, “tomāts”, viss darbojas.

Buy Me a Coffee at ko-fi.com
Notiek apstrāde... 0%
HTML parsēšana reālā DOM
Ejot pa koku WCAG pārbaudēm
Kontrasta attiecību aprēķināšana
Gatavs

Rezultāts

Lielākā daļa ātrās pieejamības pārbaužu ir vai nu virspusēja atslēgvārdu skenēšana, vai smaga bibliotēka, kurai jāuzticas kā melnajai kastei. Šis rīks izmanto trešo ceļu: tas parsē jebkuru HTML, ko ielīmējat, izmantojot pārlūkprogrammā iebūvēto DOMParser — bez cirvja kodola, bez ārējās pieejamības bibliotēkas, nekas nav lejupielādēts — un pēc tam pāriet uz iegūto DOM koku ar roku rakstītu pārbaužu kopu, kas atspoguļo parastos, reālos WCAG 2.1 kļūmju modeļus. Tas nozīmē, ka loģika ir pilnībā pārbaudāma un audits pilnībā darbojas jūsu pārlūkprogrammā: ielīmētais marķējums un jebkurš pārbaudītais krāsu pāris nekad netiek augšupielādēts vai nosūtīts nekur.

Pārbaudes attiecas uz kļūmēm, kas visbiežāk parādās reālās lapās: <img> elementi bez alt atribūta vispār (īsts WCAG kļūme, kas atšķiras no apzināti tukša alt="", kas tiek izmantota dekoratīviem attēliem, kas ir pareizi atstāta bez karodziņa), veidlapu vadīklas bez palīdzības tehnoloģijām, lai uzzinātu, kam tās ir paredzētas (pārbauda, vai katrs reāls ceļš uz etiķeti — atbilstošs <label> vai iekšienē ir <label>. atribūts aria-label/aria-labelledby), virsrakstu līmeņi, kas pāriet bez brīdinājuma (<h1> tieši uz <h3>, vai dokuments, kurā vispār nav <h1>, vai vairāk nekā viens), saites bez href vai ar neskaidru, ārpus konteksta tekstu, piemēram, "noklikšķiniet šeit" vai "lasīt vairāk", un trūkst lang atribūta, kad tiek ievietots pilns HTML dokuments (nevis tikai fragments).

Izcilais gabals ir īsta kontrasta matemātika, nevis virspusēja heiristiska “izskatās lasāma”. Jebkuram elementam, kam ir iekļauta krāsa un fona krāsa, rīks nolasa abas vērtības, atrisina tos reālos RGB skaitļos, izmantojot paša pārlūkprogrammas CSS programmu (tāpēc hex, rgb(), hsl() un nosauktās krāsas, piemēram, “tomāts”, visas darbojas identiski), un aprēķina precīzu WCAG relatīvo spilgtumu katram — L = 0,2126 × 7 × 1R +2126. 0,0722 × B, katram kanālam vispirms veicot gamma korekciju, izmantojot īsto sRGB pārsūtīšanas līkni — pirms to apvienošanas oficiālajā kontrasta attiecības formulā (gaišāks L + 0,05) / (tumšāks L + 0,05). Paša elementa fonta lielums un fonta svars nosaka, vai tiek piemēroti stingrāki “parastā teksta” sliekšņi vai saudzīgāki “liela teksta” sliekšņi (18 pt+ vai 14 pt+ treknraksts), un rezultāts tiek pārbaudīts, salīdzinot ar visiem četriem reālajiem WCAG skaitļiem vienlaikus: 4,5:1 un 3:1 — AA, 3:7:1 — AA, 3:7:1. sabruka vienā viltotā labā/sliktā spriedumā.

Šī ir apzināti godīga, pragmatiska pilna pieejamības audita apakškopa, nevis sertifikācijas rīks: tajā netiek novērtēta JavaScript vadīta interaktivitāte, ARIA logrīku modeļi, kas pārsniedz pamata etiķetes, tastatūras fokusa secību vai jebkas, kas prasa faktisku lapas renderēšanu un palaišanu. Uztveriet to kā ātru pirmo gājienu, kurā tiek konstatētas dažas no visizplatītākajām un visizplatītākajām WCAG kļūmēm — trūkst alternatīvā teksta, neiezīmēti lauki, bojāta virsrakstu hierarhija, zema kontrasta teksts un neskaidras saites — pirms lapas nosūtīšanas, kā arī (nevis tā vietā) tiek veikta pilnīga manuāla pārskatīšana vai īpašs audita rīks visam, kas tiek piegādāts ražošanā.