Cuando vamos a utilizar imágenes en la web que han sido previamente utilizadas para diseñar medios impresos (por lo general TIFF en CMYK o Escala de Grises) es necesario convertirlas primero a un formato que sea compatible con los estándares de internet para una correcta visualización y que pese lo menos posible para que la descarga no sea tardada.

Las dimensiones y peso de las imágenes que van destinadas a impresos suelen ser muy variadas y por lo general andan pesando arriba de los 5Mb, tal peso en la Web es un SEVERO inconveniente, por lo que una imagen para internet debe pesar cuando mucho 70Kb para que descargue rápido y el navegante no se nos vaya a otra parte.

Independientemente del peso y dimensiones de la imagen, es necesario hacer como MINIMO 4 cambios en las siguientes áreas: Color, Dimensiones, Resolución y Compresión. Considerando que el Photoshop es el programa generalmente utilizado para la manipulación de imágenes los screencaps que siguen son de este programa, el mío está en inglés pero la ruta es equivalente en español

Color: Las imágenes CMYK no se visualizan en Internet o lo hacen de una forma curiosa que generalmente no es la deseada, además pesan mucho. Lo ideal para Web es el RGB cuando vamos a guardar en JPG y el Indexed Color cuando vamos a generar un GIF. Para el caso de este post lo manejaremos con RGB para obtener un JPG.

Image> Mode>

colormode

Dimensiones: La pantalla de la “mayoría” de los monitores sigue siendo de 800×600 pixeles (aun cuando hay monitores que la triplican no todo el mundo sabe configurarlos para tal fin), así que todo lo que queremos que se visualice dentro de un monitor “estándar” deberá tener dimensiones inferiores a 800×600 pixeles… NO cm, NO pulgadas, NO picas, etc… PIXELES. Por lo general una foto tamaño postal puede visualizarse perfectamente a unos 550 x 330 pixeles.

Resolución: Este debe ser el concepto más difícil de superar sobre todo para los diseñadores que vienen de los medios impresos sobre todo del offset a color (como fue mi caso), donde a mayor resolución mejor calidad se obtendrá al imprimir a mayor lineaje, y vemos archivos de 250 y 300 dpi. En la Web es muy diferente, el estándar es de 72 dpi (o máximo 96 dpi con compresiones bajas), esto parece no tener sentido y existe el miedo de que la imagen no se visualice bien, pero ciertamente SI SE VISUALIZA PERFECTO A 72 DPI.

Image> Image Size>

imagesize

Compresión: Este es uno de los beneficios del JPG, que se puede comprimir “bajándole la calidad” de manera imperceptible al ojo humano pero notoriamente en el peso en kilobytes, esto lo hace un archivo aun más ligero. Por lo general una calidad de 7 es bastante aceptable y el formato Progresivo nos ayuda a que la imagen se vaya visualizando en “bandas” o Scans para que el navegante no vea “blancos” mientras bajan las imágenes y se vaya a desesperar. Entre mas scans mas rápido bajaran imágenes grandes, para imágenes pequeñas con 1 o 2 Scans es suficiente.

File> Save As>

jpgoptions

Sphere: Related Content