¿La gente todavía usa los antiguos mapas de imágenes HTML? Los que tienen:
<map name="test" id="test">
<area shape="poly" alt="" title="" coords=...
¿O hay una alternativa mejor y más nueva?
¿La gente todavía usa los antiguos mapas de imágenes HTML? Los que tienen:
<map name="test" id="test">
<area shape="poly" alt="" title="" coords=...
¿O hay una alternativa mejor y más nueva?
Respuestas:
Sí, la gente todavía usa mapas de imágenes. Una alternativa sería colocar elementos usando posicionamiento absoluto y CSS, pero eso no es necesariamente mejor. Tampoco le permite tener formas como en los mapas de imágenes.
Están en la especificación HTML5 , por lo que no quedarán obsoletos.
Todavía puede usarlos libremente, ciertamente todavía tienen su lugar en el desarrollo web. O podría decir que existen esas raras ocasiones en las que se puede resolver mejor algo con un mapa de imágenes.
Una solución alternativa al uso de CSS o mapas de imágenes sería hacer uso de gráficos SVG incrustados en HTML dom.
En este tutorial se describe un tutorial sobre cómo lograr efectos de mouseover utilizando esta técnica: http://www.petercollingridge.co.uk/data-visualisation/mouseover-effects-svgs
La conclusión clave es que los elementos SVG también desencadenan eventos tradicionales de dom, incluidos onmouseover y onmouseout .
Sí, los mapas de imágenes html son buenos, especialmente si desea que su área sea un polígono. También puede agregar efectos de rollover a su mapa con javascript. Hay un buen tutorial y una demostración aquí:
http://www.tutorialized.com/view/tutorial/Image-Map-Rollover/3484
Los mapas de imágenes todavía tienen especificaciones HTML5, compatibles con todos los navegadores.
Se pueden adaptar al diseño receptivo utilizando jQuery RWD Image Maps: https://github.com/stowball/jQuery-rwdImageMaps
Detecta y redimensiona automáticamente las coordenadas de los mapas de imágenes.
También está disponible para desarrolladores de Wordpress como complemento: http://wordpress.org/plugins/responsive-image-maps/
Solución sencilla y eficaz.
Sí, sigo usando mapas de imágenes, sin embargo, mi último proyecto usó Raphaël. Fue bastante fácil poner algo en funcionamiento.
http://dmitrybaranovskiy.github.io/raphael/
Desde su sitio web:
Raphaël ['ræfeɪəl] utiliza la recomendación SVG W3C y VML como base para crear gráficos. Esto significa que cada objeto gráfico que crea también es un objeto DOM, por lo que puede adjuntar controladores de eventos JavaScript o modificarlos más tarde. El objetivo de Raphaël es proporcionar un adaptador que hará que el dibujo de arte vectorial sea compatible con todos los navegadores y sea fácil.
Buen ejemplo de mapa de imagen simple:
http://raphaeljs.com/
completamente y solo proporcionaría el ejemplo de Github.
http://raphaeljs.com/
enlace eventualmente se romperá cuando expire el registro de dominio, pero ahora hay una redirección para dar a todos (en el mundo) la oportunidad de actualizar sus enlaces. Quizás @orschiro podría comenzar con el del artículo y agregar al esfuerzo colaborativo aquí en SO.
Si bien ya rara vez los veo usados en sitios web modernos, parece que mis clientes los usan en sus campañas de correo electrónico. Sin embargo, he notado y confirmado que hay algunos problemas de escala con el sistema de coordenadas en dispositivos móviles.
** Sé que este hilo es antiguo, solo estaba investigando un poco más sobre esto para un problema reciente de campaña de correo electrónico y pensé que podría ayudar a alguien más en el futuro.
La pregunta en litmus.com sobre el soporte de mapas de imágenes es del 04/2014
Los mapas de imágenes no admiten etiquetas ALT, cuando las imágenes no se cargan, el texto ALT no se muestra en algunos clientes.
El uso de mapas de imágenes generalmente da como resultado el uso de imágenes grandes que pueden causar problemas de entrega y obstaculizar la velocidad de descarga (especialmente importante para los usuarios de dispositivos móviles).
Y lo más importante, iOS (iphone / ipad) no escala las coordenadas del enlace del mapa de la imagen cuando se escala la imagen, lo que rompe los enlaces. Dado que iOS representa una gran mayoría de correos electrónicos abiertos (iPhone + iPad = 38% a través de http://emailclientmarketshare.com/ ), esto es importante.
Sí, todavía se usa
Un mapa de imagen le permite al usuario hacer un hipervínculo a muchas páginas haciendo clic en diferentes partes de una imagen. Simplemente usando el mapa de imagen creamos listas de coordenadas relacionadas con un área específica de la misma imagen y le damos el hipervínculo a una ubicación diferente. Al usar esto dentro de una sola imagen, damos múltiples enlaces.
El mapa de imagen es una opción bastante interesante en html y html5, todavía se están usando y personalmente me encanta, por lo tanto, encuentro un uso en dispositivos móviles, mi problema está relacionado con la escala
sí, lo he experimentado yo mismo, sin embargo, soy un estudiante inscrito en html html5 y, para los ingenieros, me gustaría seguir el enlace de w3chools
http://www.w3schools.com/html/html_images.asp
obtendrá mucho de esta [página