La verdad es que no hay unos parámetros «únicos» para optimizar una fotografía para web que va a ser insertada. Ya que lo primero que hay que tener en cuenta es que cada fotografía es diferente y dependiendo de la calidad con que la hayamos tomado la calidad final, según los parámetros que escojamos, puede ser diferente.

Pero aún así os recomendaré unos pasos a seguir, que más o menos te pueden llevar a una optimización ideal, o por lo menos una de las más usadas.

Lo primero que hay que tener en cuenta es lo siguiente:

  • Para fotografías con transparencia hay que guardar en formato PNG, siempre.

  • Para fotografías que yo denomino «normales» hay que guardar en formato JPG.

  • Para animaciones hay que guardar en formato GIF.

Hay que tener claro que dependiendo del diseñador hay quien usa en vez del formato jpg el formato gif o png. Pero yo en mi caso suelo usar lo comentado arriba, según el tipo de fotografía que voy a insertar.

A continuación enumeraré los pasos a realizar utilizando el programa Adobe Photoshop para optimizar las fotografías a insertar en una web:

1.- Lo primero que debes de hacer es comprobar que la fotografía está en modo RGB con 8 bits por canal. Para ello vé a: Imágen –> Modo

Optimizar fotografías para web con Photoshop - paso 1
 NOTA: si la fotografía no estuviera en el modo adecuado tú mismo puedes cambiarlo.

2.- Ahora comprueba el tamaño que tiene la fotografía en Imágen –> Tamaño de Imágen

Optimizar fotografías para web con Photoshop - paso 2

3.- Y ahora le pones el tamaño que deseas que tenga en tu web de la siguiente forma:

  1. Las propiedades «Cambiar escala de estilos»,  «Restringir proporciones» y «Remuestrear imagen» deben de estar activadas tal como se indica en la imágen siguiente.

  2. Resolución = 72 pix/pulgada (ya que aunque pongas mayor resolución los monitores no la van a sacar).

  3. Ancho y Alto: el que desees que tenga la fotografía.

Optimizar fotografías para web con Photoshop - paso 3

4.- Ahora es cuando optimizaremos la imágen mediante: Archivo –> Guardar para Web …

En primer lugar optimizaremos la fotografía para guardarla como JPG, para ello os recomiendo que en ajuste predeterminado uséis JPEG alta. (como ya expliqué al principio del post según la calidad con la que se tomó la fotografía la calidad podría ser más alta o más baja, pero yo os recomiendo trabajar entre 50 y 70. En principio dejarla con 60 de calidad.

NOTA: si usamos la pestaña 2 copias o 4 copias observaremos en la parte inferior de la fotografía lo que ocupará la imagen y así mismo observaremos de primera mano la calidad con que se verá en nuestra web.

 NOTA: comprobar en la columna derecha abajo el tamaño de la imagen.

Observar en la imagen anterior las flechas rojas y dejarlo tal cual está en la imagen.

Si deseáis optimizar la imagen (porque es una transparencia) utilizar en Ajuste preestablecido PNG-24, y dejar las otras casillas y propiedades tal cual están en la imágen.

Optimizar fotografías para web con Photoshop - paso 4 - png

 NOTA: comprobar en la columna derecha abajo el tamaño de la imagen.

6.- Y por último pinchar en el botón GUARDAR … y guardar la imagen en la carpeta que deseéis y ponerle el nombre que queráis.

Esto ha sido todo en este post, espero os haya quitado alguna duda para cuando tengáis que optimizar algunas imágenes para insertar en vuestra web.

A vuestra disposición en Virtual Web Estudio.