Cómo Optimizar Imágenes JPEG para la Web - Dummies

Tener imágenes llamativas en su sitio web es una de las mejores maneras de atraer entusiastas de iPhone y iPad conscientes de la imagen. El formato JPEG es la mejor opción para optimizar imágenes de tono continuo, como fotografías e imágenes con muchos colores o degradados.

Cuando optimiza un JPEG, puede reducir el tamaño del archivo aplicando compresión. Cuanta más compresión, más pequeña es la imagen, pero si comprimes demasiado la imagen, la imagen puede verse terrible. El truco es encontrar el equilibrio correcto.

Si tiene una fotografía digital u otra imagen que desea preparar para la web, siga estos pasos para optimizarla y guardarla en Photoshop (en Photoshop Elements o Fireworks, el proceso es similar aunque el los pasos específicos pueden variar):

1 Con la imagen abierta en Photoshop, elija Archivo → Guardar para Web y dispositivos (o Archivo → Guardar para Web).

Aparece el cuadro de diálogo Guardar para Web y dispositivos.

2En la esquina superior izquierda del cuadro de diálogo, elija 2 arriba o 4 arriba para mostrar varias versiones de la misma imagen para una fácil comparación lado a lado.

La configuración 2-Up permite ver la imagen original en la parte superior y una vista previa de la misma imagen que aparecerá con la configuración especificada en la parte inferior (si está trabajando con una imagen vertical, las vistas previas) aparecer uno al lado del otro). La opción 4-Up, como su nombre lo indica, muestra cuatro versiones diferentes para comparar.

Imágenes de los artistas Amy Baur y Brian Boldon, de inplainsight art.

3En el lado derecho de la ventana, justo debajo de Preset, haga clic en la flecha pequeña para abrir la lista desplegable Formato de archivo optimizado y elija JPEG.

El formato JPEG es la mejor opción para optimizar imágenes de tono continuo, como fotografías e imágenes con muchos colores o degradados.

4 Establezca la calidad de compresión.

Use las opciones predeterminadas Bajo, Medio, Alto, Muy alto o Máximo de la lista desplegable. O use el control deslizante justo debajo del campo Calidad para realizar ajustes más precisos. La reducción de la calidad reduce el tamaño del archivo y hace que la imagen se descargue más rápidamente, pero si baja este número demasiado, la imagen se verá borrosa y con manchas.

Photoshop usa una escala de compresión de 0 a 100 para archivos JPEG en esta ventana de diálogo, con 0 la calidad más baja posible (la mayor cantidad de compresión y el tamaño de archivo más pequeño) y 100 la calidad más alta posible (la menor cantidad de compresión y el tamaño de archivo más grande). Bajo, Medio y Alto representan valores de compresión de 10, 30 y 60, respectivamente.

5Especifique otras configuraciones como desee (la calidad de compresión y el formato de archivo son los ajustes más importantes).

Por ejemplo, puede seleccionar la casilla de verificación Progresivo para mostrar la imagen progresivamente en un navegador web; es decir, mostrarlo primero a baja resolución y luego a resoluciones progresivamente más altas a medida que avanza la descarga. (Algunos navegadores no son compatibles con archivos JPEG progresivos).

6Haga clic en Guardar.

Se abre el cuadro de diálogo Guardar optimizado como.

7Ingrese un nombre para la imagen y guárdela en la carpeta de imágenes de la carpeta de su sitio web.

Photoshop guarda la imagen optimizada como una copia del original y deja el original abierto en el área de trabajo principal de Photoshop.

Repita estos pasos para cada imagen que desee optimizar como JPEG.

En la parte inferior de la vista previa de la imagen en el cuadro de diálogo Guardar para Web y dispositivos, Photoshop incluye una estimación del tiempo requerido para que la imagen se descargue a la velocidad de conexión especificada. A medida que ajusta la configuración de compresión, el tamaño de la imagen cambia y la estimación de descarga se ajustará automáticamente.

Puede cambiar la velocidad de conexión utilizada para hacer este cálculo haciendo clic en la flecha pequeña justo a la derecha de la velocidad de conexión y usando la lista desplegable para seleccionar otra opción, como 256 Kbps para la velocidad del módem por cable. Use esta estimación como una guía para ayudarlo a decidir cuánto debe optimizar cada imagen.