Vous êtes ici :
Images réactives et formats d’image modernes (AVIF et WebP)
Chargez AVIF et WebP pour les fichiers de plus petite taille avec les navigateurs modernes, et utilisez JPEG (ou PNG pour les fichiers sans perte ou transparents) comme solution de secours. Les formats de sortie, la qualité et les règles URLUtils et MediaFile pour DIS se trouvent dans la rubrique Dynamic Imaging Service.
Le tableau Transformations prises en charge contient des détails complets sur le format, l’extension et la qualité. Cette rubrique décrit quand utiliser chaque format dans le balisage et comment votre image HTML et vos éléments source peuvent faire référence à des URL DIS.
Quand utiliser chaque format ?
| Format | Utilisation typique | Remarques |
|---|---|---|
| L’AVIF | Photographie de produits à haute compression lorsque le navigateur le prend en charge | Souvent le plus petit ; La prise en charge dépend du navigateur et de la version de l’acheteur. |
| WebP | Taille et soutien équilibrés pour les clients modernes | Un support plus large que l’AVIF ; Ce n’est toujours pas universel sur les clients très anciens. |
| JPEG / PNG | Valeur par défaut, img de secours ou transparence via PNG |
Alignez l’extension de fichier dans l’URL avec le format dont vous avez besoin. |
Amélioration progressive avec l’image
Proposez d’abord AVIF ou WebP, puis une image de base. Les URL DIS exactes (extensions et valeurs sfrm ) doivent suivre la table Transformations prises en charge et vos appels URLUtils ou MediaFile. Exemple de modèle (indépendant de l’Internet Store Markup Language (ISML)) :
<source de l’image srcset="<votre URL DIS AVIF »> type="image/avif » />
<source srcset="<votre URL DIS WebP »> type="image/webp » />
<img src="<votre URL> DIS JPEG » alt= »... » /<
>/image>
< >En pratique, vous générez chaque URL en script à partir du même viewType ou chemin avec le format / l’extension de fichier et transformez les objets pour votre site, au lieu de coder en dur les chaînes sw= dans votre HTML.
Intégrité des performances et du cache
- Maintenez les paramètres de transformation stables et minimisés: des tailles et des paramètres logiques identiques correspondent à une seule clé de cache, ce qui peut améliorer les taux de réussite au niveau du CDN. Voir Instructions relatives aux images et mise en cache des images dynamiques dans Dynamic Imaging Service .
- Omettez
q=80lorsque 80 est déjà la valeur par défaut dans votre utilisation, pour éviter unqinutile dans la chaîne alors que la documentation indique déjà la valeur par défaut. - Surveillez le poids de l’image et les taux 4xx; Les pics sont souvent corrélés à une valeur
OIMGincorrecte, à des pairessw=/sh=non valides ou à une URL de superposition qui n’est pascodée en URL. Voir Dépannage et migration .
