# Зробила зменшений рух чесним, знайшовши одинадцять селекторів, які досі анімувалися під цією настройкою, бо універсальне правило transition‑none програє за специфічністю будь‑якому правилу з класом.

серпень 2026

**Ситуація.** Сайт шанував уподобу зменшеного руху одним правилом, що вимикало кожен перехід. Воно мало вигляд завершеного, воно проходить лінтер чисто, і за емульованої вподоби зменшеного руху одинадцять селекторів усе одно анімувалися.

**Завдання.** Уподобу треба було шанувати насправді, а причина, чому очевидне правило не спрацювало, мала стати тим, чого наступна людина не зможе повторити.

**Дія.** Причиною є специфічність. Універсальне правило набирає найнижчий бал у каскаді й програє будь‑якому правилу з класом, тож суцільне вимкнення переходів програє кожній продуманій анімації на сторінці — а це і є кожна анімація, яку варто вимикати. Виправлення було структурним, а не латкою: усе, що рухається, тепер живе в одній пізній частині таблиці стилів, а лінтер валить перехідне перетворення будь‑де інде. Розрізнення, яке проводить правило, є навмисним і вужчим за очевидне: зменшуйте рух, а не колір. Згасання кольору не є рухом, і його вимкнення робить інтерфейси на відчуття зламаними для людей, які цього не просили, тож перехід, що перелічує колірні властивості, проходить, а перехід на русі — ні. Рух також зобов'язаний виражатися як перехід, а не як анімація за ключовими кадрами, бо перший тривіально скасовується, а друга — ні. З тієї самої роботи вийшли дві суміжні пастки, записані з вимірюваннями: оздоба меню проходила тридцять один градус із шістдесятиградусного повороту, перш ніж стати наполовину видимою, і оскільки форма періодична, півповорот має однаковий вигляд за третину вартості; і п'ять різних властивостей кожна робить елемент вмісним блоком для всього, спозиційованого відносно вікна перегляду, що мовчки зменшило шар закривання до частки екрана.

**Результат.** Уподобу шанують насправді, а не за наміром, і одинадцять живих анімацій, які суцільне правило нібито покривало, покрито справді. Загальний урок записано на початку того документа: правило, що програє за специфічністю, відмовляє мовчки, і кожен звіт називає це якось інакше.

---

- Роль: Інженер дизайн‑систем
- Категорії: [Frontend‑розробка](https://software.engineer.company/uk/categories/frontend/), [Веброзробка](https://software.engineer.company/uk/categories/web-development/), [Тестування та QA](https://software.engineer.company/uk/categories/testing/), [Дизайн‑системи та UI](https://software.engineer.company/uk/categories/design-systems/), [UX / UI‑дизайн](https://software.engineer.company/uk/categories/ux-ui/)
- Послуги: [Frontend‑розробка](https://software.engineer.company/uk/services/frontend-development/), [Розробка вебсайтів та CMS](https://software.engineer.company/uk/services/web-development/), [UI/UX‑дизайн та дизайн‑системи](https://software.engineer.company/uk/services/ui-ux-design/)

<https://software.engineer.company/uk/portfolio/made-reduced-motion-honest-135/>
