Przejdź do treści
Pandus
pl Zmień język
Menu

Wymaganie WCAG A/AA Priorytet: Krytyczne

Niestandardowe przyciski nie mają nazwy

Niektóre elementy działające jak przyciski, linki lub pozycje menu zostały zbudowane od podstaw i nie mają czytelnej nazwy.

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 sterowania głosem nie wiedzą, do czego służy dana kontrolka, więc mogą nie znaleźć menu, filtra albo przycisku dodania do koszyka.

Kogo to dotyczy

  • niewidomi klienci
  • osoby korzystające z czytników ekranu
  • osoby sterujące urządzeniem za pomocą głosu

Jak to naprawić

Nadaj nazwę każdemu elementowi z role="button", "link" lub "menuitem": widoczny tekst, aria-label lub aria-labelledby. Lepiej: użyj natywnego <button> lub <a href>, które dodatkowo zapewniają obsługę klawiatury.

W Shopify

Zwykle niestandardowe ikony-kontrolki w motywie lub aplikacjach. Dodaj nazwy we fragmentach (snippets) Liquid motywu; kontrolki aplikacji zgłoś ich twórcy.

W Shoptet (CZ)

Zwykle kontrolki szablonu lub dodatki. Zgłoś problem do Shoptet lub partnera Shoptet.

W PrestaShop

Zwykle kontrolki motywu lub modułów. Dodaj nazwy w szablonach .tpl albo w nadpisanych szablonach modułów.

W WooCommerce

Zwykle kontrolki z kreatora stron lub wtyczek. Dodaj nazwy w kodzie motywu potomnego lub w ustawieniach wtyczki albo zgłoś problem autorowi wtyczki.

Normy

Normy
NormaPunkt
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 aria-command-name. dequeuniversity.com, github.com, www.w3.org

Podobne testy

Wszystkie reguły, które sprawdzamy