Crea una imagen perfecta de tu sitio con images.tooling.report

Revisa el estado de las herramientas de imagen.

Patrick Kettner
Patricio Kettner

Una cosa es poner una imagen en la Web, pero es difícil hacerlo bien. Elegir el formato correcto, la compresión, los puntos por pulgada (DPI) y cientos de otros parámetros de configuración pueden olvidarse fácilmente cuando hacemos todo esto nosotros mismos.

La buena noticia es que hoy en día contamos con una gran cantidad de herramientas y servicios que pueden hacer todo eso por nosotros. Lo que no es tan bueno es que, bueno, hay una abundancia. Puede ser difícil elegir qué herramienta o servicio es mejor para ti. Por esta razón, lanzamos images.tooling.report, un sitio en el que incluimos los elementos que consideramos más importantes a la hora de enviar imágenes en producción y para comparar algunos de los software y servicios más populares, ya sean pagados o gratuitos, alojados o autoalojados.

¿A qué se debe?

Las imágenes constituyen una gran parte de los bytes transferidos de un sitio, y esos bytes se suman. De hecho, descubrimos que las imágenes no optimizadas representan casi el 75% del tamaño total de una página. Todos esos bytes desperdiciados tienen un costo. Es por eso que, en un estudio de millones de sesiones de usuarios reales, las páginas que generaron conversiones tenían un 38% menos de imágenes que las que no generaron conversiones. Entonces, ¿deberías borrar todas tus imágenes? Por supuesto que no. Sin embargo, debes asegurarte de que las imágenes que envíes estén optimizadas para todos los usuarios, independientemente de los dispositivos que utilicen.

¿Qué es?

Publicar imágenes optimizadas es más que solo hacer clic en “Guardar para la Web”. Es por ello que images.tooling.report verifica una amplia variedad de funciones. Abordaremos los aspectos básicos, como la cantidad de compresión que ofrecen los diferentes servicios y herramientas, y las optimizaciones de red, como los encabezados de caché de larga duración.

Pero eso no es todo. Buscamos opciones más avanzadas, como compatibilidad con Save-Data, ECT y otras sugerencias de clientes, para buscar análisis psicológicos automatizados que puedan usar modelos de datos para comprimir imágenes repetidamente y encontrar la versión que tome la menor cantidad de bytes sin cambiar la forma en que la perciben. ¿Estás aprovechando cada última parte no visual de las imágenes antes de enviarla?

Una captura de pantalla de la página de destino de images.tooling.report en modo oscuro.

Por supuesto, cada sitio es un copo de nieve: ninguna herramienta o servicio hizo absolutamente todo lo que buscábamos. ¡Eso es normal! Así que desglosamos lo que probamos en diferentes categorías. Abordamos las redes de distribución de contenidos (CDN), los proyectos autoalojados, los complementos del sistema de administración de contenido (CMS) y los creadores de sitios. Estas son definiciones bastante sueltas que realmente sirven para que la comparación de diferentes opciones sea más relevante:

  • Los complementos de CMS son paquetes que son una opción sencilla para desarrollar en plataformas como WordPress.
  • Los creadores de sitios comparan distintos servicios que puedes usar para crear tu sitio web.
  • El alojado autoalojado está diseñado para desarrolladores que se sientan cómodos clonando un proyecto de Git o ejecutando su propia imagen de Docker en producción.
  • Los CDN son un poco más complicados. Algunas de estas son CDN en el sentido tradicional, pero otras son servicios que alojan o proxy tus imágenes en el perímetro.

No puede ser todo para todo el mundo todo el tiempo, pero debería comprobar las pruebas y las funciones que se están evaluando y ver cómo se compara su optimizador de imágenes. ¿Y si en este momento no estás realizando una optimización de imágenes? Es un buen momento para probar las herramientas de imágenes y ver qué beneficios puedes ofrecer a las personas que ya utilizan tu sitio.

¿Qué sigue?

¿Crees que nos faltó alguna herramienta o servicio de imagen? Infórmanos al respecto. Tanto las herramientas como los servicios, y las pruebas en sí, son elementos vivos que se actualizan. Siempre que necesites un lugar rápido para conocer la vanguardia de las imágenes de envío, asegúrate de que la primera parada sea images.tooling.report.

Hero image de Michael Maasen en Unsplash.