Přejít na obsah
Pandus

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

Některé nápovědy jsou prázdné

Některé prvky označené jako nápověda (role="tooltip") neobsahují čitelný text.

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

Uživatelé čteček obrazovky nedostanou nápovědu, kterou ostatní zákazníci vidí, například vysvětlení velikostí, ceny dopravy, poznámku k DPH nebo pravidla pro heslo.

Koho se to týká

  • nevidomí zákazníci
  • uživatelé čteček obrazovky

Jak to opravit

Zajistěte, aby každý prvek s role="tooltip" obsahoval text nebo měl aria-label či aria-labelledby. Nápovědu propojte s prvkem, který vysvětluje, pomocí aria-describedby. Pokud se text načítá až při najetí myší, vložte ho do stránky hned a jen ho zobrazujte při najetí myší a při fokusu z klávesnice.

V Shopify

Obvykle jde o nápovědy šablony nebo widgety aplikací (tabulky velikostí, informace o dopravě). Kód opravte ve snippetech Liquid šablony nebo se obraťte na vývojáře aplikace.

V Shoptet (CZ)

Ve standardních šablonách je to vzácné; spíše jde o vlastní kód nebo doplňky. Požádejte podporu Shoptet nebo partnera o kontrolu.

V PrestaShop

Obvykle jde o šablony motivu nebo moduly s informačními ikonami. Kód nápovědy opravte v souborech .tpl nebo v přepsaných šablonách modulů.

V WooCommerce

Obvykle jde o pluginy pro nápovědy, možnosti produktu nebo page buildery. Zkontrolujte nastavení pluginu; jinak to opravte v podřízené šabloně (child theme) nebo nahlaste autorovi pluginu.

Normy

Normy
NormaBod
WCAG 2.2 4.1.2 (A) Name, Role, Value
WCAG 2.1 4.1.2 (A) Name, Role, Value
WCAG 2.0 4.1.2 (A) Name, Role, Value
EN 301 549 4.1.1 9.4.1.2
EN 301 549 3.2.1 9.4.1.2
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.4.1.2

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

Všechna pravidla, která kontrolujeme