Les formats WebM et WebP à la loupe
Nous avons une large variété d’options pour optimiser les médias destinés aux sites internet. Il est possible de les optimiser par exemple en utilisant des formats modernes tels que WebM ou WebP. Ces formats de nouvelle génération permettent de gagner du temps car elles sont des versions réduites des médias (JPEG, PNG, GIF, etc.).
Format WebP pour optimiser les fichiers d’images
Il s’agit d’un format d’image conçu par les développeurs de Google pour favoriser une navigation plus fluide sur le net. WebP réduit le volume des images par compression (avec perte ou sans). Même si le format WebP est bien géré par de nombreux navigateurs, il ne l’est qu’en partie. Par conséquent, il est utile de prévoir une autre alternative si vous utilisez d’anciens navigateurs.
Il existe une bibliothèque dénommée libwebp accessible à différents support (Mac, Windows et Linux) destinée à convertir des médias en WebP. Ces derniers peuvent être des vidéos, des images ou encore des GIF.
Comment utiliser le format WebP pour optimiser les images ?
Il est facile d’optimiser les images du net en WebP, suivez les étapes énoncées ci-après :
- Premièrement, commencez en téléchargeant la bibliothèque libwebp sur votre appareil et en la décompressant. Il pourrait être utile de joindre des liens symboliques aux fichiers bin pour y accéder facilement depuis n’importe quel périphérique.
- Deuxièmement, utilisez les outils lorsqu’ils seront prêts. Par exemple, avec l’outil cwebp, il est possible de convertir des fichiers d’images PNG/JPEG au format WebP. Vous pourriez être embêté par les notions d’encodage des extensions donc retenez les quelques notions énoncées ci-après :
- La qualité est codée sous l’extension q qui peut varier de 0 à 100 (75 par défaut).
- L’extension lossless désigne les images comprimées sans compromettre leur qualité (sans perte)
- Le code exact conserve le mode colorimétrique RVB dans les parties transparentes.
Petit conseil, évitez de remplacer les anciennes images, sauvegardez-les tout en répertoriant autre part les fichiers convertis. En fait, ces anciens fichiers vous serviront encore pour la prochaine étape.
- Troisièmement, il faudra exécuter une partie assez ennuyeuse mais essentielle à l’optimisation d’image. Il faut savoir que certains navigateurs comme Safari ne prennent pas en charge WebP. Par conséquent, il faudra télécharger une image de repli (PNG ou JPEG) au lieu du WebP pour ce genre de navigateurs.
Format WebM pour les animations graphiques
WebM est un projet connexe de WebP développé par Google. Vous l’aurez sans doute deviné, on l’a conçu pour mettre des fichiers vidéo et audio sur le Web. En outre, il faut également prévoir de convertir les GIF au format vidéo WebM. Vous pourrez ensuite utiliser l’Open Video pour parcourir en boucle les vidéos.
Comment utiliser le format WebM pour optimiser les graphiques animés ?
Il est possible de contourner les règles du réseau et de fournir une animation d’image hautement optimisée au format de fichier vidéo. Cette technique permet de diminuer la taille du GIF initial de près de 95 % via la compression avec perte, suivez les étapes suivantes :
Premièrement, convertissez vos fichiers GIF au format WebM. Vous pouvez par exemple utiliser ezgif.com. Cette application favorise la création de GIF animés sans avoir à fermer le navigateur web.
Deuxièmement, utilisez la balise HTML5 (vidéo) pour pouvoir parcourir les fichiers nouvellement convertis et les adapter à votre guise. Finalement, le fichier vidéo devrait apparaître comme un GIF animé sans fin. N’oubliez pas d’ajouter les attributs suivant à la vidéo créée, pour :
Parcourir la vidéo après le téléchargement : attribut Autoplay (lecture automatique)
- La lecture en boucle de la vidéo : attribut loop
- Activer la lecture automatique pour les navigateurs qui l’exige : attribut muted
- Éviter que la vidéo ne bascule en plein écran : attribut playsinline.
Parfois, il peut être utile de convertir les fichiers en MP4 comme option de rechange au format WebM. En effet ce format n’est pas forcément supportable pour tous les navigateurs.
Bref, il est possible d’utiliser les formats WebP et WebM pour optimiser la rapidité et l’allègement de vos médias sur le net. Le premier est adapté pour la conversion d’images et le deuxième pour l’optimisation des fichiers vidéo, audio et GIF sur le Web.
Vous pouvez aussi laissez des experts comme siteweb.army s’occuper du côté technique de la création de site web optimisé.
