Mapa de imagen
Una técnica HTML que define múltiples regiones clicables dentro de una sola imagen, cada una enlazando a un destino diferente.
Un mapa de imagen es una técnica HTML que define múltiples puntos calientes clicables dentro de una sola imagen, cada uno vinculado a una URL diferente. Por ejemplo, un mapa de Japón donde al hacer clic en cada prefectura se navega a la página de esa región demuestra la navegación interactiva basada en imágenes.
La implementación utiliza las etiquetas HTML <map> y <area>. El atributo shape en <area> define regiones rectangulares (rect), circulares (circle) o poligonales (poly) mediante coordenadas. Sin embargo, los mapas de imagen funcionan mal con el diseño responsivo ya que las coordenadas se rompen cuando las dimensiones de la imagen cambian, por lo que ahora se prefieren alternativas con CSS y SVG.
Al usar mapas de imagen, establecer texto alternativo en cada elemento <area> es obligatorio para la accesibilidad. Para imágenes grandes, aplicar la herramienta de compresión de imágenes mantiene el rendimiento de carga de la página.