Il est de la plus haute importance de fournir un site Web qui se charge rapidement afin que vos clients puissent avoir une bonne expérience utilisateur et que les moteurs de recherche puissent facilement indexer vos pages. Dans cet article, je vais vous expliquer ce qu’est le format Webp et pourquoi vous devriez l’utiliser pour votre site web !
Qu’est-ce que le format Webp ?
Le format Webp a été créé par Google en 2010. Le but était de garder une bonne qualité d’image pour les navigateurs web tout en diminuant la taille de 30% afin d’améliorer drastiquement la vitesse de chargement de votre site web. Avec Webp, vous avez la possibilité d’utiliser la compression sans perte ET la compression avec perte. La compression avec perte vous donne une très petite taille de fichier, mais la qualité n’est pas similaire à l’original. La compression sans perte à l’opposé, garde la même qualité que l’original tout en réduisant considérablement la taille de l’image.
Le fait étonnant est que ce format prend également en charge les images animées (gif) et la transparence (png), utile pour les logos et les éléments de conception. Si vous utilisez PageSpeed Insights pour analyser la vitesse de votre site web, vous verrez qu’une des recommandations est d’utiliser le format Webp ! On vous y explique qu’il permet un téléchargement plus rapide et une meilleure compression des données. Inutile de dire que l’indexation de vos pages dans le moteur de recherche Google sera améliorée en utilisant Webp ! 🙂
Pourquoi vous devriez utiliser le format Webp
Voici pourquoi devriez utiliser le format Webp :
- Votre site Web se chargera plus rapidement, améliorant l’expérience utilisateur et par conséquent vos chances de transformer les visiteurs en clients
- Votre site Web sera mieux indexé par les moteurs de recherche, principalement Google Search Engine, car Webp est un format qui a été créé par Google et aussi parce-que c’est une recommandation clé de Google. Les images d’un site représentent presque la moitié du poids du site, alors leur optimisation est primordiale.
- Vous prendrez de l’avance sur vos concurrents, car, croyez-le ou non, webp n’est pas encore très utilisé sur les sites Web du monde entier ! Même les agences web sont la plupart du temps encore attachées aux formats historiques que sont le png, le jpeg et le gif.
Webp et le support par les navigateurs
Le point positif est que Webp est supporté par presque 95% des navigateurs web actuellement utilisés dans le monde. Eh bien, vous aurez évidemment encore des gens qui utilisent des navigateurs plus anciens, qui ne prennent pas en charge Webp, mais en fin de compte, ce n’est pas très grave… Et dans un an ou deux, même ces quelques téméraires seront obligés de télécharger un navigateur plus récent ! Pendant longtemps, Safari n’a pas supporté WebP. Mais, ce n’est plus le cas, il le supporte depuis septembre 2020 sur iOS et MacOS Safari.
Connaissez-vous le site caniuse.com ? Il vous permet de savoir si vous pouvez oui ou non utiliser une fonctionnalité sur votre site web. Voici les informations qu’il fournit au sujet du format WebP :
Comme vous pouvez le constater, le support est global. Vous pouvez même aller plus loin et tester votre site Web sur n’importe-quel navigateur, bien que vous devriez créer un compte.
Comment utiliser le format Webp avec WordPress ?
À partir de WordPress 5.8, vous pourrez utiliser le format d’image WebP de la même manière que les formats JPEG, PNG et GIF. Téléchargez simplement vos images dans votre médiathèque et incluez-les dans votre contenu. Comme WordPress 5.8+ prend en charge le format WebP par défaut, vous n’avez pas besoin d’installer de plugins tiers pour télécharger des images WebP. Cela devrait suffire pour les cas d’utilisation les plus courants. Mais, comment convertir des images au format WebP ? Eh bien, vous avez ici 2 solutions, soit utiliser un plugin OU utiliser Photoshop et créer un script pour convertir MASSIVEMENT toutes les images de votre site Web au format WebP.
Convertir au format Webp en utilisant Photoshop
Ouvrez votre image, quel que soit son format, JPEG, PNG ou GIF. Cliquez ensuite sur Fichier => Enregistrer sous. Vous trouverez le format Webp dans la liste. Vous pouvez aller plus loin et créer un script automatique en vous rendant dans la fenêtre Actions et en enregistrant vos actions pendant que vous exportez un fichier au format Webp. Tout d’abord, vous devrez donner un nom à votre script. Deuxièmement, vous devrez enregistrer votre script. Troisièmement, vous pourrez le réutiliser pour une autre image.
Néanmoins, vous pouvez automatiser davantage en convertissant les images en masse si elles se trouvent dans le même dossier. Ouvrez Photoshop puis le processeur d’image via Fichier> Scripts> Processeur d’image. Dans Sélectionner un dossier, choisissez le dossier où se trouvent vos images à convertir. Choisissez où vous souhaitez enregistrer les fichiers de sortie. Dans le 4ème élément, Préférences, dans Exécuter l’action, choisissez l’action que vous souhaitez exécuter, probablement celle que vous avez appelée « Convertir au format WebP ». Une fois que vous êtes satisfait, appuyez simplement sur Exécuter et les conversions commenceront. Vous recevrez un message pour vous dire que la conversion est terminée. SU PER !
Convertir au format Webp en utilisant un plugin WordPress
Au jour d’aujourd’hui le meilleur plugin pour convertir des images sur votre site WordPress au format WebP est WebP Express. C’est un plugin gratuit, qui convertira non seulement toutes vos images en WebP, mais mettra également en place un « drawback » dans le cas où WebP n’est PAS pris en charge par un navigateur ! Quelle évolution époustouflante ! Ces développeurs méritent bien que vous leur payez un café si vous utilisez leur extension gratuite. Pour faire simple, le plugin implémente la bibliothèque WebP Convert. Inutile de rentrer plus dans le technique ici.
Téléchargez votre plugin sur votre machine locale puis allez dans Plugins => Ajouter. Cliquez sur Télécharger le plugin, choisissez le zip du plugin que vous venez de télécharger et cliquez sur Installer maintenant. Lorsque tout est ok, cliquez sur Activer le plugin. Cela étant fait, vous devez configurer le plugin en allant dans Paramètres => WebP Express.
Vous pouvez garder toutes les options par défaut. Cochez la case, Convert on upload. Puis, cliquez sur le bouton Bulk Convert. Une pop-up s’ouvrira, indiquant le nombre de fichiers à convertir. Ensuite, cliquez sur Démarrer la conversion. L’option parcourra toutes les images de votre site Web. Si vous avez beaucoup d’images à convertir, cela peut prendre un petit moment ! Profitez-en pour aller boire un verre ou faire une pause pipi !
Résumé
Le format WebP a été créé par Google en 2010. Le format WebP est devenu la norme pour les sites Web mobiles et bureau, en raison des avantages qu’il présente sur les autres formats Web existants jusqu’alors. Il inclut une compression sans perte, ce qui signifie que les images conservent leur qualité mais que la taille du fichier est 30% moins volumineuse. Par conséquent, votre site web améliore ses performances, son expérience utilisateur et sa fluidité, ainsi que son référencement dans les moteurs de recherche. Pour utiliser le format WebP, vous pouvez soit convertir manuellement vos fichiers en masse à l’aide d’un script Photoshop, soit utiliser le plugin WordPress WebP Express.
Cet article est terminé. N’hésitez-pas à me poser vos questions ! 🙂
