Pourquoi le format d'image Avif est important (et quels sont les plans Imagify)

Avez-vous déjà essayé Avif, le dernier format d'image puissant ? Chez Imagify, nous avons commencé à avoir des questions sur les raisons pour lesquelles notre plugin ne le prend pas en charge (spoiler : yet ).

Dans cet article, vous découvrirez pourquoi Avif peut changer la donne en matière d'optimisation d'image et où il se situe par rapport aux formats les plus populaires, tels que JPG et WebP. Et, bien sûr, vous en apprendrez plus sur les plans d'Imagify pour soutenir Avif.

Qu'est-ce que le format d'image Avif ?

Avif est un format d'image basé sur le codec vidéo AV1 - il compresse les images avec AV1 au format de fichier HEIF (High-Efficiency Image File). En clair, cela signifie que les images sont compressées au mieux — elles sont plus légères que jamais tout en conservant la même qualité . Une compression aussi puissante s'accompagne d'autres fonctionnalités importantes telles que la prise en charge HDR (High Dynamic Range) et la résolution des couleurs 12 bits.

Et il y a plus.

Avif est un logiciel open source et il est libre de droits - cela signifie que si vous souhaitez l'utiliser pour un projet ou une entreprise de compression d'images, vous n'avez rien à payer.

Avif a été développé par de nombreux géants de la technologie tels que Google, Amazon, Cisco, Netflix et bien d'autres. La raison est simple. Ces entreprises sont extrêmement intéressées par le développement et la diffusion d'un format d'image de haute qualité qui ne nécessite pas trop de bande passante - c'est ainsi que de plus en plus de personnes peuvent consommer du contenu sur leurs appareils.

Compte tenu de ses performances exceptionnelles, Avif semble être le remplaçant parfait des formats les plus lourds tels que JPEG et WebP. Jusqu'à il y a quelque temps, il n'y avait qu'un problème : la compatibilité du navigateur.

Quels navigateurs prennent en charge Avif

Pendant longtemps, seule une petite partie des navigateurs supportait Avif. En d'autres termes, la plupart des utilisateurs ne pourraient voir aucune photo au format Avif. Depuis octobre 2021, les choses sont différentes. Désormais, Avif est pris en charge par Firefox, Chrome et Opera. Globalement, 67% des utilisateurs peuvent bénéficier du format.

Et c'est pourquoi il est temps de commencer à prendre Avif en considération pour l'optimisation des performances d'image.

Comparaison des performances : Avif et WebP (et autres formats)

Nous avons mentionné comment le format Avif offre la meilleure compression du marché et conserve une haute qualité des images. Effectuons une comparaison des performances d'image et voyons comment se situe Avif par rapport à des formats tels que JPEG et WebP.

Nous utiliserons Squoosh, une application Web qui compare facilement différents formats.

Prenons l'un des formats d'image les plus lourds comme point de départ et voyons comment les autres formats fonctionnent. Nous avons choisi une image PNG avec une taille originale de 15,6 Mo et avons mesuré la différence entre la taille originale et la conversion au format JPG.

La conversion de PNG en JPG montre une réduction de 92% . La taille de l'image est maintenant de 1,20 Mo. Puisque JPG n'est pas le format le plus léger de tous les temps, et nous le savons, nous ne pouvions pas en attendre plus.

Qu'en est-il de WebP ? Nous avons refait la comparaison. Cette fois, l'image PNG a été compressée à 95% . La taille de l'image est maintenant de 704 Ko. Compte tenu de la taille initiale (15,6 Mo), c'est un excellent résultat — et il est difficile de voir une baisse de la qualité de l'image. Après tout, WebP est le format d'image que vous devez utiliser sur WordPress.

Nous avons ensuite effectué à nouveau la comparaison et découvert que le format Avif était à la hauteur des attentes en matière de performances.

La taille de l'image a été réduite de 98 % . Il ne fait que 261 Ko et il est toujours difficile de remarquer une différence dans la qualité de l'image.

Voici le récapitulatif complet des comparaisons que nous avons effectuées. Il montre comment Avif peut réduire la taille de vos images.

Et maintenant, vous vous demandez peut-être : pourquoi Imagify ne prend pas en charge Avif ? Cela nous amène à la section suivante.

Pourquoi Imagify ne prend pas (encore) en charge Avif

Jean-Baptiste Marchand-Arvier, co-fondateur et PDG de WP Media, explique : « Avif a été publié en tant que format expérimental, et un très petit pourcentage de navigateurs le supportait. De plus, Avif a rencontré quelques problèmes dus au temps d'encodage. Au début, l'encodage prenait plusieurs secondes par image, ce qui est extrêmement lent. À titre de comparaison, la compression d'images sur Imagify prend généralement moins de 100 ms. Depuis, il y a eu beaucoup de travail pour améliorer les performances ».

Comme vous pouvez le voir dans la capture d'écran ci-dessous, le temps d'encodage est de mieux en mieux :

Jean-Baptiste poursuit : « Outre l'amélioration du temps d'encodage, de plus en plus de navigateurs supportent Avif. Et ce format est extrêmement intéressant pour deux raisons : il supporte le canal alpha (transparence), donc il peut être utilisé en remplacement du PNG, et il supporte l'animation à utiliser en remplacement du GIF.

Voilà pourquoi Imagify soutiendra certainement Avif dans un futur proche ».

Et il ajoute : « Nous allons probablement remplacer WebP par Avif. Sinon, cela peut être trop complexe ou déroutant pour nos utilisateurs ».

Si vous vous demandez ce que cela signifie, voici un peu de contexte.

WebP est sorti en 2010, il y a plus de 10 ans. Néanmoins, il n'est toujours pas entièrement compatible avec les navigateurs et les systèmes d'exploitation. La seule compatibilité partielle implique deux choses. En tant que propriétaire de site Web, vous devez toujours gérer 2 formats différents : le "classique", comme JPG ou PNG, et le plus performant, comme WebP ou Avif. D'autre part, les plugins d'optimisation d'image, comme Imagify, ont besoin de stocker sur leurs serveurs les deux formats.

« Du point de vue de l'utilisateur », explique Jean-Baptiste, « cela signifie qu'un nouveau format tel qu'Avif n'aidera finalement pas à remplacer JPG ou PNG — ils vont rester. Cependant, la conversion de ces formats en Avif contribuera à améliorer les performances de l'image, et c'est pourquoi Avif remplacera WebP à un moment donné. Les utilisateurs n'auront pas besoin des deux formats. Et nous voulons garder le plugin aussi simple que possible ».

WebP reste un excellent moyen d'optimiser vos images

Ainsi, vous ne pouvez pas déjà convertir vos images en Avif avec Imagify, mais vous pouvez toujours convertir vos images en WebP et améliorer les performances de vos images dès maintenant.

Plus de 90% des utilisateurs dans le monde pourront voir vos images converties au format WebP, c'est donc toujours une excellente option pour alléger vos photos et optimiser les performances de votre site.

Lors de l'exécution d'un audit PageSpeed ​​Insights, vous avez peut-être rencontré la recommandation de performances concernant la diffusion d'images dans des formats de nouvelle génération. Eh bien, WebP est exactement le format de nouvelle génération que Google recommande aux côtés d'Avif. C'est tout ce dont vous avez besoin pour accélérer le chargement de vos images.

Nous avons effectué un test et créé trois pages. Chaque page contient uniquement l'image dans un format spécifique : PNG, JPG ou WebP.

Lors de l'exécution de l'audit PageSpeed ​​Insights pour la page contenant l'image PNG, nous avons reçu un signal d'alarme concernant la recommandation de format de nouvelle génération. Vous pouvez voir à quel point l'économie estimée est énorme : 1 076,7 Ko .

Il en va de même lors du test de la page avec l'image JPG. Les performances se sont légèrement améliorées et nous avons obtenu un drapeau orange. Néanmoins, il y a place à l'amélioration — une économie potentielle de 16,8 Ko .

Il n'est pas surprenant que la recommandation devienne un audit réussi lorsque nous avons converti l'image en WebP avec Imagify et créé une page dédiée :

Nous avons obtenu le même résultat en testant la page avec l'image Avif :

Ainsi, WebP et Avif offrent le même excellent résultat . De plus, le score PageSpeed ​​Insights est à peu près le même :

Score de performance – Page WebP	Score de performance – Page Avif

Nous avons également testé la différence de taille d'image et d'octets entre les pages WebP et Avif. Et nous n'avons pas pu remarquer une énorme différence non plus:

Comme vous pouvez le voir, WebP et Avif sont assez similaires pour fournir des performances d'image exceptionnelles.

D'une part, Avif propose une optimisation un peu meilleure. Cependant, à moins que votre site ne contienne des milliers et des milliers d'images, vos performances seront excellentes avec WebP, notamment parce qu'il s'agit toujours du format de nouvelle génération le plus courant.

De plus, avec Imagify, convertir vos images au format WebP est facile et plus rapide que jamais, grâce à la nouvelle compression plus rapide qui vous permet de convertir vos images en un rien de temps.

Voici ce que vous devez faire :

1. Télécharger Imagify gratuitement
   
2. Allez dans Paramètres > Optimisation > Format WebP et cochez les deux cases :

3. Convertissez vos images (et profitez de l'optimisation groupée) :

C'est ça. C'est si simple — mais efficace !

Et vous pouvez choisir le plan qui vous convient le mieux.

Vous pouvez optimiser gratuitement 20 Mo d'images par mois ou vous pouvez choisir entre le plan de croissance (500 Mo pour 4,99 $ par mois) et le plan Infini (images illimitées pour 9,99 $ par mois). Quel que soit le forfait que vous choisissez : vous pouvez installer Imagify sur un nombre illimité de sites Web.

Commencez à optimiser vos images avec Imagify et faites-nous savoir comment vos performances se sont améliorées dans les commentaires.