Аудитор доступності HTML

Більшість швидких перевірок доступності — це або поверхневий пошук ключових слів, або важка бібліотека, якій доводиться довіряти як чорній скриньці. Цей інструмент іде третім шляхом: він розбирає вставлений вами HTML за допомогою вбудованого в браузер DOMParser — жодного axe-core, жодної зовнішньої бібліотеки доступності, нічого не завантажується — а потім обходить отримане дерево DOM набором власноруч написаних перевірок, що відображають поширені, реальні шаблони порушень WCAG 2.1. Це означає, що логіку можна повністю перевірити, а аудит виконується цілком у вашому браузері: вставлена розмітка й будь-яка перевірена пара кольорів ніколи не завантажуються й нікуди не надсилаються.

Перевірки охоплюють найпоширеніші на реальних сторінках порушення: елементи <img> взагалі без атрибута alt (справжнє порушення WCAG, на відміну від навмисно порожнього alt="", що використовується для декоративних зображень і коректно не позначається), елементи форм, за якими допоміжні технології не можуть визначити призначення (перевіряється кожен реальний шлях до підпису — відповідний <label for>, обгортання в <label>, атрибут aria-label чи aria-labelledby), рівні заголовків, що стрибають без попередження (<h1> одразу в <h3>, або документ узагалі без <h1>, або більш ніж один), посилання без href чи з розпливчастим, позбавленим контексту текстом на кшталт «натисніть тут» або «читати далі», а також відсутній атрибут lang, коли вставлено повний HTML-документ (а не лише фрагмент).

Головна родзинка — справжня математика контрастності, а не поверхнева евристика «виглядає читабельно». Для будь-якого елемента з інлайновими color і background-color інструмент зчитує обидва значення, перетворює їх на реальні числа RGB через власний CSS-рушій браузера (тому hex, rgb(), hsl() та іменовані кольори на кшталт 'tomato' працюють однаково), і обчислює точну відносну яскравість WCAG для кожного — L = 0.2126×R + 0.7152×G + 0.0722×B, де кожен канал спершу гамма-скоригований за реальною передавальною кривою sRGB — перш ніж об'єднати їх у офіційну формулу коефіцієнта контрастності (світліша L + 0.05) / (темніша L + 0.05). Власні font-size і font-weight елемента визначають, чи застосовувати суворіші пороги для «звичайного тексту», чи поблажливіші для «великого тексту» (18pt+, або 14pt+ жирний), і результат звіряється одразу з усіма чотирма реальними числами WCAG: 4.5:1 і 3:1 для AA, 7:1 і 4.5:1 для AAA — ніколи не згорнутими у фальшивий вердикт «добре/погано».

Це навмисно чесна, прагматична підмножина повного аудиту доступності, а не інструмент сертифікації: він не оцінює JavaScript-керовану інтерактивність, шаблони ARIA-віджетів поза базовим підписуванням, порядок фокусу з клавіатури чи будь-що, що вимагає фактичного рендерингу й запуску сторінки. Сприймайте його як швидкий перший прохід, що виявляє деякі з найпоширеніших і найвагоміших порушень WCAG — відсутній alt, непідписані поля, зламану ієрархію заголовків, низький контраст тексту та розпливчасті посилання — перед випуском сторінки, поряд із (а не замість) повним ручним оглядом чи спеціалізованим інструментом аудиту для всього, що йде в продакшн.