Используются ли HTML-карты изображений?

Используют ли люди старые HTML-карты изображений? Те, у кого:

<map name="test" id="test">
<area shape="poly" alt="" title="" coords=...

Или есть более новая, лучшая альтернатива?

Ответ 1

Да, люди все еще используют карты изображений. Альтернативой будет позиционирование элементов с использованием абсолютного позиционирования и CSS, но это не обязательно лучше. Это также не позволяет вам иметь формы, например, в картах изображений.

Ответ 2

Они находятся в спецификации HTML5, поэтому они не будут устаревать.

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

Ответ 3

Альтернативным решением для использования CSS или графических карт было бы использование графики SVG, встроенной в HTML dom.

В этом учебнике описан один учебник по использованию эффектов мыши, используя этот метод: http://www.petercollingridge.co.uk/data-visualisation/mouseover-effects-svgs

Ключевым выводом является то, что элементы SVG также запускают традиционные домашние события, включая onmouseover и onmouseout.

Ответ 4

Да, карты html-изображений хороши, особенно если вы хотите, чтобы ваша область была полигоном. Вы можете добавить эффекты опрокидывания на карту, а также с помощью javascript. Здесь есть хороший учебник и демонстрация:

http://www.tutorialized.com/view/tutorial/Image-Map-Rollover/3484

Ответ 5

Карты изображений по-прежнему содержатся в спецификациях HTML5, поддерживаемых всеми браузерами.

Они могут быть адаптированы к гибкому дизайну с использованием jQuery RWD Image Maps: https://github.com/stowball/jQuery-rwdImageMaps

Он обнаруживает и автоматически изменяет размеры координат карт изображений.

Он также доступен для разработчиков Wordpress в качестве плагина: http://wordpress.org/plugins/responsive-image-maps/

Простое и эффективное решение.

Ответ 6

Да, я все еще использую карты изображений, однако мой последний проект использовал Raphaël. Было довольно легко запустить что-то.

http://dmitrybaranovskiy.github.io/raphael/

С их веб-сайта:

Raphaël ['ræfeɪəl] использует Рекомендацию SVG W3C и VML в качестве основы для создания графики. Это означает, что каждый создаваемый вами графический объект также является объектом DOM, поэтому вы можете присоединить обработчики событий JavaScript или изменить их позже. Цель Raphaëls - предоставить адаптер, который сделает рисование векторной графики совместимым и кросс-браузерным.

Хороший простой пример карты изображений:

http://dmitrybaranovskiy.github.io/raphael/australia.html

Ответ 7

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

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

Стороннее редактирование

Вопрос на сайте litmus.com о поддержке карт изображений от 04/2014

Карты изображений не поддерживают теги ALT, когда изображения не загружены, текст ALT не отображается в некоторых клиентах.

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

И самое главное, iOS (iphone/ipad) не масштабирует координаты ссылки карты изображения, когда изображение масштабируется, что разрывает ссылки. Поскольку iOS представляет большую часть открытий электронной почты (iPhone + iPad = 38% через http://emailclientmarketshare.com/), это важно.

Ответ 8

Да, он еще используется

Карта изображений позволяет пользователю создавать гиперссылки на многие страницы, щелкая различные части изображения. Просто используя карту изображений, мы создаем списки координат, относящихся к определенной области одного и того же изображения, и даем гиперссылку в другое место. Используя это в одном изображении, мы даем несколько ссылок.

Больше

Ответ 9

Карта изображения довольно интересная опция в html и html5, они все еще используются, и я лично ее люблю, поэтому я нахожу issuse в мобильных устройствах, моя проблема связана с масштабированием

да, у меня есть опыт, но я - ученик, зачисленный в html html5, и для начинающих я хотел бы следить за ссылкой w3chools

http://www.w3schools.com/html/html_images.asp

вы получите много от этого [page