Перейти к содержимомуПерейти к содержимому

Модуль «Механика» WCAG 2.3.3 Уровень AAA

Защита от замедления движения

Учитывает параметр `prefers-reduced-motion` и отключает агрессивную анимацию, автовоспроизведение и параллакс.

Что это делает

Функция в одном предложении — и в трёх предложениях

Для людей, страдающих мигренью, вестибулярными расстройствами или СДВГ, агрессивная веб-анимация представляет собой реальную проблему. Браузеры предлагают медиа-запрос CSS `prefers-reduced-motion: reduce` с 2018 года, но лишь немногие темы корректно его реализуют.

Функция Reduced Motion Guard срабатывает, когда система посетителя запрашивает уменьшенное количество анимаций, и в этом случае приостанавливает CSS-переходы, GIF-файлы и автоматическое воспроизведение видео.

Вот как это реализовано в плагине.

Технические меры

  • CSS-переопределение: глобальная `animation-duration: 0.01ms` + `transition-duration: 0.01ms` для `prefers-reduced-motion`.
  • Приостановить анимированные GIF-файлы: заменяет его неподвижным изображением (первый кадр).
  • Приостановить автоматическое воспроизведение видео: остановки `
  • Отключить скрипты параллакса: обнаруживает популярные плагины параллакса и отключает их.
  • переключатель панели внешнего интерфейсаКроме того, посетитель может активировать модуль, не изменяя никаких системных настроек.
В административной панели плагина

Эти настройки можно найти на вкладке "Модуль".

  • Стратегия: только CSS-анимации / + GIF-анимации / + автовоспроизведение / всё, включая параллакс
  • Интеграция с фронтальной панелью: включение/выключение
  • Исключения (например, едва заметные эффекты при наведении курсора должны оставаться неизменными)
  • Обнаружение плагинов параллакса: только явный белый список / автоматическое обнаружение

Путь в административной панели: WP-Admin → Доступность → Модули → Защита от замедления движения

Когда вам понадобится этот модуль?

Вариант использования

Рекомендуется для любых страниц с анимацией в верхней части страницы, слайдерами, эффектом параллакса или GIF-анимацией. Обязательно для правительственных и образовательных веб-сайтов (BITV 2.0).

Связанные модули

Это тематически взаимосвязано.

  • Видимый фокус

    WCAG 2.4.11

    Обеспечивает четкое, всегда видимое кольцо фокусировки на всех фокусируемых элементах — с контрастностью класса AAA.

  • Менеджер ARIA

    WCAG 4.1.2

    Автоматически назначает интерактивным элементам правильные роли, состояния и свойства ARIA.

  • Уведомление о субтитрах видео

    WCAG 1.2.2

    Она распознает видео без субтитров и отображает редакционное примечание в административной панели.

Активировать модуль для вашего сайта?

В ходе первоначальной 15-минутной консультации мы выясним, подходит ли данный модуль для вашей темы и типа контента, а также как будет выглядеть его настройка.

Первичная консультация (15 минут)
Просмотреть все модули

Простой язык