19 dic. 2014

HTML Map Creator o cómo añadir links a tus imágenes


M&2BlogServicios editorialesCommunity ManagementHTML Map
Me encanta esta herramienta que permite añadir links a las imágenes que vas a utilizar en tus post o RRSS. Es muy útil para campañas en las que quieres que tus clientes puedan acceder a distintos sitios de tu web, o para que en un proyecto en el que participan varias personas o compañias diferentes, se pueda acceder a todas sus páginas desde una misma imagen.

HTML Map Creator es una herramienta muy sencilla. Aunque en un futuro permitirá que subas tus imágenes desde tu propio ordenador, por ahora, y ese es un problemilla fácil de resolver, tienes que hacerlo desde una URL.

Para esto tenemos imgur, una herramienta que te permite subir diferentes imágenes, para luego poder usarlas en algunos sitios concretos.  Por ejemplo, si quieres hacerte una Fan page de Facebook, que diferencia entre una página de bienvenida para no fans, y otra para Fans, tendrás que recurrir a este repositorio y guardar aquí tus fotos, porque Facebook no admite que se suban imágenes de ninguna otra forma.

Os explico cómo funciona

Primero debéis tener una cuenta en Imgur y desde allí subir las fotos que queráis utilizar. 




Esta herramienta os permite crear carpetas y guardar allí las imágenes relacionadas, como en la imagen de mi carpeta.


Ahora vamos a copiar la Url de la imagen que queramos utilizar para crear el Html Map. Y nos vamos a la página de HTML Map Creator. Para ello, seleccionamos la imagen y se abrirá a la derecha un listado de links con varias opciones según para qué queramos la imagen, y su tamaño.



La opción que tenéis que copiar es la de Direct Link (email & IM). Copiamos la Url y nos vamos a Html Map Creator. Introducimos la Url en el lugar indicado, le damos a Start y ya tenemos nuestra imagen subida.


Ahora sólo tenemos que ir selccionando zonas de las imágenes y añadirle el link hacia dónde quiere que nos lleve.


Yo voy a configurarlo de modo que la Mariposa redirija a la página institucional, y Servicios Editoriales y Community Management a cada una de las secciones de la página. Una vez hecho, aceptamos y obtenemos los códigos html para incluir en el post o la página en dónde quieras insertar la imagen.



Y listo. Ya tenemos nuestra imagen para poder interaccionar con ella en cualquier sitio.


M&2BlogServicios editorialesCommunity ManagementHTML Map
¿Qué os ha parecido?

Saludos,