Note about image map tutorial example

Kudos on buiding out these Web accessibility tutorials!  These materials are very helpful.
I think the org chart example you are currently using needs a bit more work, however.
https://www.w3.org/WAI/tutorials/images/examples/imagemap/
The alt text provided in this example fails convey the hierarchical nature of who reports to whom in the org chart image map. The alt for the overall  <img> and for the various <area> hotspots doesn't touch on the relationships between the individuals in the example org chart.
You might consider picking another image map example that can be better represented through alt text alone.  Another idea is to supplement the alt text for the <img> and <area> elements in the image map with an adjacent inline text explanation of the org chart that is bound to the image map <img> using aria-describedby. Another possibility would be to implement some other semantically meaningful markup that programmaticaly exposes the hierarchical structure of employees, their co-workers and their managers, without the need for verbose alternative text explanations.
Thanks!
Brooks Newton


Brooks NewtonIndependent UX Accessibility Consultant918 207-1046brooksallennewton@gmail.com
Sent from my Galaxy Tab® S2