Por qué importa el formato de imagen Avif (y qué son los planes Imagify)

¿Ya probó Avif, el último y poderoso formato de imagen? En Imagify, comenzamos a recibir preguntas sobre por qué nuestro complemento no es compatible (spoiler: todavía ).

En este artículo, descubrirá por qué Avif puede cambiar las reglas del juego para la optimización de imágenes y cuál es su posición en comparación con los formatos más populares, como JPG y WebP. Y, por supuesto, aprenderá más sobre los planes de Imagify para apoyar a Avif.

¿Qué es el formato de imagen Avif?

Avif es un formato de imagen basado en el códec de video AV1: comprime imágenes con AV1 en el formato de archivo HEIF (archivo de imagen de alta eficiencia). En lenguaje sencillo, significa que las imágenes se comprimen de la mejor manera: son más livianas que nunca y mantienen la misma calidad . Una compresión tan poderosa va junto con otras características importantes, como la compatibilidad con HDR (alto rango dinámico) y la resolución de color de 12 bits.

Y hay más

Avif es un software de código abierto y está libre de regalías , lo que significa que si desea usarlo para cualquier proyecto o negocio de compresión de imágenes, no tiene que pagar nada.

Avif ha sido desarrollado por muchos gigantes tecnológicos como Google, Amazon, Cisco, Netflix y muchos más. La razón es simple. Estas empresas están sumamente interesadas en desarrollar y difundir un formato de imagen de alta calidad que no necesite demasiado ancho de banda: así es como más y más personas pueden consumir contenido en sus dispositivos.

Dado su excelente desempeño, Avif parece ser el reemplazo perfecto para los formatos más pesados ​​como JPEG y WebP. Hasta hace un tiempo, solo había un problema: la compatibilidad del navegador.

¿Qué navegadores son compatibles con Avif?

Durante mucho tiempo, solo una pequeña parte de los navegadores eran compatibles con Avif. En otras palabras, la mayoría de los usuarios no podrán ver ninguna foto en formato Avif. A partir de octubre de 2021, las cosas son diferentes. Ahora, Avif es compatible con Firefox, Chrome y Opera. En general, el 67% de los usuarios pueden beneficiarse del formato.

Y es por eso que es hora de comenzar a considerar seriamente a Avif para la optimización del rendimiento de la imagen.

Comparación de rendimiento: Avif vs. WebP (y otros formatos)

Mencionamos como el formato Avif ofrece la mejor compresión del mercado y mantiene una alta calidad de las imágenes. Realicemos una comparación de rendimiento de imágenes y veamos cómo se encuentra Avif frente a formatos como JPEG y WebP.

Usaremos Squoosh, una aplicación web que compara fácilmente diferentes formatos.

Tomemos uno de los formatos de imagen más pesados ​​como punto de partida y veamos cómo funcionan los otros formatos. Elegimos una imagen PNG con un tamaño original de 15,6 MB y medimos la diferencia entre el tamaño original y la conversión al formato JPG.

La conversión de PNG a JPG muestra una reducción del 92% . El tamaño de la imagen es ahora de 1,20 MB. Dado que JPG no es el formato más ligero que existe, y lo sabemos, no podíamos esperar más que esto.

¿Qué pasa con WebP? Volvimos a hacer la comparación. Esta vez, la imagen PNG ha sido comprimida en un 95% . El tamaño de la imagen ahora es de 704 KB. Dado el tamaño inicial (15,6 MB), es un gran resultado y es difícil ver una disminución en la calidad de la imagen. Después de todo, WebP es el formato de imagen que debes usar en WordPress.

Luego volvimos a realizar la comparación y descubrimos que el formato Avif está a la altura de las expectativas de rendimiento.

El tamaño de la imagen se ha reducido en un 98% . Solo tiene 261 KB, y aún es difícil notar alguna diferencia en la calidad de la imagen.

Aquí está el resumen completo de las comparaciones que hicimos. Muestra cómo Avif puede reducir el tamaño de sus imágenes.

Y ahora te estarás preguntando: ¿por qué Imagify no es compatible con Avif? Esto nos lleva a la siguiente sección.

Por qué Imagify no es compatible con Avif (todavía)

Jean-Baptiste Marchand-Arvier, cofundador y director ejecutivo de WP Media, explica: “Avif se lanzó como un formato experimental y un porcentaje muy pequeño de navegadores lo admitía. Además, Avif tuvo algunos problemas debido al tiempo de codificación. Al principio, la codificación tardaría varios segundos por imagen, lo que es extremadamente lento. A modo de comparación, comprimir imágenes en Imagify suele tardar menos de 100 ms. Desde entonces, se ha trabajado mucho para mejorar el rendimiento”.

Como puede ver en la siguiente captura de pantalla, el tiempo de codificación es cada vez mejor:

Jean-Baptiste continúa: “Además de las mejoras en el tiempo de codificación, ahora más navegadores son compatibles con Avif. Y este formato es extremadamente interesante por dos razones: admite canal alfa (transparencia), por lo que puede usarse como reemplazo de PNG, y admite animación para usarse en reemplazo de GIF.

He aquí por qué Imagify sin duda apoyará a Avif en un futuro próximo”.

Y añade: “Probablemente sustituiremos WebP por Avif. De lo contrario, puede resultar demasiado complejo o confuso para nuestros usuarios”.

Si te preguntas qué significa, aquí hay algo de contexto.

WebP se lanzó en 2010, hace más de 10 años. No obstante, todavía no es totalmente compatible con navegadores y sistemas operativos. La única compatibilidad parcial implica dos cosas. Como propietario de un sitio web, aún debe manejar 2 formatos diferentes: el "clásico", como JPG o PNG, y el de mayor rendimiento, como WebP o Avif. Por otro lado, los complementos de optimización de imágenes, como Imagify, necesitan almacenar en sus servidores ambos formatos.

“Desde la perspectiva del usuario”, dice Jean-Baptiste, “significa que un nuevo formato como Avif no ayudará al final a reemplazar JPG o PNG; se quedarán. Sin embargo, convertir estos formatos a Avif ayudará a mejorar el rendimiento de la imagen y es por eso que Avif reemplazará a WebP en algún momento. Los usuarios no necesitarán ambos formatos. Y queremos mantener el plugin lo más simple posible ”.

WebP sigue siendo una excelente manera de optimizar sus imágenes

Por lo tanto, aún no puede convertir sus imágenes a Avif con Imagify, pero siempre puede convertir sus imágenes a WebP y mejorar el rendimiento de su imagen ahora mismo.

Más del 90% de los usuarios en todo el mundo podrán ver sus imágenes convertidas en formato WebP, por lo que sigue siendo una excelente opción para hacer que sus fotos sean más claras y optimizar el rendimiento de su sitio.

Al ejecutar una auditoría de PageSpeed ​​Insights, es posible que haya encontrado la recomendación de rendimiento sobre la publicación de imágenes en formatos de próxima generación. Bueno, WebP es exactamente el formato de próxima generación que Google recomienda junto con Avif. Es todo lo que necesita para que sus imágenes se carguen más rápido.

Hicimos una prueba y creamos tres páginas. Cada página solo contiene la imagen en un formato específico: PNG, JPG o WebP.

Al ejecutar la auditoría de PageSpeed ​​Insights para la página que incluye la imagen PNG, obtuvimos una señal de alerta sobre la recomendación de formato de próxima generación. Puedes ver como el ahorro estimado es enorme: 1.076,7 KB .

Lo mismo ocurre al probar la página con la imagen JPG. El rendimiento mejoró un poco y obtuvimos una bandera naranja. Aún así, hay margen de mejora: un ahorro potencial de 16,8 KB .

No sorprende que la recomendación se convierta en una auditoría aprobada cuando convertimos la imagen a WebP con Imagify y creamos una página dedicada:

Obtuvimos el mismo resultado al probar la página con la imagen de Avif:

Entonces, WebP y Avif brindan el mismo gran resultado . Además, la puntuación de PageSpeed ​​Insights es prácticamente la misma:

Puntuación de rendimiento: página WebP	Puntuación de rendimiento – Página Avif

También probamos la diferencia en tamaño de imagen y bytes entre las páginas WebP y Avif. Y tampoco pudimos notar una gran diferencia:

Como puede ver, WebP y Avif son bastante similares a la hora de ofrecer un rendimiento de imagen excepcional.

Por un lado, Avif ofrece una optimización ligeramente mejor. Sin embargo, a menos que su sitio tenga miles y miles de imágenes, su rendimiento será excelente con WebP, también porque este sigue siendo el formato de próxima generación más común.

Además, con Imagify, convertir tus imágenes al formato WebP es más fácil y rápido que nunca, gracias a la nueva compresión más rápida que te permite convertir tus imágenes en poco tiempo.

Esto es lo que debe hacer:

1. Descarga Imagine gratis
   
2. Vaya a Configuración > Optimización > Formato WebP y marque ambas casillas:

3. Convierta sus imágenes (y aproveche la optimización masiva):

Eso es todo. ¡Es tan simple, pero efectivo!

Y puedes elegir el plan que más te convenga.

Puede optimizar 20 MB de imágenes por mes de forma gratuita, o puede elegir entre el Plan de Crecimiento (500 MB por $ 4,99 por mes) y el Plan Infinito (imágenes ilimitadas por $ 9,99 por mes). No importa qué plan elija: puede instalar Imagify en un número ilimitado de sitios web.

Comience a optimizar sus imágenes con Imagify y háganos saber cómo mejoró su rendimiento en los comentarios.