Un mapa de imagen es una imagen con URL "mapeadas" en él. Puede vestir su sitio web o página de inicio personal con un mapa de imágenes con sus sitios favoritos que le gusta visitar. Hay una gran cantidad de software que puede hacerlo, pero este artículo utilizará Gimp.
Pasos
Paso 1. Elabore un gráfico inicial que estará mapeando
Puede usar imágenes, imágenes, lo que sea que funcione para usted. Aquí, usaremos wikiHow, foro de wikiHow e iGoogle.
Paso 2. Después de crear la imagen (o abrirla), vaya a Filtros >> Web >> ImageMap
La pantalla de diálogo de Gimp ImageMap
Paso 3. Haga clic en el rectángulo a la derecha de la pantalla, luego seleccione una de las imágenes que desea usar
En esta captura de pantalla, se selecciona wikiHow. Complete la información necesaria en la pantalla de diálogo que aparece.
Haga clic en el rectángulo y podrá ver la ubicación exacta del gráfico
Paso 4. Continúe con este proceso para el resto de su mapa
Paso 5. Una vez que haya terminado de definir todas las áreas de enlace, guarde su mapa de imagen
GIMP ofrecerá automáticamente guardar esto como un archivo con una extensión.map. Si lo desea, puede guardarlo así. Pero este archivo contiene el código HTML (sin imágenes) que necesitamos editar y copiar en nuestra propia página web, por lo que se recomienda que lo guarde como [nombre de archivo].html y vaya directamente al paso 7.
Paso 6. SI no lo ha guardado como un archivo HTML, busque su archivo guardado y cambie el nombre de la extensión a.html
Es posible que reciba una advertencia sobre el cambio de extensiones de archivo. Haga clic en sí para continuar.
Paso 7. Utilice un editor de texto para abrir este archivo HTML
Notará que este archivo simplemente contiene una lista de coordenadas y URL. Este es el código que le dice a un navegador qué URL asignar a qué parte de su imagen.
Paso 8. Asegúrese de que la ruta del archivo esté definida en
enlaces a la imagen a la que desea asignar las URL.
Si no apunta correctamente a la imagen, es posible que no se muestre ninguna imagen.
Paso 9. OPCIONAL:
Utilice un navegador para abrir su archivo HTML; si todo funciona, debería ver la imagen con todas las URL asignadas de acuerdo con las áreas que definió.
Paso 10. Agregue su mapa de imágenes en el HTML de su página web
Deberá copiar TODAS las líneas de código que vea, incluido el
etiqueta (que define la ruta a la imagen de origen) y todo lo que hay entre las etiquetas. ¡Eso es todo! Ya terminaste.