Přejít na obsah
Pandus
cs Změnit jazyk
Menu

Požadavek WCAG A/AA Priorita: Závažné

Uživatelé klávesnice se nedostanou k vloženému obsahu

Vložený rámec (iframe) obsahuje odkazy, tlačítka nebo pole formuláře, ale samotný rámec má nastaveno tabindex="-1", čímž je vyřazen z pořadí procházení klávesnicí.

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

Lidé, kteří se pohybují klávesou Tab, celý rámec přeskočí. Pokud obsahuje formulář platby kartou, mapu doručení, rezervační kalendář nebo chat, nemohou je vůbec použít a objednávku možná nedokončí.

Koho se to týká

  • lidé ovládající web pouze klávesnicí
  • lidé s pohybovým omezením
  • uživatelé čteček obrazovky

Jak to opravit

Odstraňte tabindex="-1" ze všech prvků <iframe> nebo <frame>, které obsahují interaktivní obsah, aby se do nich dostal fokus klávesnice. Je-li rámec čistě dekorativní nebo zdvojený, skryjte jej správně (například aria-hidden a žádný fokusovatelný obsah uvnitř). U vložení třetích stran zkontrolujte kód pro vložení nebo se obraťte na dodavatele.

V Shopify

Obvykle kód pro vložení nebo aplikace, která svému iframe přidá tabindex="-1" (video, recenze, chat, platba). Odstraňte jej z vlastního kódu pro vložení; iframe aplikací musí opravit jejich vývojář.

V Shoptet (CZ)

Obvykle kódy pro vložení nebo widgety přidané vlastním kódem. Odstraňte tabindex="-1" z kódu pro vložení; poskytovatelé widgetů možná budou muset opravit své rámce sami.

V PrestaShop

Obvykle moduly, které vkládají video, mapy nebo platební formuláře do iframe. Odstraňte tabindex="-1" v šablonách .tpl modulu nebo motivu; moduly třetích stran nahlaste jejich vývojáři.

V WooCommerce

Obvykle page buildery, slidery nebo pluginy (video, mapy, platby, chat), které iframe přidají tabindex="-1". Zkontrolujte nastavení widgetu nebo pluginu a nahlaste to autorovi pluginu.

Normy

Normy
NormaBod
WCAG 2.2 2.1.1 (A) Keyboard
WCAG 2.1 2.1.1 (A) Keyboard
WCAG 2.0 2.1.1 (A) Keyboard
EN 301 549 4.1.1 9.2.1.1
EN 301 549 3.2.1 9.2.1.1
Section 508 2017 E205.4
ДСТУ EN 301 549 2022 9.2.1.1

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

Podobné kontroly

Všechna pravidla, která kontrolujeme