Кнопка без доступного имени
Интерактивный элемент есть в DOM, но скринридер не получает понятного названия действия.
button.product-card__favoriteПроверка доступности сайта по WCAG AA
Найдите барьеры, из-за которых людям сложно пользоваться сайтом: непонятные кнопки, неподписанные поля и нечитаемый текст. Получите автоматическую проверку доступности с объяснением нарушений.
Результат проверки
Отчёт, который сразу превращается в задачи для команды
Отчёт указывает затронутый элемент DOM — дерева элементов в браузере — с селектором и фрагментом HTML. Найдите компонент, исправьте ошибку и повторно проверьте работу с клавиатуры и программой экранного доступа.
нарушенияпройденотребует проверкиметки WCAG
accessibility-report3 проблемы · 42 проверки пройдены
Поле формы не связано с label
Пользователь видит подпись, но техническая связь между подписью и input не задана.
#checkout-emailКонтраст текста ниже WCAG AA
Состояние кнопки читается визуально слабо и может потеряться на темном фоне интерфейса.
.promo-banner .btn-secondaryРазобрать impact
Начать с critical и serious, чтобы быстро закрыть самые заметные барьеры доступа.
Передать selector
Отправить разработчику точный target, фрагмент HTML и короткую причину нарушения.
Перепроверить релиз
Повторить прогон после исправлений и увидеть, какие violations ушли из отчёта.
Что проверяем
Семантика, ARIA, формы и контраст в одной проверке доступности
Автоматическая проверка доступности сайта ищет обнаруживаемые ошибки в готовом интерфейсе. Находки связаны с правилами WCAG. Успешный отчёт не является полной сертификацией соответствия WCAG AA.
Структура страницы
Проверяем document title, язык страницы, иерархию заголовков, landmark-области, списки и альтернативные тексты для изображений.
Подробности для разработчика
- h1-h6 и landmarks
- alt-тексты и скрытые SVG
- lang, title и базовая семантика
ARIA и доступные имена
Атрибуты ARIA описывают роль, состояние и связи элемента для вспомогательных программ. Проверяем некорректные связи и элементы без понятного имени. Само добавление ARIA не делает действие доступным.
Подробности для разработчика
- имена кнопок, ссылок и полей ввода
- role/state/property ошибки
- combobox, dialog и menu паттерны
Формы, ошибки и контраст
Проверяем label, required, invalid-состояния, связи с подсказками, цветовой контраст текста и читаемость важных элементов.
Подробности для разработчика
- label и helper text
- contrast ratio по WCAG AA
- ошибки и live-сообщения
FAQ
Частые вопросы о проверке доступности
Коротко про WCAG, автоматические правила, DOM-узлы, ARIA, формы, контраст и порядок исправлений.
Что ловит автоматическая проверка?
Она находит нарушения, которые можно определить по отрисованному HTML и стилям: отсутствующие label, ошибки ARIA, некорректные роли, проблемы контраста, пустые ссылки и кнопки, alt-тексты, landmark-структуру и часть WCAG-правил.
Что значит WCAG AA для сайта?
WCAG AA — практичный целевой уровень доступности для большинства коммерческих и публичных интерфейсов. В отчёте правила помечаются WCAG-тегами, поэтому видно, какое требование связано с каждым нарушением.
Это заменяет ручной аудит?
Нет. Проверка хорошо закрывает технические нарушения в DOM и CSS, но сложные сценарии, фактический порядок клавиатурного прохода и поведение в скринридерах лучше подтверждать отдельным ручным этапом.
Можно ли начать с одной страницы?
Да. Для первого прохода обычно берут главную страницу, лид-форму, карточку товара, checkout или личный кабинет. Если сайт шаблонный, полезно проверить по одной странице каждого типа и сравнить повторяющиеся нарушения.
Что исправлять первым, если ошибок много?
Сначала critical и serious: элементы без доступного имени, поля без label, ошибки ARIA, недопустимый контраст и интерактивные элементы, которые неверно представлены в DOM. Moderate и minor удобно закрывать вместе с ближайшими изменениями дизайна или верстки.
Связанные сервисы
Что проверить рядом с этим сервисом
Проверка HTML
Найдите ошибки в HTML и слишком сложную структуру страницы. В отчёте указаны затронутые элементы.
ОткрытьCSS-аудит
Найдите тяжёлые файлы стилей, дубликаты и стили, неиспользованные при загрузке. Такие стили могут понадобиться на других страницах или после действий пользователя.
ОткрытьSEO-аудит
Проверьте до 5 страниц: SEO, метаданные и доступность контента до и после выполнения JavaScript.
ОткрытьСкорость загрузки
Проверьте загрузку страницы с выбранными настройками устройства и сети. Получите показатели скорости, список проблем и рекомендации.
Открыть