¿Alguna vez habéis tenido que enviar una foto por email y no os ha dejado por el tamaño? ¿Habéis tenido que recurrir entonces a algún servicio de archivos en la nube o incluso aplicación de escritorio para comprimir dichas imágenes? ¡Estamos de suerte! Google, el gigante de internet, nos ha dado hoy una gran noticia: ha lanzado la nueva squoosh.app. Una web que nos permite convertir, comprimir y optimizar imágenes con una gran cantidad de personalización.

 ¿Por qué es tan importante el tamaño de las imágenes?

La inmensa mayoría de nosotros llevamos un smartphone en el bolsillo que, entre otras muchas cosas, es capaz de hacer fotografías. Algunos de ellos hasta implementan 2 cámaras (llegando incluso a las 5 cámaras traseras del futuro Nokia 9) que nos ayudan con la luz, enfoque o zoom óptico. Todo esto hace que el tamaño final de la fotografía se incremente cada vez más, y esto, sumado a la cantidad ingente de fotos que hacemos al cabo del día, puede suponer que nos quedemos sin memoria interna rápidamente en nuestros dispositivos.

Por supuesto una de las soluciones es comprar un móvil con una capacidad mayor. O bien comprar una tarjeta microSD para ampliar la memoria. No obstante, esta soluciones son el típico pan para hoy, y hambre para mañana, ya que tarde o temprano nos quedaremos sin capacidad y ese día creedme que llega.

Por otro lado, si eres desarrollador web o has lidiado alguna vez con alguna página, sabrás que una imagen que pese demasiado ralentiza la carga de recursos de una página. Esto empeora nuestra accesibilidad e incluso llega a repercutir negativamente en nuestra estrategia SEO. Pero claro, una imagen de mala calidad o pixelada empeora también nuestro resultado final, dando la sensación de un contenido pobre.

Entonces tenemos que recurrir a otras soluciones como usar otro formato de archivo mas óptimo o comprimir más las imágenes para que ocupen menos.

JPEG vs otros formatos de imagen

Rara es la persona que no ha escuchado hablar del famoso formato de imágenes JPEG o JPG. Técnicamente no se trata de un formato de archivo sino más bien de una compresión que nos permite ahorrar bastante espacio dependiendo del grado de compresión que se elija. Esta compresión es con pérdidas, lo que quiere decir que estamos perdiendo información de alguna forma, aunque muchas veces es imperceptible para un uso normal.

Existen muchos otros formatos de archivos que nos ayudan con esta tarea dependiendo de nuestras necesidades. Desde HEIC, el formato que se ha inventado Apple para reducir sus imágenes desde iOS 11, hasta WebP, el formato que se ha inventado Google que provee una compresión superior para la web, tanto con como sin pérdidas.

Genial pero, ¿cómo gestionamos todo esto?

La tarea de comprimir o convertir imágenes era algo tediosa hasta hoy, que podemos empezar a usar Squoosh: una web desarrollada por Google. Aunque vamos a ver la utilidad que nos ofrece con un ejemplo, os adelanto que se puede usar hasta sin conexión. Para ello, necesitaremos cargar la web con internet por primera vez, y desde ese momento estará disponible para nosotros de forma offline.

Como vemos, podemos empezar a usarla nada mas cargar la página, sin necesidad de registrarse o mayores clics. Podemos subir nuestra imagen o bien elegir una de las cuatro de ejemplo que nos ofrecen. Lo primero que llama la atención es el separador que se encuentra a mitad de pantalla. Con él, podemos revisar cada parte de la foto y comparar ambos lados en tiempo real. En nuestro caso, hemos elegido que la imagen original se sitúe a nuestra izquierda y configuraremos los diferentes parámetros a la derecha.

El primero de ellos es el formato de salida, a elegir entre: Original image, OptiPNG, MozJPEG, WebP, browser PNG, browser JPEG o browser WebP. En función de éste se nos despliegan mas opciones entre las que figuran: redimensionar, reducir la paleta de colores, activar o desactivar las pérdidas, esfuerzo o grado de compresión, calidad, transparencia y más parámetros avanzados que analizaremos en profundidad mas adelante en otro post.

A continuación, te dejo con una tabla comparativa del tamaño final, en la que se han usado los parámetros recomendados por la propia utilidad y reduciendo las dimensiones de la imagen a 1000 pixels de ancho. ¡Cuidado! El proceso de compresión de la imagen corre por cuenta de nuestro navegador y por tanto de nuestro equipo, el cual necesitará más o menos tiempo dependiendo de los parámetros o de las prestaciones de dicho equipo.

[table id=1 /]

Llama la atención como el formato PNG arroja un tamaño mayor del archivo original. Para OptiPNG hemos tenido que modificar el parámetro del esfuerzo o grado de compresión a 1 debido al alto consumo de recursos utilizados y a que el tiempo del proceso de compresión era mayor de 5 minutos (¡wow!).

Queda en nuestra mano elegir los parámetros óptimos, comprobar el resultado y descargar el archivo final con el formato deseado. Quién sabe si realmente se hará con un hueco entre nuestros marcadores. Te animo a que lo pruebes y, nunca mejor dicho, lo veas por ti mismo.