Tamaño y peso de las imágenes

Muchos de nosotros hemos comprobado, y sufrido, cómo una página web con bastantes imágenes se ralentizaba o, como un mensaje de correo electrónico con un powerpoint de fotos adjunto, parecía que no se iba a descargar nunca.

Un concepto y expresión que usamos al hablar de imágenes es el de tamaño. Este término puede ocasionar confusión ya que solemos emplearlo para cosas diferentes: normalmente decimos que una imagen tiene un tamaño de 13 x 18 cm o 1024 x 768 píxeles, pero también decimos que una imagen tiene un tamaño de 3 Mbytes. Este uso impreciso de la palabra no suele causar mayores problemas, pero para los objetivos del curso sí que es importante matizar, ya que son dos características diferentes de una imagen.

De esta forma, en este tema, cuando hablemos del tamaño nos referiremos sólo a las dimensiones de la imagen: 13 x 18 cm, 1024 x 768 píxeles; y cuando se hable del espacio que ocupa la imagen en el dispositivo de almacenamiento –disco, memoria…- (3 Mbytes o 149 Kbytes) lo definiremos como peso.

De esta manera, podemos decir que una imagen es:

• • Grande cuando tiene un tamaño igual o mayor a 1024x768 píxeles

  • Mediana cuando el tamaño va de 320x240 a 1024x768 píxeles

  • Pequeña cuando el tamaño es menor a 320x240 píxeles

  • Muy pequeña cuando es menor a 100x100 píxeles

O que es:

• • Pesada si tiene 1 MB o más

  • De peso mediano si va de 300KB a 1 MB

  • Ligera si su peso es menor de 300KB

  • Muy ligera si el peso es inferior a 100KB

Al reducir de peso las imágenes (de mapa de bits) hacemos que tengan menos bytes y, por tanto, que:

• • Ocupen menos espacio en un dispositivo de almacenamiento. Por ejemplo, el disco duro de un servidor de Internet acojerá más imágenes en un mismo espacio.

  • La transferencia de datos por una red sea más veloz, acelerando así la descarga de imágenes y la navegación por internet.

Aligerar ≠ Optimizar

Puede darse que el caso que al “aligerar” de peso una foto, la reduzcamos también de calidad. Al optimizar, lo que pretendemos es reducir el peso lo máximo posible, pero sin que la imagen sufra pérdida de calidad aparente.

Veamos un ejemplo.

Observa atentamente las dos imágenes (jpeg) siguientes e intenta descubrir diferencias de calidad.

Una vez comparadas, crees que...

a) Ambas tienen un peso similar

b) La imagen 1 pesa más

c) La imagen 2 pesa más

Para salir de dudas, puedes ver tú mismo el peso de cada una haciendo clic con el botón derecho sobre ellas y seleccionando en el menú contextual "Ver información de la imagen" o "Propiedades" (dependerá del navegador web que uses) El peso se ve en Tamaño (Size of file) También puedes descargar ambas fotos haciendo clic sobre ellas con el botón derecho del ratón y seleccionando "Guardar imagen cómo" Luego puedes ver el peso de cada archivo viendo sus propiedades.

La respuesta correcta es la b ya que la imagen 1 pesa 173,9 KB y la imagen 2, 19,13 KB.... Pasamos de una fotografía ligera a otra muy ligera, y ambas tienen una calidad similar.

A efectos prácticos, esto significa que la imagen 2 se descargará más rápidamente y/o que en un dispositivo de almacenamiento, como el disco duro de un servidor de internet podremos tener muchas imágenes y no tendremos necesidad de contratar más espacio.

Si en lugar de fotografías (en formato JPEG), la optimización se hace a otro tipo de imágenes con menos detalles la reducción de peso puede ser mayor. Veamos otro ejemplo:

Imagen en formato BMP [125,91 KB]

Imagen en formato JPEG -compresión mínima- [49,35 KB]

Imagen en formato JPEG -compresión media- [11,45 KB]

Imagen en formato PNG [8,71 KB]

Imagen en formato GIF [6,05 KB]

De la imagen BMP a la GIF se ha reducido el peso más de 20 veces y ambas son muy parecidas.

En el primer ejemplo de los timbres, hemos utilizado una fotografía digital, para usar, por ejemplo, en un blog. Las fotografías, cómo ya se dijo, conviene guardarlas en formato JPEG, ya que, de los formatos utiles para web y multimedia es el que mejor calidad ofrece. En este caso se ha utilizado un tipo de optimización.

En el segundo caso, se ha empledo la imagen de una captura de pantalla de una zona de un programa, para utilizar, por ejemplo, en la web o en la presentación powerpoint de un curso. Este tipo de imágenes tienen muchos menos colores y detalle que las fotografías y admiten otro tipo de optimización.

Veamos en el punto siguiente como optimizar fotos