Cerință WCAG A/AA Prioritate: Minor
O imagine pe care se poate da clic funcționează doar cu mouse-ul
Pagina folosește o hartă de imagine pe server: o imagine cu link la care serverul decide ce se deschide în funcție de locul exact al clicului, de exemplu o hartă veche a magazinelor sau o imagine de catalog pe care se poate da clic.
Acest text a fost tradus automat și nu a fost încă verificat de un vorbitor nativ.
De ce contează pentru clienții tăi
Utilizatorii de tastatură și de cititoare de ecran nu pot alege o zonă a imaginii și nimic nu le spune ce zone există. Tot ce se află în spatele acestor clicuri le rămâne inaccesibil.
Pe cine afectează
- utilizatorii de tastatură
- utilizatorii de cititoare de ecran
- utilizatorii de control vocal
Cum se remediază
Înlocuiți harta de imagine pe server (un <img ismap> într-un link) cu linkuri text obișnuite sau butoane pentru fiecare destinație. Dacă aveți nevoie de o imagine pe care se poate da clic, folosiți o hartă de imagine pe client (<map> cu elemente <area>, fiecare cu text alternativ) sau imagini separate cu link. Ajută și o listă text cu aceleași linkuri lângă imagine.
În Shopify
Foarte rar; temele Shopify nu folosesc această tehnică. Dacă apare, căutați HTML vechi inserat într-o pagină sau o aplicație învechită și înlocuiți-l cu linkuri obișnuite.
În Shoptet (CZ)
Foarte rar; șabloanele nu folosesc această tehnică. Dacă apare, provine din HTML inserat într-o pagină; înlocuiți-l cu linkuri obișnuite.
În PrestaShop
Foarte rar; de obicei HTML vechi într-o pagină CMS sau un modul învechit. Înlocuiți-l cu linkuri obișnuite în conținut sau în șablonul .tpl al modulului.
În WooCommerce
Foarte rar; de obicei HTML vechi într-o pagină, un plugin învechit sau conținut preluat de pe un site mai vechi. Înlocuiți-l cu linkuri obișnuite sau cu un plugin de hărți de imagine care afișează text alternativ pentru fiecare zonă.
Standarde
| Standard | Punct |
|---|---|
| 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 |
Verificare automată: regula axe-core server-side-image-map.
dequeuniversity.com, github.com, www.w3.org
Verificări similare
-
Unele titluri sunt doar text îngroșat sau mare
WCAG 1.3.1 A
-
Unele comutatoare și casete de bifat nu au nume
WCAG 4.1.2 A
-
Tabelele mari au celule fără antete
WCAG 1.3.1 A
-
Unele linkuri nu spun unde duc
WCAG 2.4.4 A