> Manuales > Formatos de imagen para Web

Ahora veremos las características gráficas de cada formato, esto es, como se comportan visualmente en entornos de edición.

Cierra Photoshop y abre DreamWeaver

1. En el cuadro de bienvenida pide un archivo nuevo haciendo clic en HTML de la columna Create New


2. En la barra de menú Modificar>Propiedades de la página ( Modify> Page Properties). En el cuadro propiedades de página clic en el botón Examinar para buscar una imagen de fondo.


3. En el cuadro seleccionar origen de la imagen (Select Image Source) busca fondo.gif en la carpeta del ejercicio que copiaste al escritorio. Clic en aceptar al cuadro de advertencia y Aceptar (OK) al cuadro Propiedades de la página.

La imagen debe abarcar todo el fondo de tu página.


4. En la barra de menú Insertar>Imagen. Busca la carpeta donde guardaste los archivos creados en Photoshop.


5. Selecciona flatGIF y clic en Aceptar. En el cuadro de advertencia clic en Aceptar.

La imagen aparece en tu página

6. Inserta del mismo modo cada una de las imágenes que exportaste de Photoshop y checa su comportamiento con respecto al fondo. Presiona f12 para una previsualización Web.

7. Notaras que la transparencia de png 24 no es reconocida por Dreamweaver mientras que la de GIF y PNG8 si es respetada. A esto me refiero cuando hablo de la compatibilidad de los formatos. En general los programas de edición de imagen o video reconocen sin problemas los canales Alpha o de transparencia de los formatos que exportamos. Dreamweaver no es un editor de imagen por eso sus posibilidades se limitan al lenguaje que maneja (HTML) y a los navegadores WEB donde se verá el producto final que no todos reconocen png24 sin la ayuda de otros lenguajes anidados o de dePlug-ins.

8. Abre Illustrator y pide un documento nuevo y en blanco.

9. Dibuja algunos objetos en la capa 1

10. Crea una capa nueva. Elije File> Place.

11. Ahora: importa una imagen de las que guardamos con Photoshop, pon atención en su formato ( gif, jpg, png…) y observa su comportamiento con respecto a la capa 1 que hace de fondo.

Este programa sí reconoce la medias transparencias de PNG24, o transparencia Alfa, permitiendo resultados gráficos muy variados, que la transparencia total de GIF no permite. Conociendo las características de cada formato y su comportamiento gráfico puedes seleccionar el formato que más te convenga según las necesidades gráficas de tu proyecto.

Luis Aceves

Manual