En este tutorial de html, verás como crear un vinculo en una imagen, pero el vinculo vamos a insertar en una zona de la imagen y no en toda.
Antes de ello debes saber como crear vínculos en html igualmente te mostré en otro tutorial como agregar imágenes en una pagina web.
La técnica de Mapear una imagen, se trata nada más de delimitar a zonas en una imagen para insertar vinculos que lleven a otra pagina web o a un correo electrónico. Como parte del curso de páginas web aprenderás a mapear una imagen y vincular cualquier area de una imagen a otro sitio web, una página web interna de tu sitio o un Email
Dreamweaver realiza esta tarea por nosotros, en el video veremos como mapear una imagen para enlazarla con las paginas web internas de nuestro sitio y hacer este navegable.
El mapeo sirve no solamente para menus de navegacion, sino para enlazar zonas de una imagen (foto tuya) con tu sitio web, por ejemplo.
Es importante que tener en cuenta que los enlaces resultantes no son rastreables por Google, te lo digo solo para que lo sepas.
Otro aspecto a mensionar es que Dreamweaver inserta al final de tu código html y antes de cerrar el BODY la etiqueta MAP, el codigo del ejemplo es el siguiente:
<img usemap=”#Map” src=”images/barranavegacion.gif” border=”0″ alt=”" width=”800″ height=”73″ />
<map id=”Map” name=”Map”>
<area shape=”rect” coords=”133,41,212,62″ href=”pagina1.html” />
<area shape=”rect” coords=”231,42,312,65″ href=”lipsum.html” />
<area shape=”rect” coords=”329,39,412,64″ href=”leccion3.html” />
<area shape=”rect” coords=”435,43,514,65″ href=”leccion4_vinculos.html” />
<area shape=”rect” coords=”533,41,606,64″ href=”leccion5_imagenes.html” />
</map>
No hay comentarios:
Publicar un comentario