Como mapear una imagen en dreamweaver
Mapear una imagen es una buena opción para insertar varios enlaces de una forma grafica y rápida. Con ello podemos incluir varios enlaces desde diferentes partes de una misma imagen, con lo que si podemos, ganaremos tiempo y espacio, ahorrándonos tener que insertar varias imágenes.
Para explicar como hacer esto, hemos cogido este mapa de las islas canarias, en el cual, vamos a enlazar cada una de ellas a su página correspondiente. Además si dejamos el ratón encima de cualquiera de ellas veremos como tiene que aparecer el nombre de la misma para saber sobre cual estamos.
Esta es la Imagen que hemos cogido:  |
Para ello, insertamos la imagen como lo haríamos normalmente, es decir, una vez incluida en el directorio donde tenemos creado nuestro sitio, damos control+alt+I y la elegimos o bien vamos a Insertar / Imagen.
Una vez que la tenemos insertada, pinchamos sobre ella, vamos al panel Propiedades de nuestro dreamweaver, en el, veremos las herramientas de mapa, con las que vamos a poder seleccionar cada parte de la foto que queramos linkear.
Para ello, seleccionamos cualquiera de las 3 herramientas que más nos venga en cuenta, en este caso la zona poligonal, y vamos haciendo clic alrededor de la isla como vemos en esta imagen:
Una vez completada la zona que queremos linkear, damos al icono del puntero del panel de propiedades 
, y podremos poner la pagina a enlazar en el campo de Vinculo, además de ponerle el nombre alternativo (el que queramos que le salga al usuario cuando pasemos el ratón por encima), todo esto en el mismo panel de propiedades de nuestro dreamweaver.
, y podremos poner la pagina a enlazar en el campo de Vinculo, además de ponerle el nombre alternativo (el que queramos que le salga al usuario cuando pasemos el ratón por encima), todo esto en el mismo panel de propiedades de nuestro dreamweaver.
También es importante saber, por si queremos ser mas precisos, que podemos ayudarnos del zoom, el cual podremos verlo encima de la barra de propiedades, podemos poner un zoom mayor para ir seleccionando la zona y después volver a ponerlo al 100% para ver como quedaría la imagen completa.
configuracion de macros
1 Si no tienes abierto Dreamweaver, ábrelo para realizar el ejercicio.
2 Si no aparece el panel Archivos, ábrelo a través del menú Ventana, opción Archivos.
3 Selecciona el sitio Cocina en el panel Archivos.
4 Haz doble clic sobre el documento quienes.htm, que aparece en el panel Archivos.
Se abrirá el documento en Dreamweaver.
5 Si no aparece el inspector de propiedades, ábrelo a través del menú Ventana, opción Propiedades.
6 Si el inspector de propiedades no se muestra en su totalidad, pulsa sobre el botón 
para desplegar sus propiedades más avanzadas.
para desplegar sus propiedades más avanzadas.
7 Haz clic sobre el menú Insertar.
8 Elige la opción HTML y luego Marcos.
9 Elige la opción Izquierda.
Deberás darle los nombres leftFrame y mainFrame que te vendrán por defecto, para ello tendrás qeu pulsar únicamente el botónAceptar dos veces.
10 Si no aparece el panel Marcos, ábrelo a través del menú Ventana, opción Marcos.
11 Selecciona el documento de marcos. Puedes hacerlo pulsando sobre el borde exterior de los marcos, en el panel Marcos.
12 En Título:, que aparece en la barra de documento, escribe Cocina.
13 En Bordes, del inspector de propiedades, selecciona No.
14 En Ancho escribe 0.
15 En Selección Fila Col. pulsa sobre la columna de la izquierda.
16 En Columna selecciona Píxeles y escribe 270.
17 En Selección Fila Col. pulsa sobre la columna de la derecha.
18 En Columna selecciona Relativo y escribe 1.
19 Pulsa sobre el marco izquierdo en el panel Marcos.
21 En Origen escribe menu.htm.
22 En Desplaz selecciona No.
23 En Bordes selecciona No.
24 Activa la casilla Mismo tamaño.
25 Pulsa sobre el marco derecho en el panel Marcos.
27 En Desplaz selecciona No.
28 En Bordes selecciona No.
29 Desactiva la casilla Mismo tamaño.
30 Selecciona el documento de marcos. Puedes hacerlo pulsando sobre el borde exterior de los marcos, en el panel Marcos.
31 Haz clic sobre el botón Guardar 
de la barra de herramientas. Guarda el documento con el nombre marcos.htm, dentro de la carpeta cocina.
de la barra de herramientas. Guarda el documento con el nombre marcos.htm, dentro de la carpeta cocina.
32 En el caso de haber insertado mapas de imagen en la imagen del logotipo, selecciona cada uno de ellos y elige mainFrame enDestino, que aparece en el inspector de propiedades.
33 Selecciona el primer botón Flash, y pulsa sobre el botón Editar, del inspector de propiedades.
En Destino: selecciona mainFrame.
Pulsa sobre el botón Aceptar.
Haz lo mismo para el resto de botones Flash.
34 Haz clic sobre el botón Guardar todo 
de la barra de herramientas.
de la barra de herramientas.
No hay comentarios:
Publicar un comentario