Wymaganie WCAG A/AA Priorytet: Poważne
Klikalne elementy są zagnieżdżone jeden w drugim
Niektóre klikalne elementy znajdują się wewnątrz innych klikalnych elementów, np. przycisk listy życzeń w klikalnej karcie produktu.
Ten tekst przetłumaczono automatycznie i nie został jeszcze sprawdzony przez native speakera.
Dlaczego to ważne dla Twoich klientów
Osoby korzystające z czytników ekranu lub klawiatury mogą nie dotrzeć do wewnętrznej kontrolki albo nie odróżnić jej od karty, więc mogą przeoczyć szybkie dodanie do koszyka lub listę życzeń albo otworzyć coś innego.
Kogo to dotyczy
- osoby korzystające z czytników ekranu
- osoby korzystające z klawiatury zamiast myszy
- osoby sterujące urządzeniem za pomocą głosu
Jak to naprawić
Nie umieszczaj linków, przycisków ani pól wewnątrz innego linku lub przycisku ani w elemencie z role="button" lub podobną. Główny link karty i jej przyciski powinny być elementami równorzędnymi; w razie potrzeby powiększ klikalny obszar głównego linku za pomocą CSS.
W Shopify
Zwykle karty produktów z przyciskami szybkiego dodania lub listy życzeń z motywu albo aplikacji. Przebuduj kartę we fragmencie Liquid motywu; przyciski aplikacji zgłoś ich twórcy.
W Shoptet (CZ)
Zwykle karty produktów w szablonie. Zgłoś problem do Shoptet lub partnera Shoptet.
W PrestaShop
Zwykle szablony miniatur produktów z przyciskami szybkiego podglądu lub listy życzeń. Przebuduj szablon .tpl miniatury produktu w motywie.
W WooCommerce
Zwykle pętle produktów z motywu, kreatorów stron lub wtyczek listy życzeń. Przebuduj szablon w motywie potomnym albo zgłoś problem autorowi wtyczki.
Normy
| Norma | Punkt |
|---|---|
| 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 |
Automatyczny test: reguła axe-core nested-interactive.
dequeuniversity.com, github.com, www.w3.org
Podobne testy
-
Strona deklaruje dwa różne języki
WCAG 3.1.1 A
-
Atrybuty dostępności mają nieprawidłowe wartości
WCAG 4.1.2 A
-
Tytuł tabeli jest wpisany w komórkę tabeli
WCAG 1.3.1 A
-
Klikalne elementy są zagnieżdżone jeden w drugim
WCAG 4.1.2 A