Požadavek WCAG A/AA Priorita: Závažné
Některé odkazy neříkají, kam vedou
Některé odkazy nemají čitelný text, často jde o ikony jako košík, srdíčko nebo logo bez textového popisku.
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 uslyší jen „odkaz“ a nepoznají, zda otevírá košík, účet nebo Instagram. Ztrácejí čas, nebo hledání košíku či kontaktu vzdají.
Koho se to týká
- nevidomí zákazníci
- uživatelé čteček obrazovky
- uživatelé hlasového ovládání
Jak to opravit
Dejte každému odkazu textový název: viditelný text, alt u obrázku uvnitř odkazu, nebo aria-label u odkazů jen s ikonou. Název má popisovat cíl, například „Košík, 2 položky“. Dekorativní ikony skryjte pomocí aria-hidden="true".
V Shopify
Obvykle jde o ikonové odkazy v hlavičce nebo patičce šablony. Doplňte skrytý text nebo aria-label v sekcích a snippetech Liquid šablony; odkazy přidané aplikacemi je nutné opravit v aplikaci nebo nahlásit jejímu vývojáři.
V Shoptet (CZ)
Obvykle jde o ikonové odkazy v hlavičce nebo patičce šablony. Zkontrolujte nastavení popisků odkazů v šabloně; jinak musí kód šablony upravit podpora Shoptet nebo partner.
V PrestaShop
Obvykle jde o ikonové odkazy v modulech hlavičky nebo v šablonách motivu. Doplňte skrytý text nebo aria-label v souborech .tpl motivu nebo v přepsaných šablonách modulů.
V WooCommerce
Často jde o ikonové odkazy v hlavičce šablony, mini košíku nebo pluginu pro sociální sítě. Doplňte textové popisky v šabloně nebo v podřízené šabloně (child theme), nebo zvolte nastavení pluginu, které vypisuje přístupné popisky.
Normy
| Norma | Bod |
|---|---|
| WCAG 2.2 | 2.4.4 (A) Link Purpose (In Context) |
| WCAG 2.2 | 4.1.2 (A) Name, Role, Value |
| WCAG 2.1 | 2.4.4 (A) Link Purpose (In Context) |
| WCAG 2.1 | 4.1.2 (A) Name, Role, Value |
| WCAG 2.0 | 2.4.4 (A) Link Purpose (In Context) |
| WCAG 2.0 | 4.1.2 (A) Name, Role, Value |
| EN 301 549 4.1.1 | 9.2.4.4 |
| EN 301 549 4.1.1 | 9.4.1.2 |
| EN 301 549 3.2.1 | 9.2.4.4 |
| EN 301 549 3.2.1 | 9.4.1.2 |
| Section 508 2017 | E205.4 |
| ДСТУ EN 301 549 2022 | 9.2.4.4 |
| ДСТУ EN 301 549 2022 | 9.4.1.2 |
Automatická kontrola: pravidlo axe-core link-name.
dequeuniversity.com, github.com, www.w3.org, www.w3.org
Podobné kontroly
-
Odkazy v textu vypadají jako běžný text
WCAG 1.4.1 A
-
Pole formuláře nemají popisek
WCAG 4.1.2 A
-
Některá tlačítka formulářů nemají název
WCAG 4.1.2 A
-
Atributy přístupnosti mají nesprávné hodnoty
WCAG 4.1.2 A