Přejít na obsah
Pandus

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

Některé buňky tabulky odkazují na nesprávná záhlaví

Tabulka, například tabulka velikostí, technických parametrů nebo cen dopravy, propojuje buňky se záhlavími pomocí atributu headers, ale některé odkazy nevedou na buňky záhlaví ve stejné tabulce.

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

Čtečky obrazovky tato propojení používají, aby přečetly hodnotu spolu se záhlavími, například „Velikost M, obvod hrudníku: 96 cm“. Když jsou propojení chybná, nevidomí zákazníci slyší čísla bez souvislostí a mohou zvolit špatnou velikost nebo variantu.

Koho se to týká

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

Jak to opravit

Každé ID v atributu headers buňky musí patřit prvku <th> ve stejné tabulce a buňka nesmí odkazovat sama na sebe. Opravte chybná nebo chybějící ID. U jednoduchých tabulek je často snazší atributy headers úplně odstranit a záhlaví označit pomocí <th scope="col"> a <th scope="row">, kterým čtečky obrazovky rozumí bez dalších propojení.

V Shopify

Obvykle tabulka velikostí či parametrů vložená do popisu produktu nebo stránky, případně vygenerovaná aplikací pro tabulky velikostí. Opravte HTML tabulky v režimu kódu editoru nebo se obraťte na vývojáře aplikace.

V Shoptet (CZ)

Obvykle tabulka vložená do popisu produktu nebo článku. Opravte HTML tabulky v editoru; většině jednoduchých tabulek stačí buňky <th> bez atributu headers.

V PrestaShop

Obvykle tabulka v popisu produktu, na CMS stránce nebo v modulu vlastností produktu. Opravte HTML v editoru nebo v šabloně .tpl modulu.

V WooCommerce

Obvykle tabulka vytvořená pluginem pro tabulky či tabulky velikostí nebo HTML vložené do popisu produktu. Zkontrolujte nastavení přístupnosti pluginu nebo opravte ID v kódu tabulky.

Normy

Normy
NormaBod
WCAG 2.2 1.3.1 (A) Info and Relationships
WCAG 2.1 1.3.1 (A) Info and Relationships
WCAG 2.0 1.3.1 (A) Info and Relationships
EN 301 549 4.1.1 9.1.3.1
EN 301 549 3.2.1 9.1.3.1
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.1.3.1

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

Všechna pravidla, která kontrolujeme