Difficile aujourd’hui de savoir quel format d’image est le mieux pour votre site WordPress. De nouveaux formats sont venus s’ajouter aux classique Jpg, Gif et Png : WebP, Avif et Heif. Faisons le point sur ses nouveaux formats.
Le web ne se repose jamais sur ses lauriers, les techs cherchent encore et toujours à alléger le poids des images qui représente une part très importante (près de 65 %) dans les pages web du monde entier. On a connu des formats exotiques qui n’ont jamais connus la popularité, faute d’adoption par les acteurs majeurs du web, un bon exemple avec le JPEG 2000.
Nouveaux formats d’image : une guerre d’influence entre acteurs du web
Pour rappel, sur le web on trouve depuis ces dernières années les formats courants suivants :
- GIF (Graphics Interchange Format)
- PNG (Portable Network Graphics)
- JPG ou JPEG (Joint Photographic Experts Group)
- SVG (Scalable Vector Graphics)
Les nouveaux formats récemment apparus sont les suivants :
- WEBP (dérivé du format vidéo VP8)
- AVIF (AV1 Image File Format)
- HEIF (High Efficiency Image File Format)
Le format WEBP est un format proposé par Google qui autorise des images pixels animées ou non et supporte la transparence via un canal Alpha. Des tests réalisés, en transcodant un million d’images déjà compressées avec pertes, montrent qu’en moyenne le WebP réduirait la taille des fichiers de 39 % par rapport aux formats JPEG, PNG et GIF, sans perte de qualité perceptible. Ces gains de compression ne sont pas apparus suffisamment important pour la fondation Mozilla qui à tardé à supporter ce format dans Firefox, c’est effectif depuis 2019.
Le format AVIF est un nouveau format ouvert de fichier image permettant de sauvegarder des images ou séquences d’images au format compressé développé par le consortium Alliance for Open Media. Il concurrence le format HEIC qui utilise le même format de conteneur, mais HEVC pour la compression. Les spécifications du format AVIF ont été finalisées en février 2019.
Le format HEIF est un format de fichier pour les images et les séquences d’images. Il a été développé par le Moving Picture Experts Group. La compression utilisée est l’HEVC. Ce format est utilisé par iOS (depuis sa version 11 et l’iPhone 7) et Canon qui utilise aussi ce format pour stocker les images HDR PQ du 1DX Mark III. Ce format n’est pas encore supporté par les navigateurs web même si plusieurs expériences via la librairie Imagick ont montré un support partiel.
Le format HEIF offre des gains de poids, à qualité égale, très intéressants ce qui pousse certains acteurs à l’intégrer, mais c’est un format Apple et ce dernier est toujours réticent à ouvrir ses formats source à la communauté.
Exemples de compression jpg et webp
Nouveaux formats d’image : comment gagner les derniers petits Ko qui feront la différence ?
Comme vu précédemment c’est toujours la foire d’empoigne entre les différents acteurs du web pour imposer un format d’image plus efficace que je JPG actuellement le plus utilisé sur le web.
Le WEBP à bien percé et son support natif par le navigateur Safari d’Apple à permis sa démocratisation.
Globalement on gagne au moins 25% de poids avec ce format comparé à du JPEG sans perte notable de qualité. Le seul bémol c’est qu’il faut encore utiliser une méthode remplacement pour les utilisateurs Apple qui ne sont pas sur High Sierra ou iOs 12 qui le supportent réellement. WordPress supporte le WEBP depuis la version 5.8.
Le format AVIF est récent et son support encore partiel dans les navigateurs web (manque Edge de Microsoft). Ce format est actuellement le meilleur pour son rapport qualité/poids, bien supérieur au WEBP, malheureusement WordPress ne le supporte pas encore nativement.
Utiliser le format AVIF avec WordPress, comment faire ?
Il est possible de rendre accessible votre site WordPress aux images AVIF en ajoutant le snippet PHP suivant dans le fichier functions.php de votre thème enfant :
/ * Support for new image formats * /
function help wp_compatibility_new_image_format ($ mime_types) {
$ mime_types ['webp'] = 'image / webp';
$ mime_types ['heic'] = 'image / heic';
$ mime_types ['heif'] = 'image / heif';
$ mime_types ['heics'] = 'image / heic-sequence';
$ mime_types ['heifs'] = 'image / heif-sequence';
$ mime_types ['avif'] = 'image / avif';
$ mime_types ['avis'] = 'image / avif-sequence';
return $ mime_types;
}
add_filter ('upload_mimes', 'help wp_compatibility_new_image_format', 1, 1);Une autre solution moins sécurisé et d’ouvrir le téléversement non filtré de fichiers avec ce code placé dans le fichier wp-config.php de votre installation WordPress :
define('ALLOW_UNFILTERED_UPLOADS', true);Sources : MacWorld, Convertio.co, anthedesign.fr, netnco.net, les formats d’images.
