Lo primero de todo será explicar en que consiste un mapa de imágenes, aunque el nombre parece rebuscado lo usamos a diario en casi todas las paginas Web que navegamos. Los mapas de imágenes sirven básicamente para redirrecionar a otra página usando un enlace oculto en una imagen, como ejemplo podéis hacer clic en la imagen de la casa y os llevara a la página principal del blog.
Podria haberse hecho un simple link es cierto, pero en algunos casos puede lucir mejor usar imágenes para desplazar a nuestros navegantes, no obstante debemos tener un criterio para usarlo, pues recargar nuestra Web de imágenes y otros artilugios pueden ralentizarla en exceso y lograr el efecto contrario que pretendemos conseguir. Ahora os mostrare la sintaxis.
Para elaborar un mapa de imagen con el ejemplo de la casa vamos a usar los atributos basicos :
<map>.....</map> Delimitan el mapa de la imagen.
<area> Define las areas donde vamos a activar la imagen y acompañan los siguientes atributos:
• shape= forma puede ser rectangular (rect) poligonal(poly) y circular (circle)
• Coords= indica las cordenadas de cada punto.
• Href=La pagina a la que dirijimos la imagen.
Ejemplo
<IMG SRC="/graficos/bebe1.jpg" WIDTH=140 HEIGHT=210
BORDER=0 ALT="Una casa " USEMAP="#casa ">
<MAP NAME="home">
<AREA SHAPE=CIRCLE COORDS="60,56,47"
HREF="#" ALT="tejado ">
<AREA SHAPE=POLY COORDS="3,182,36,178,
44,165,60,169,66,184,62,196,
43,201,35,190,0,193,0,183"
HREF="#" ALT="suelo ">
</MAP>
Articulo BY S3L3N1TY
No hay comentarios :