E-mail List Archives
Thread: Image Hotspot
Number of posts in this thread: 2 (In chronological order)
From: Radhika Takyar
Date: Mon, Apr 26 2021 12:28PM
Subject: Image Hotspot
No previous message | Next message →
Happy Monday!
I need your inputs on how Image hotspots can be made accessible from design perspective. Should they have explicit text labels on it or explicit text labels are not must. What else is needed to make them fully accessible. Any suggestions?
Regards,
Radhika
Sent from my iPhone
From: glen walker
Date: Mon, Apr 26 2021 5:56PM
Subject: Re: Image Hotspot
← Previous message | No next message
By "image hotspot" do you mean the <map> and <area> elements? Follow best
practices as you would for any image and link - specify alt text for the
image itself and for each <area> element. <area> elements are keyboard
focusable so you might want to play with the focus indicator too. Firefox
and Chrome show a dotted border when focused so that's not too bad, but you
might want a custom one. When I tried area:focus {outline:red 9px solid}
in CSS, Firefox ignored it. Chrome honored the color part but not the
thickness.