0

Одитор за достъпност на HTML

Поставете суров HTML и получете истински одит за достъпност по WCAG: собственоръчно написан DOM обхождач проверява изображения, етикети на формуляри, подредба на заглавия и текст на връзки, плюс истински калкулатор за контрастно съотношение по относителна яркост, оценен спрямо реалните прагове AA/AAA — без външна библиотека, нищо не се изпраща навън.

🔒 Обработва се изцяло във вашия браузър - нищо, което въвеждате тук, никога не се качва.

Самостоятелна проверка на контраст

Проверете директно всяка двойка цветове (преден план/фон) — работят hex, rgb(), hsl() или именуван цвят като 'tomato'.

Обработка... 0%
Парсване на HTML в реален DOM
Обхождане на дървото за WCAG проверки
Изчисляване на контрастни съотношения
Готово

Резултат

Повечето бързи проверки за достъпност са или повърхностно сканиране по ключови думи, или тежка библиотека, на която трябва да се доверите като на черна кутия. Този инструмент поема по трети път: парсва поставения от вас 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 текст, неетикетирани полета, нарушена йерархия на заглавия, текст с нисък контраст и неясни връзки — преди страницата да излезе в продукция, успоредно с (а не вместо) пълен ръчен преглед или специализиран одитен инструмент за всичко, което влиза в продукция.