Карты изображений и HTML5

Этот вопрос скорее философский, чем технический.

Я выучился на веб-разработчика еще тогда, когда веб-разработчиков называли веб-мастерами, и моим любимым инструментом был FrontPage, перешедший на Evrsoft 1st Page 2000.

Это был последний раз, когда я использовал карту изображений в формате HTML.

Теперь это HTML5, AJAX, векторные холсты, CSS 3D, jQuery, локальное хранилище, Safari с сенсорным экраном и многое другое. Карта изображений канула в безвестность, и даже Google не дает слишком много релевантных результатов; обязательная запись W3C Schools и некоторые сообщения на форуме от 2004 года.

Очевидно, что создание навигации по веб-сайту или подобной тривиальности с использованием карты изображений было плохой идеей в то время и, безусловно, непростительно сегодня.

Но прямо сейчас у меня есть задача создать полигональную интерактивную область поверх div с фоновым изображением.

У меня не возникло бы проблем с тем, чтобы сделать это на карте изображения, так как кажется, что она была разработана именно для такого варианта использования, и хотя я не проводил тестов, я не мог представить, чтобы какой-либо браузер отказался от поддержки элемента который прекрасно работал годами. Но я не могу не думать, что сегодня должен быть лучший способ сделать это.

Моя философия создания веб-сайтов заключается в разработке для IE5.5, а затем для Chrome Edge. Это означает, что сайт сначала должен работать на базовом уровне даже в самом устаревшем браузере, а затем начать добавлять JS и CSS, чтобы сделать его красивее, удобнее, быстрее, проще, удобнее и лучше.

Таким образом, хотя я знаю, что мог бы сделать холст в Raphaël и добавить всевозможные шикарные эффекты при наведении курсора и прочее, я думаю, что для такой простой функциональности не требуется JS-библиотека размером 89 КБ (или X КБ). Или даже JS вообще.

Я не знаю, есть ли в CSS3 возможности для определения полигональных областей, но, признавая большие возможности, предоставляемые CSS3, я предпочитаю оставлять все, что там определено, как несущественное чутье, которое будет изящно деградировать.

Итак, в сегодняшнем мире веб-разработки, какой способ определения многоугольной области щелчка будет наиболее кросс-браузерным (предпочтительно так, чтобы его можно было захватить с помощью jQuery .hover()или, по крайней мере, с помощью CSS? :hover), который не зависит от атрибутов JavaScript или CSS, доступных в меньшинстве браузеров? Является ли карта изображения единственным способом сделать это? Что с мобильными устройствами?