WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: External embedded map - influence on rating

for

From: glen walker
Date: Jan 5, 2019 1:34PM


Yes, that's a common and difficult situation. Maps are usually contained
in an iframe that is aria-hidden since they don't work well for screen
readers, but that doesn't mean maps shouldn't continually evolve to provide
better support.

Sometimes the iframe is not hidden but has a title to explain what it is
and that it might not work well with a screen reader. That way the user
can decide if they want to navigate the DOM of the map.

And sometimes a little of both is done. The iframe is hidden but the
container of the iframe contains hidden text (an aria-label or visually
hidden text), possibly as a landmark (section) that explains that the map
isn't accessible.

Thomas Logan has done some work with accessible maps. You can listen to
his ID24 presentation <https://www.youtube.com/watch?v=0gB83fkfD8Y> and
read his blog <https://equalentry.com/accessible-maps-on-the-web/> about it.

If the purpose of the map is to find stores or restaurants or whatever
nearby, if the resulting search provides a table of results, you should be
ok. Whether that table is visible on the same page as the map, or a
separate link, or can be expanded (such as a disclosure widget
<https://www.w3.org/TR/wai-aria-practices/#disclosure>), is sort of up to
you and the user experience designers. A table of results can be very
handy for all kinds of users so hiding it just for screen reader users is
not usually advised. (The results don't have to be a literal <table>. It
could be a list (<ul> or <ol>) or something similar. It kind of depends on
what your results look like.)

If the purpose of the map is to provide directions, you could do something
similar to google map directions. While google maps shows a blue line for
the route, there is a list of directions provided too, with step by step
turn instructions.

I think minimally, or at least as a start, try to get the map keyboard
accessible. If the map is from a third party vendor, see if you can work
with them on keyboard accessibility. If not, perhaps investigate other
vendors or do more research on how you can creatively work accessibility
into the exist code. Thomas's blog touches on that.

Glen