Afin d’améliorer la vitesse de votre site, vous pouvez proposer des images webp sur votre site (format .webp). Ces « nouveaux » formats permettent une meilleure compression en gardant la même qualité d’image. Ils sont acceptés et affichés par quasiment tout les navigateurs, sauf un, qui représente une proportion non négligeable d’internautes : Safari (Iphone, Ipad, Mac, …).
Comment proposer une alternative aux images webp pour Safari ?
Une fois que vous avez vos images au format webp, il va falloir modifier les codes HTML correspondant aux balises <img>. Ceci afin de proposer les images aux formats webp pour les navigateurs qui pourront les afficher et aux formats classiques (jpg, png, …) aux autres.
Pour cela, trouvez vos balises classiques :
[pastacode lang= »markup » manual= »%3Cimg%20src%3D%22mon-image.jpg%22%2F%3E » message= » » highlight= » » provider= »manual »/]
Et utilisez la balise <picture> en remplacement qui vous permet de proposer une solution alternative pour les navigateurs n’affichant pas les images au format webp :
[pastacode lang= »markup » manual= »%3Cpicture%3E%0A%3Csource%20srcset%3D%22mon-image-1er-format.webp%22%20type%3D%22image%2Fwebp%22%3E%0A%3Csource%20srcset%3D%22mon-image-2nd-format.jpg%22%20type%3D%22image%2Fjpg%22%3E%0A%3Cimg%20src%3D%22mon-image-2nd-format.jpg%22%20alt%3D%22Texte%22%3E%0A%3C%2Fpicture%3E » message= » » highlight= » » provider= »manual »/]
Cette balise vous permet ainsi de proposer des images optimisées pour Chrome, FireFox, Edge, aux formats webp. Ceci afin d’améliorer la vitesse de votre site qui peut par exemple être mesurée avec PageSpeed Insights. Et d’autre part la balise permet de proposer des images aux formats « classiques » tels que jpg ou png pour les internautes sur Safari (Iphone, Ipad, Mac, …).
Voilà vous pouvez ainsi proposer une alternative aux images webp pour Safari. Vous aurez également ainsi optimisé la vitesse de votre site et peut-être en partie le référencement avec des images au format webp.
Merci votre article m’a été très utile, pour régler la problématique de Apple.
De rien !
BONJOUR JEREMY
POUVEZ M’AIDER
J’AI LE MEME SOUCIS MAIS JE NE SAIS PAS OU ALLER POUR CHANGER CE CODE
Bonjour et merci. Nous sommes le 26-6-2022 – Sur Safari (ipad), je vois les images au format Webd que j’ai mise sur mon site. Est-ce à dire que ce problème n’existe plus et qu’il n’y a plus lieu de mettre des instructions spéciales désormais ? merci
Gérard
Bonjour,
de rien et merci pour le commentaire.
Non apparemment toutes les versions ne peuvent pas encore afficher le format webp. Plus d’informations sur ce lien : https://caniuse.com/webp.
Bonne journée !
Jérémy.
je voulais dire au format webp