Image Map with map separated from image in DOM order

This approach is not recommended. See the test results at the bottom of the page for more.

Board of directors and related staff: image borrowed from w3.org:w@

"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum."

link 0link 1link 2link 3link 4link 5link 6link 7link 8link 9link 10link 11link 12link 13link 14link 15link 16link 17link 18link 19link 20link 21link 22link 23link 24link 25link 26link 27link 28link 29link 30link 31link 32link 33link 34link 35link 36link 37link 38link 39link 40link 41link 42link 43link 44link 45link 46link 47link 48link 49
Davy Jones: Chairman Carole Brewster: Company Secretary Harry H Brown: Marketing Director Paula Holbein: Sales Director Hugh Howard: Finance Director

Focus Order Testing

OS Browser Engine Results
Windows 7 IE 11 Trident Focus order is logical. When tabbing, the visual focus indication shows up at the beginning of the tab order as expected.
Windows 7 FireFox 56 Gecko Focus order is logical. When tabbing, the visual focus indication shows up at the beginning of the tab order as expected.
Windows 7 Chrome 63 Blink Focus order is illogical. The user has to Tab to the AREA elements at the bottom of the page to see to see the visual focus indication appear on the various areas of the image.
iOS 11.2 Safari Mobile Webkit with VoiceOver The user cannot swipe to the interactive parts of the image at the top of the document order. But they can touch the interactive parts of the image to activate them.