Para insertar una imagen es conveniente tenerla previamente guardada en la carpeta del sitio. De lo contrario Dreamweaver nos advertirá para que lo hagamos.
Las imágenes pueden estar sueltas en la carpeta raíz junto con los archivos de cada uno de los documentos o, mucho mejor, en una carpeta especial dentro del sitio a la que llamaremos imagenes ( nombre de los archivos y carpetas sin acentos ) o cualquier otro nombre que nos sugiera que, dentro de esa carpeta, están nuestras imágenes.
Para crear una carpeta dentro de la carpeta raíz del sitio: pinchamos sobre la carpeta raíz en el panel lateral derecho con el botón derecho del ratón y, en el menú conextual, elegimos Nueva carpeta
Aparecerá una nueva carpeta. DW le habrá puesto como nombre untitled
Nosotros le cambiamos el nombre:
Podemos llevar las imágenes a la carpeta por cualquiera de los procedimientos habituales en Windows. Si por ejemplo, tal como indicábamos al principio, la imagen no está previamente guardada en la carpeta, Dreamweaver nos va a sugerir que lo hagamos. Supongamos que queremos insertar una imagen que tenemos guardada en el Escritorio. La imagen se llama enobras.gif
Pinchamos en Insertar de la barra de menús y soltamos en Imagen :
Se abre la ventana del explorador para que localizemos la imagen que queremos insertar:
Le damos a Aceptar. Como la imagen está fuera de la carpeta raíz del sitio, aparece este mensaje de advertencia:
Le decimos que sí y se nos abre la carpeta raíz del sitio:
Hacemos doble clic sobre la carpeta imagenes:
Y le damos a Guardar. La imagen se habrá colocado en el documento y en la barra lateral derecha, en archivos, podremos ver la imagen dentro de la carpeta imagenes
Observa la imagen colocada en el documento. Como está seleccionada, el panel del Inspector de Propiedades estará referido a la imagen:
Una imagen puede colocarse también como fondo de una página, o de una tabla, o de una celda. Por ejemplo, en la tabla que hemos creado en el apartado anterior vamos a poner un fondo en la primera celda de la primera fila (vamos a hacerlo desde este propio documento). Insertamos la tabla y situamos el cursor en la primera celda:
Lunes |
Martes |
Miércoles |
Jueves |
Viernes |
|
Mañana | Aula 1 | Aula 2 | Aula 1 | Aula 2 | Aula 1 |
Tarde | Aula 1 | Aula 3 | Aula 1 | Aula 2 | Aula 1 |
Noche | Tiempo libre |
Fiesta final |
Y, en el panel del Inspector de Propiedades, nos fijamos en
Una forma de hacerlo es pinchar en y, sin soltar el ratón, arrastar hasta pillar la imagen que queremos colocar (en este caso se llama fondo01.gif) en el panel de archivos de la derecha:
La imagen se habrá colocado como fondo de esa celda:
Lunes |
Martes |
Miércoles |
Jueves |
Viernes |
|
Mañana | Aula 1 | Aula 2 | Aula 1 | Aula 2 | Aula 1 |
Tarde | Aula 1 | Aula 3 | Aula 1 | Aula 2 | Aula 1 |
Noche | Tiempo libre |
Fiesta final |
A propósito de las imágenes, es muy importante que controlemos el tamaño de las mismas para que no tarden mucho tiempo en su descarga cuando alguien visite nuestra página. Cuando insertamos una imagen aparece, en el panel del Inspector de Propiedades, una información sobre el tamaño. Otra forma de ver estos tamaños es pulsando el icono
( Ampliar/contraer) de la franja lateral derecha.
La ventana se ampliará proporcionando información sobre los tamaños de los archivos:
Así observamos que nuestro fondo, el fondo01.gif ocupa 3 KB que es un tamaño adecuado. Observa, también, los dos formatos de imagen que aparecen aquí el .gif y el .png Los dos son muy similares, se emplean para imágnes con colores planos. El tercer formato de la web, el .jpg se emplea para imágenes con muchos matices de color.
El formato .ico es un formato de iconos. Lo que ves allí es un favicon o una pequeña imagen a modo de logotipo que se sitúa delante de la dirección URL de la página y en los listados de los favoritos.
En cuanto a los gifs, decir que un uso muy extendido son los gif animados que son imágenes con cierto movimiento que no ocupan demasiado espacio. Por ejemplo:
La imagen ocupa 9 KB y, siempre sin hacer un uso abusivo, estos gifs animados pueden alegrar nuestra páginas.
(Nota: Dreamweaver hace un cálculo del tamaño por aproximación redondeando al valor en KB más próximo por arriba -17,2 KB se convierte en 18 KB por ejemplo-. Si deseas ver el tamaño exacto lo puedes hacer desde el explorador de Windows: te situas con el botón derecho del ratón encima de la imagen y le das a Propiedades )
Este gif se ha sacado de la siguiente dirección: http://ausmall.com.au/freegraf/freegrfa.htm
Aunque hay muchos otros sitios web que proporcionan gifs animados, y sin animar, de forma gratuita.