i < >

IMÁGENES

Para páginas Web generalmente se utilizan tres formatos de archivo gráfico: GIF, JPEG y PNG. Actualmente, GIF y JPEG son los formatos de archivo que cuentan con mayor compatibilidad y pueden verse en la mayoría de los navegadores. Los archivos PNG son los más adecuados para casi cualquier tipo de gráfico Web debido a su flexibilidad y su tamaño de archivo reducido; no obstante, la visualización de imágenes PNG sólo es parcialmente compatible con los navegadores Microsoft Internet Explorer (4.0 y posteriores) y Netscape Navigator (4.04 y posteriores).

Los archivos GIF, o Formato de intercambio de gráficos, Graphic Interchange Format, utilizan un máximo de 256 colores y son idóneos para visualizar imágenes con tonos no continuos o imágenes con grandes áreas de color homogéneo, como barras de navegación, botones, iconos, logotipos:

Archivo GIF con imagen de color homogéneo con 16 colores:
Archivo GIF con imagen de tono continuo con 16 colores:


El formato de archivo JPEG, o Grupo conjunto de expertos fotográficos, Joint Photographic Experts Group, es el mejor para imágenes fotográficas o de tonos continuos, ya que puede contener millones de colores. A medida que la calidad de un archivo JPEG aumenta, también lo hace su tamaño y el tiempo que tarda en descargarse y es necesario conseguir un equilibrio adecuado entre la calidad de la imagen y el tamaño de archivo comprimiendo el archivo JPEG.

Archivo JPEG o JPG con imagen de tono continuo en baja calidad:
Archivo JPEG o JPG con imagen de tono continuo en alta calidad:

El formato de archivo PNG, o Grupo de redes portátiles, Portable Network Group, es un sustituto del formato GIF sin patente compatible con imágenes con color indexado, escala de grises y color verdadero, además de ser compatible con el canal alfa para transparencias y es el formato de archivo nativo de Macromedia Fireworks MX. PNG conserva toda la información original de capas, vectores, colores y efectos, como sombras, y permite editar todos los elementos en cualquier momento. Los archivos se deben guardar con la extensión .png para que Macromedia Dreamweaver MX pueda reconocerlos como tales.

Archivo PNG de 8 bits con 16 colores:

INSERCION DE UNA IMAGEN EN DREAMWEAVER

Al insertar una imagen en un documento de Dreamweaver, el programa genera automáticamente una referencia al archivo de imagen en el código HTML. Para asegurarse de que esta referencia es correcta, el archivo de imagen deberá estar en el sitio actual. Si no lo está, Dreamweaver le preguntará si desea copiar el archivo en el sitio.

Para insertar una imagen, coloque el punto de inserción en el lugar de la ventana de documento en el que desea que aparezca la imagen y, a continuación, lleve a cabo una de las siguientes operaciones:

      • En la categoría Común de la barra Insertar, haga clic en el icono Imagen.
      • En la categoría Común de la barra Insertar, arrastre el icono Imagen a la ventana de documento (o a la ventana de vista Código si está trabajando en el código).
        Elija Insertar > Imagen.
        • Arrastre una imagen desde el panel Activos (Ventana > Activos) hasta la posición deseada de la ventana de documento. Siga con el paso 3.
        • Arrastre una imagen desde el panel Sitio hasta la posición deseada de la ventana de documento. Siga con el paso 3.
        • Arrastre una imagen desde el escritorio hasta la posición deseada de la ventana de documento. Siga con el paso 3.
      • En el cuadro de diálogo que aparece, lleve a cabo una de las siguientes operaciones:
        • Elija Sistema de archivos para elegir un archivo gráfico.
        • Elija Fuentes de datos para elegir una fuente de imagen dinámica.
        • Busque y elija la fuente de imagen o contenido que desee insertar.
        • Si está trabajando en un documento que no está guardado, Dreamweaver genera una referencia de archivo:// para el archivo de imagen. Al guardar el documento en cualquier lugar del sitio, Dreamweaver convierte la referencia en una ruta relativa al documento.
      • En el inspector de propiedades (Ventana > Propiedades), establezca las propiedades de la imagen.

i < >