Buscar este blog

viernes, 26 de noviembre de 2010

2.7. MANIPULAR IMÁGENES Y ANIMACIONES EN UNA PAGINA WEB.


Las imágenes pueden ser de muchos formatos diferentes: bmp, gif, jpg, etc. Pero no todos estos formatos son adecuados para una web, debido a que pueden ocupar mucha memoria o a que no son compatibles con algunos navegadores.
Los formatos más utilizados son el GIF y el JPG, que a pesar de ser imágenes de menor calidad que las imágenes BMP, son más recomendables debido a que ocupan menos memoria. Vamos a ver un poco más sobre estos formatos:
Formato GIF:
Utilizan un máximo de 256 colores, y son recomendables para imágenes con grandes áreas de un mismo color o de tonos no continuos. Suelen utilizarse con gran frecuencia, ya que permiten contener transparencias y animación.
Formato JPG:
Las imágenes son de mayor calidad que las GIF, al poder contener millones de colores, pero el tamaño de la imagen es mayor y tarda más en descargarse.

Puedes incluir imágenes en otros formatos a través de Dreamweaver, que podrán ser  visualizadas en algunos navegadores. Este es el caso de las imágenes BMP y PNG.

Si introduces una imagen BMP en Dreamweaver, te aparecerá un cuadrado gris en su lugar. La imagen solo se mostrará correctamente en el navegador.

Para insertar una imagen, debe utilizar la siguiente sintaxis: 

<img src="imagen.jpg"> 

En ésta instrucción se da por defecto que la imagen que se inserta tiene la extensión JPG. Para insertar otro tipo de imagen sólo deberá especificar la extensión correspondiente. Las imágenes pueden ser adquiridas de la galería de imágenes de Microsoft, o de cualquier otra imagen digitalizada. Incluso se pueden crear iconos animados desde algún programa de animación, y usarlos en una página Web.
Selección del formato
Uno de los grandes dilemas a la hora de incluir gráficos en sus páginas Web es elegir el formato adecuado para cada tipo de imagen, vamos a intentar guiarle en la selección de cada formato.
Imágenes fotográficas

 
Imágenes obtenidas a través de fotografías de personas o lugares. Para este tipo de imágenes el formato más recomendado es el JPEG porque consigue una gran compresión con una mínima pérdida de calidad.

Imágenes renderizadas
Este tipo de imágenes son las obtenidas por un programa de generación de imágenes sintéticas mediante algún proceso de trazado de rayos o similar. Se caracterizan por degradados suaves y líneas muy bien definidas.
Para este tipo de imágenes es recomendable usar el formato PNG. Tenga presente que el formato PNG es el más reciente y puede no estar soportado en todos los navegadores.


La siguiente línea de código muestra el ejemplo de inserción de imágenes como hipervínculos.

<a href="carrera.htm"><img border=0 src="carrera.jpg" ></A>

La primera instrucción indica el nombre de la página a la que se desee acceder cuando se haga clic en el hipervínculo. La segunda instrucción inserta la imagen en la página Web.
La manera más sencilla de añadir una imagen a nuestra página es desplegando al menú insertar, de la barra menú, y buscar en él la opción imagen. 







En la ventana de diálogo que Dreamweaver nos abrirá, podremos buscar la imagen que queramos insertar en nuestra página, simplemente tenemos que seleccionarla y pulsar el botón aceptar de la ventana diálogo.





Observa que imagen se ha insertado en la posición que ocupaba el cursor en el momento de añadir la imagen, también podemos escribir texto en la misma línea que insertamos la imagen.
Podemos combinar en la misma línea texto e imágenes, sin importar el orden. Podemos escribir una línea de texto y en cualquier punto de ella insertar la imagen, o podemos insertar primero la imagen y después escribir un comentario a su lado.

No hay comentarios:

Publicar un comentario