01 / Наблюдение

Доступность по умолчанию

Некоторым пользователям неприятны резкие масштабирования, параллакс и нескончаемые движущиеся строки. Системное предпочтение reduced motion позволяет уменьшить подобные эффекты. Это не обязательно означает полное отсутствие обратной связи: цвет, контур и короткие изменения состояния могут остаться.

02 / Подход

Реализация без ловушек

В CSS задайте альтернативное поведение для prefers-reduced-motion: reduce. Не скрывайте содержимое через opacity:0 до момента, когда его «покажет» JavaScript. Если эффект необходим для понимания действия, предоставьте такой же смысл текстом или статическим состоянием.

Пример

Список карточек должен быть доступен сразу, даже если анимация появления отключена или не запустилась.

03 / Практика

Три пункта для проверки

  1. Включите настройку reduced motion в системе.
  2. Проверьте отсутствие бесконечного движения.
  3. Убедитесь, что ссылки и кнопки всё ещё заметны.