Mapeo de imagen HTML Tutorial

mapeo de imágenes es el proceso de convertir parte de una imagen en un enlace de Internet activa. Mientras que los sitios web como Facebook utilizan Java script para hacer esto, enlaces a las imágenes de mapeo se pueden hacer a través de código HTML también. Se llevará a la práctica de dominar, y usted puede notar que tiene un tiempo difícil colocar los enlaces al principio, pero con un poco de experiencia que puede convertir cualquier imagen en un directorio de enlaces para los visitantes del sitio para disfrutar.

Seleccione su imagen

Aunque se puede usar cualquier técnica de imagen que desea, se recomienda que utilice una imagen que tiene símbolos identificables que se pueden utilizar como marcadores para sus enlaces. Independientemente de la imagen que desee utilizar, asegúrese de que se carga en el servidor para que pueda ver y controlar su progreso a medida que intenta hacer un mapa.

Determinar coordenadas de imagen

Una vez que tenga su imagen seleccionada, es necesario designar las áreas que tiene la intención de asignar enlaces a. Esto se puede hacer una de tres maneras. Para crear áreas rectangulares, tendrá las coordenadas de las esquinas superior izquierda e inferior derecha de la caja. áreas circulares que requieren para dar el tamaño del radio, así como el punto de que servirá como el centro del círculo de coordenadas. áreas poligonales se requiere que tenga las coordenadas de todos los puntos que desea tener forma de la zona.

¿Cómo se obtiene las coordenadas? Usted tendrá que tener un programa de edición de imágenes como Photoshop. Si su PC funciona con un sistema operativo Windows (sistema operativo), puede utilizar Microsoft Paint para encontrar todas las coordenadas que necesita para cada imagen. Sólo asegúrese de escribirlas para referencia futura.

Código de la Imagen

Una vez que tenga la imagen y las coordenadas que desea utilizar para mapear sus enlaces, se puede escribir el código. Cada mapa de imagen requerirá un nombre. Un ejemplo de esto, en el código, sería:

<Map name = "demanda">

"La demanda" es el nombre de su mapa. A partir de ahí, se introduce el código para cada uno de los enlaces del mapa. Que se verá de la siguiente forma (poligonal utilizado como un ejemplo):

<Area shape = coordenadas del polígono "" = "4, 8, 15, 16, 23, 42" href = "http://www.ehow.com" rel = "nofollow">

Deberá repetir este código, el cambio de las coordenadas como sea necesario, hasta que se haya asignado la imagen a su gusto. Sólo recuerde que una vez que haya terminado el mapeo de su imagen, cerrar el mapa mediante el uso de la etiqueta </ ​​map> código HTML.