Practică recomandată Prioritate: Minor · verificare experimentală: merită verificată manual
Un element accesibil de la tastatură nu spune ce este
Un element la care se poate ajunge cu tasta Tab, de exemplu un div sau span pe care se poate face clic, nu are un rol care să le spună tehnologiilor asistive că este buton, link sau alt control. axe marchează această verificare ca experimentală, așa că rezultatele trebuie verificate manual. Este o practică recomandată, nu o cerință WCAG de nivel AA.
Acest text a fost tradus automat și nu a fost încă verificat de un vorbitor nativ.
De ce contează pentru clienții tăi
Un utilizator de tastatură sau de cititor de ecran ajunge pe element, dar aude doar textul lui sau nimic, fără „buton” ori „link”. Nu își dă seama că elementul poate fi activat, așa că poate sări peste selectorul de mărime, un filtru sau „adaugă la favorite”.
Pe cine afectează
- utilizatorii de cititoare de ecran
- utilizatorii de tastatură
- utilizatorii de control vocal
Cum se remediază
Folosiți elemente native pentru controale: <button> pentru acțiuni și <a href> pentru navigare. Dacă un element personalizat trebuie păstrat, adăugați rolul potrivit (button, link, tab, checkbox etc.) și comportamentul de la tastatură pe care acel rol îl presupune. Dacă elementul nu este interactiv, eliminați tabindex ca să nu primească focus. Fiind o regulă experimentală, verificați manual fiecare rezultat înainte de a modifica codul.
În Shopify
Cauza este de obicei codul personalizat din temă sau din aplicații, de exemplu mostre de culoare, vizualizare rapidă sau butoane de favorite. Înlocuiți div-ul sau span-ul pe care se face clic cu un <button> în snippetul Liquid sau cereți dezvoltatorului aplicației să corecteze.
În Shoptet (CZ)
Depinde de șablon și de add-onuri. Raportați elementul către Shoptet sau dezvoltatorul add-onului; codul personalizat adăugat de dvs. îl puteți corecta direct.
În PrestaShop
Provine de obicei din JavaScript-ul temei sau din module precum selectoare de variante și slidere. Corectați marcajul în fișierele .tpl și scripturile temei sau întrebați autorul modulului.
În WooCommerce
Provine adesea din widgeturi de page builder sau pluginuri care fac div-uri clicabile. Actualizați pluginul sau modificați marcajul într-un șablon din tema copil, astfel încât controalele să fie butoane sau linkuri reale.
Standarde
Nu este un criteriu WCAG, ci o practică recomandată care face site-ul mai ușor de folosit.
Verificare automată: regula axe-core focus-order-semantics.
dequeuniversity.com, github.com