Přejít na obsah
Pandus

Požadavek WCAG A/AA Priorita: Střední

Některý text se posouvá a nejde zastavit

Stránka používá zastaralý prvek <marquee>, obvykle běžící pruh typu „Doprava zdarma nad 1 000 Kč“ nebo oznámení o výprodeji.

Tento text byl přeložen automaticky a rodilý mluvčí ho zatím nezkontroloval.

Proč na tom záleží vašim zákazníkům

Pohyblivý text je pro mnoho lidí obtížně čitelný nebo nečitelný a odvádí pozornost od produktu či formuláře. Protože ho nelze pozastavit, lidé s poruchou pozornosti, slabozrací nebo lidé s dyslexií mohou sdělení úplně přehlédnout a uživatelé čteček obrazovky jej mohou slyšet matoucím způsobem.

Koho se to týká

  • lidé s poruchou pozornosti nebo soustředění
  • slabozrací lidé
  • lidé s dyslexií nebo potížemi se čtením
  • uživatelé čteček obrazovky

Jak to opravit

Nahraďte <marquee> statickým textem, například běžnou oznamovací lištou. Chcete-li pohyb, vytvořte jej pomocí CSS, které respektuje prefers-reduced-motion, a přidejte viditelné tlačítko pauzy; vše, co se pohybuje déle než pět sekund, musí jít pozastavit, zastavit nebo skrýt.

V Shopify

V šablonách Shopify vzácné; obvykle jde o starší aplikaci oznamovací lišty nebo vlastní HTML vložené do sekce. Nahraďte jej vestavěnou oznamovací lištou šablony nebo statickým textem.

V Shoptet (CZ)

Obvykle jde o vlastní HTML vložené do obchodu (banner nebo text v hlavičce). Nahraďte <marquee> ve vlastním kódu statickým textem.

V PrestaShop

Obvykle jde o starý modul nebo vlastní HTML v CMS bloku či šabloně .tpl motivu. Nahraďte jej statickým textem nebo běžícím pruhem, který lze pozastavit.

V WooCommerce

Obvykle jde o starou šablonu, plugin běžícího textu nebo HTML vložené do widgetu či bloku page builderu. Nahraďte jej statickým textem nebo běžícím pruhem, který lze pozastavit.

Normy

Normy
NormaBod
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

Automatická kontrola: pravidlo axe-core marquee. dequeuniversity.com, github.com, www.w3.org

Všechna pravidla, která kontrolujeme