Accessibility

Доступная HTML- и CSS-разработка

Материалы о семантике, доступных именах, фокусе, клавиатурном управлении, масштабировании и устойчивой адаптивной вёрстке.

72 тематических материаловWCAG-подход на практике
Базовый принцип

Сначала выбирайте нативный HTML-элемент с нужным поведением. ARIA дополняет недостающую информацию, но не создаёт клавиатурную механику и семантику автоматически.

Семантика HTML

Семантика HTML: материалы

CSS и состояния

CSS и состояния: материалы

Минимальная проверка страницы

  1. Пройдите все действия с клавиатуры и убедитесь, что фокус заметен.
  2. Проверьте доступные имена кнопок, ссылок и полей формы.
  3. Увеличьте текст до 200% и ширину viewport уменьшите до 320 px.
  4. Отключите CSS и проверьте порядок и смысл содержимого.