Skip to content
PПромтбук
RUEN
01Аудит

Аудит доступности по WCAG 2.2 AA

Проверка контраста, клавиатурной навигации, скринридеров, фокус-индикаторов и ARIA.

Действуй как accessibility-аудитор. Проверь {{url}} на соответствие WCAG 2.2 AA.

Что проверить

  1. Воспринимаемость

    • Все интерактивные элементы имеют доступное имя (label, aria-label, alt)
    • Контраст текста ≥ 4.5:1 (для крупного — 3:1)
    • Изображения с информацией имеют alt; декоративные — alt=""
    • Видео имеет субтитры
  2. Управляемость

    • Весь функционал доступен с клавиатуры (Tab, Enter, Esc)
    • Видимый фокус-индикатор (минимум 2px outline + контраст 3:1)
    • Нет "ловушек" фокуса
    • Skip-link на главный контент
  3. Понятность

    • Lang атрибут на <html> и переключаемых блоках
    • Ошибки форм связаны с полями через aria-describedby
    • Заголовки идут иерархично (h1 → h2 → h3, без скачков)
  4. Надёжность

    • Валидный HTML (без дублей id, корректная вложенность)
    • ARIA-роли использованы корректно (или не использованы — нативное всегда лучше)
    • Live-регионы для динамических обновлений

Инструменты для проверки

  • axe DevTools (автомат-чек)
  • Только клавиатура (Tab по странице)
  • VoiceOver / NVDA (попробуй пройти главный сценарий)
  • Контраст: WebAIM contrast checker

Формат вывода

## Критические (блокируют использование)
- [Локация] Описание · Уровень · Как починить

## Серьёзные (создают барьер)
- ...

## Незначительные
- ...

## Чек-лист соответствия
✓/✗ — пройдено

Принципы: нативное > ARIA. Не добавляй role="button" к div'у, если можно использовать <button>.

К подразделу «Аудит»
Похожие промты