Morton 28 de agosto de 2011 a las 04.23
   Imprimir artículo
elWebmaster.com

C贸mo enlazar partes de una imagen en 3 simples pasos


css3wide1Si tienes una imagen que deseas usar como p谩gina de inicio, y quieres que la misma contenga zonas que al ser cliqueadas, vinculen a otras p谩ginas, est谩s hablando de una t茅cnica llamada “image mapping”. Existen diversas maneras de hacerlo, pero nosotros te ense帽aremos un truco muy sencillo para lograrlo.

1) Puedes utilizar esta herramienta llamada Online Image Mapper. All铆 tan s贸lo debes seleccionar la imagen desde tu PC o colocar la URL de la imagen que utilizaremos (puedes alojarla en un sitio gratuito de im谩genes, pero lo ideal es que est茅 alojada en tu propio servidor).

2) Ahora, haz clic en Start Mapping. Aguarda unos segundos a que la imagen se cargue del todo y luego haz clic en 鈥淐ontinue To Next Step鈥. All铆 ver谩s una serie de opciones que puedes configurar a tu gusto, o simplemente dejarlas como est谩n. Ahora elige la herramienta de rect谩ngulo, o custom si tienes una forma irregular.

3) Selecciona las partes de la imagen que deseas mapear. Redimensi贸nalas, y luego coloca la URL a la que deseas que est茅 enlazada la zona de la imagen que acabas de seleccionar. Repite el procedimiento todas las veces necesarias, y cuando hayas terminado, haz clic en “Get Code”.聽 Copia y pega ese c贸digo en cualquier parte de tu sitio que desees que aparezca esa imagen. 隆Y listo!

Aqu铆 debajo te mostramos un ejemplo de c贸mo deber铆a verse terminado:

Fuente original del art铆culo: BloGigs
Traducci贸n realizada por
elWebmaster.com


Enviar a Del.icio.us Enviar a Meneame Enviar a Digg Enviar a Fresqui Enviar a Enchilame

Comentarios (4)

  1. Su dice:

    Muy buen articulo, hace unas semanas tenia problemas con esto ahora tengo una alternativa gracias

  2. Al dice:

    Muy bueno! Cre铆 que no era posible sin partir la imagen en varias secciones.

  3. Mali Mazko dice:

    Muy Bueno el Articulo, mas ahora que la tendencia es a clicquear dentro de una zona de imagenes. Lo aplicare..!

  4. :) dice:

    Muchisimas Gracias! Me a servido un mont贸n!
    :)

Deja tu opinión

© 2007 - 2008 elWebmaster.com | Powered by Wordpress | Diseño CSS y XHTML válido. | Algunos íconos basados en FamFamFam Mini
Acceder