Вимога WCAG A/AA Пріоритет: Помірно
Деякий текст рухається, і його не можна зупинити
Сторінка використовує застарілий елемент <marquee>, зазвичай це «біжучий рядок» на зразок «Безкоштовна доставка від 1500 грн» чи оголошення про розпродаж.
Цей текст перекладено автоматично, носій мови його ще не вичитав.
Чому це важливо для ваших покупців
Рухомий текст багатьом людям важко або неможливо прочитати, і він відволікає від товару чи форми, з якими вони працюють. Оскільки його не можна призупинити, покупці з порушеннями уваги, слабким зором чи дислексією можуть узагалі не побачити повідомлення, а користувачі програм зчитування з екрана можуть почути його незрозуміло.
Кого це стосується
- люди з порушеннями уваги чи концентрації
- люди зі слабким зором
- люди з дислексією чи труднощами читання
- користувачі програм зчитування з екрана
Як виправити
Замініть <marquee> на статичний текст, наприклад звичайну смугу оголошень. Якщо потрібен рух, зробіть його через CSS із підтримкою prefers-reduced-motion і додайте видиму кнопку паузи; усе, що рухається довше п'яти секунд, має бути можливо призупинити, зупинити або приховати.
У Shopify
У темах Shopify трапляється рідко; зазвичай це старий застосунок смуги оголошень або власний HTML, вставлений у секцію. Замініть його вбудованою смугою оголошень теми чи статичним текстом.
У Shoptet (CZ)
Зазвичай це власний HTML, доданий у магазин (банер чи текст у шапці). Замініть <marquee> статичним текстом у своєму коді.
У PrestaShop
Зазвичай це старий модуль або власний HTML у CMS-блоці чи шаблоні .tpl теми. Замініть його статичним текстом або біжучим рядком, який можна призупинити.
У WooCommerce
Зазвичай це стара тема, плагін біжучого рядка або HTML, вставлений у віджет чи блок конструктора сторінок. Замініть його статичним текстом або біжучим рядком, який можна призупинити.
Стандарти
| Стандарт | Пункт |
|---|---|
| WCAG 2.2 | 2.2.2 (A) Pause, Stop, Hide |
| WCAG 2.1 | 2.2.2 (A) Pause, Stop, Hide |
| WCAG 2.0 | 2.2.2 (A) Pause, Stop, Hide |
| EN 301 549 4.1.1 | 9.2.2.2 |
| EN 301 549 3.2.1 | 9.2.2.2 |
| Section 508 2017 | E205.4 |
| ДСТУ EN 301 549 2022 | 9.2.2.2 |
Автоматична перевірка: правило axe-core marquee.
dequeuniversity.com, github.com, www.w3.org
Схожі перевірки
-
Деякі заголовки є лише жирним або великим текстом
WCAG 1.3.1 A
-
Сторінка не вказує, якою мовою вона написана
WCAG 3.1.1 A
-
Деякими областями з прокруткою не можна користуватися з клавіатури
WCAG 2.1.1 A
-
Деякі клітинки таблиці посилаються на неправильні заголовки
WCAG 1.3.1 A