Formatos de imagen para el diseño web
Cuando utilice imágenes en un sitio web, usted tiene dos cosas a considerar: el formato de imagen y optimización. Cuando recibe estos factores en el clavo, que tiene una imagen de aspecto quebradizo que se carga rápidamente y se ve igual en cualquier navegador web. Si se equivoca, que o bien tienen una imagen que se carga a la velocidad de la luz, pero se ve horrible, o si tiene una imagen que se ve absolutamente precioso pero necesitan tres Forevers a cargar.
El formato de archivo de imagen GIF para el diseño web
Una imagen guardada como un archivo GIF (Graphics Interchange Format) Archivo de un total de 256 colores (8 bits). Las imágenes guardadas con el formato GIF se pueden ver en todos los navegadores web actuales. El GIF (Giff pronunciada o jiff) formato de imagen se utiliza habitualmente para imágenes con grandes áreas de color sólido (como logotipos o símbolos gráficos (como botones). Este formato de archivo también funciona bien cuando la bandera es predominantemente texto.
El tamaño del archivo resultante de la imagen depende de cómo optimizar la imagen. Al optimizar una imagen GIF, se especifica el número de colores con la que se guarda la imagen y el algoritmo de reducción de color. El objetivo es optimizar la imagen de forma que todavía se ve bien y se carga rápidamente.
Las imágenes GIF también apoyan la transparencia. Esta opción es útil cuando se está mostrando texto de la imagen sobre un fondo. Cuando se crea la imagen, utilice un color de fondo similar a, o igual que, la de la imagen de fondo para la página web.
No utilice el formato GIF para guardar las imágenes fotorrealistas con millones de colores. La paleta de colores restrictiva degrada la calidad de la imagen. Si utiliza tramado (Donde los colores de la paleta de 256 colores se mezclan para crear un facsímil razonable de un color no en la paleta), el tamaño del archivo es demasiado grande para el uso práctico en una página web.
El formato de archivo de imagen JPEG para el diseño web
El formato de archivo JPEG (Joint Photographic Experts Group) es ideal para imágenes de calidad fotográfica con millones de colores. El JPEG originales (pronunciado JAY-pegformato) también tiene un derivado conocido como JPEG 2000, que cuenta con una mejor compresión de imágenes que se traduce en archivos más pequeños.
Por desgracia, a partir de este escrito, JPEG 2000 sólo es compatible con Safari. El formato JPEG hace su magia mediante la compresión de imágenes. Al comprimir una imagen, los datos son perdido-, por lo tanto, el formato JPEG es conocido como un formato con pérdida. La figura muestra una imagen JPEG de la cartera web de un fotógrafo.
La calidad de imagen está determinada por la cantidad de compresión se aplica al guardar la imagen. La compresión ideal depende de la cantidad de detalles en la imagen y el tamaño de la imagen en la página web en la que se va a insertar.
Si la imagen es pequeña sin mucho detalle, se puede aplicar una compresión más alta a la imagen. Si la imagen ocupa una gran parte de la página web y contiene una gran cantidad de detalles, que tendrá que aplicar menos compresión para la imagen. De lo contrario, el detalle será fangosa, y la imagen no será quebradizo.
Afortunadamente, la mayoría de las aplicaciones de edición de imágenes, como Photoshop y fuegos artificiales, tienen opciones que permiten comparar la imagen original de lado a lado a una versión de la imagen con compresión aplicada.
Si usted tiene una imagen con una gran cantidad de texto - como una pancarta con un logotipo de texto y un mensaje de texto - guardar la imagen en formato JPEG se traducirá en texto con bordes irregulares debido al suavizado de texto que mezcla los bordes de la texto con la imagen de los alrededores.
La mejor manera de conseguir esto es utilizar una aplicación de edición de imágenes (como fuegos artificiales) que le permite “cortar” una imagen en secciones y luego guardarlos en diferentes formatos.
Guardar las secciones en rodajas con el texto en el formato GIF y el resto de la imagen como archivos JPEG. Al optimizar la imagen, asegúrese de especificar lo suficientemente colores-de lo contrario, verá los bordes dentados en el que el suavizado se mezcla la fuente a un segundo plano.
El formato de archivo de imagen PNG para el diseño web
El formato PNG (Portable Network Graphics) fue diseñado originalmente para reemplazar el formato GIF. Para los gráficos como botones y banners, puede guardar un archivo con formato PNG-8, que se traduce en un archivo de 8 bits que soporta la transparencia. Cuando se trabaja con imágenes fotorrealistas con millones de colores, se pueden guardar los archivos con el formato PNG-24, que guarda el archivo con millones de colores.
La mejor característica del PNG (pronunciado silbido) Formato es que utiliza compresión sin pérdidas, de forma similar a la LZW (lzw) de compresión utilizado al comprimir los archivos guardados como archivos TIFF (Tagged Image File Format). Esto resulta en un gráfico de buen aspecto con un tamaño de archivo relativamente pequeño.
El inconveniente de utilizar el formato PNG ha sido distintos niveles de apoyo de los navegadores web más populares. navegadores actuales ofrecen un mejor soporte para el formato PNG, pero todavía hay problemas cuando se visualizan archivos PNG guardadas con transparencia.