Les navigateurs modernes veulent de l'AVIF, les anciens du WebP, et il faut bien quelque chose pour tout le reste. Déposez une image et repartez avec l'ensemble complet, plus le balisage qui sert à chaque visiteur celui qui lui convient.
Chacune produit l'ensemble complet, pas un fichier unique.
AVIF, WebP et JPEG en 1280 et 360 pixels, plus un élément picture par image avec les sources dans le bon ordre.
Indiquez le dossier où vivront les images et le texte alternatif, copiez le balisage et prenez le zip : le HTML s'y trouve aussi en fichier texte.
Parce qu'un navigateur prend la première source qu'il sait lire : l'AVIF doit venir avant le WebP et l'img simple doit venir en dernier. Ordre inversé, chaque visiteur reçoit le plus gros fichier que vous avez proposé. C'est la partie fastidieuse à écrire à la main et facile à rater sans s'en apercevoir.
1280 couvre les portables et la plupart des tablettes ; 360 couvre les téléphones, là où l'économie compte vraiment. Le srcset laisse le navigateur choisir : un téléphone sur une connexion lente ne télécharge jamais le fichier de bureau.
Non. Ce sont des fichiers ordinaires : posez-les à côté de votre HTML et le balisage fonctionne. Si vous mettez plus tard un vrai CDN d'images devant votre site, vous n'aurez plus besoin de rien de tout cela, mais pour une poignée d'images sur une page écrite à la main, c'est tout le travail.
Ce que montre l'image, raconté à quelqu'un qui ne peut pas la voir. Chaque image du lot a son propre champ, parce qu'une description commune à dix photographies n'aide personne. Ne le laissez vide que si l'image est purement décorative.
Optimiseur d'images en ligne gratuit