HTML-toegankelijkheidsauditor

De meeste snelle toegankelijkheidscontroles zijn een oppervlakkige trefwoordscan of een zware bibliotheek die u als een zwarte doos moet vertrouwen. Deze tool neemt een derde pad: het ontleedt alle HTML die je plakt met behulp van de ingebouwde DOMParser van de browser (geen axe-core, geen externe toegankelijkheidsbibliotheek, niets gedownload) en doorloopt vervolgens de resulterende DOM-boom met een reeks handgeschreven controles die veelvoorkomende, echte WCAG 2.1-foutpatronen weerspiegelen. Dat betekent dat de logica volledig inspecteerbaar is en dat de audit volledig in uw browser wordt uitgevoerd: de markeringen die u plakt en elk kleurenpaar dat u test, worden nooit geüpload of ergens naartoe verzonden.

De controles hebben betrekking op de fouten die het vaakst voorkomen op echte pagina's: <img> elementen zonder alt-attribuut (een echte WCAG-fout, verschillend van de opzettelijk lege alt="" die wordt gebruikt voor decoratieve afbeeldingen, die correct niet is gemarkeerd), formulierbesturingselementen zonder manier waarop hulptechnologie weet waarvoor ze dienen (gecontroleerd aan de hand van elk echt pad naar een label - een overeenkomend <label for>, verpakt in een <label>, of een aria-label/aria-labelledby-attribuut), kopniveaus die zonder waarschuwing springen (een <h1> rechtstreeks naar een <h3>, of een document zonder <h1> helemaal, of meer dan één), links zonder href of met vage, buiten de context staande tekst zoals "klik hier" of "lees meer", en een ontbrekend lang-attribuut wanneer een volledig HTML-document (niet alleen een fragment) erin wordt geplakt.

Het opvallende stuk is echte contrastwiskunde, en geen oppervlakkige ‘lijkt leesbaar’-heuristiek. Voor elk element met een inline-kleur en achtergrondkleur leest de tool beide waarden, zet ze om in echte RGB-getallen via de eigen CSS-engine van de browser (dus hex, rgb(), hsl() en benoemde kleuren zoals 'tomaat' werken allemaal identiek), en berekent de exacte WCAG-relatieve luminantie voor elk - L = 0,2126×R + 0,7152×G + 0,0722×B, waarbij elk kanaal eerst gamma-gecorrigeerd wordt met behulp van de echte sRGB-overdrachtscurve – voordat ze worden gecombineerd tot de officiële contrastverhoudingsformule (lichtere L + 0,05) / (donkerdere L + 0,05). De eigen lettergrootte en het lettertypegewicht van het element bepalen of de strengere drempels voor 'normale tekst' of de mildere drempels voor 'grote tekst' (18pt+ of 14pt+ vet) van toepassing zijn, en het resultaat wordt in één keer vergeleken met alle vier de echte WCAG-nummers: 4,5:1 en 3:1 voor AA, 7:1 en 4,5:1 voor AAA - nooit samengevallen in één nep-goed/slecht-oordeel.

Dit is een opzettelijk eerlijke, pragmatische subset van een volledige toegankelijkheidsaudit, geen certificeringstool: het evalueert geen JavaScript-gestuurde interactiviteit, ARIA-widgetpatronen die verder gaan dan de basislabels, de volgorde van de toetsenbordfocus of iets anders dat het daadwerkelijk weergeven en uitvoeren van de pagina vereist. Beschouw het als een snelle eerste stap die enkele van de meest voorkomende en meest consequente WCAG-fouten oplost – ontbrekende alt-tekst, niet-gelabelde velden, gebroken kophiërarchie, tekst met weinig contrast en vage links – voordat een pagina wordt verzonden, naast (niet in plaats van) een volledige handmatige beoordeling of een speciale audittool voor alles dat naar productie gaat.