Configuration de l’imagerie dynamique et du comportement DPR dans AEMaaCS avec Dynamic Media

Les fonctionnalités d’imagerie dynamique telles que la conversion au format du navigateur (BFC), l’optimisation de la bande passante réseau et l’optimisation du rapport pixel d’appareil (DPR) dans Adobe Experience Manager as a Cloud Service (AEMaaCS) avec Dynamic Media peuvent être difficiles à configurer et à comprendre. Cet article explique le fonctionnement de ces fonctionnalités, comment elles affectent la diffusion des images et ce qu’il faut prendre en compte pour une configuration correcte lors de l’utilisation des composants principaux.

Description description

Environnement

  • Produit : Adobe Experience Manager as a Cloud Service - Assets (Dynamic Media)
  • Contraintes : utilisation du composant principal Image V3 avec l’intégration de Dynamic Media

Problème/Symptômes

  • L’activation de l’imagerie dynamique au niveau du compte Dynamic Media n’applique pas automatiquement l’optimisation du DPR aux images rendues par le composant principal Image V3.
  • Le paramètre dpr=off est ajouté aux URL d’image Scene7 lorsque plusieurs largeurs ne sont pas configurées dans la stratégie du composant ou lorsque smartCrop n’est pas activé.
  • Si elles ne sont pas configurées correctement, les images apparaissent de qualité inférieure ou moins nettes sur les affichages haute résolution/Retina.
  • La définition de dpr=on ou la transmission de valeurs DPR via des modificateurs d’image ne remplace pas ce comportement en raison de la logique du composant.

Résolution resolution

Pour résoudre ce problème, procédez comme suit :

  1. Activez l’imagerie dynamique au niveau de la société ou du compte Dynamic Media pour votre environnement (d’évaluation ou de production).

  2. Ouvrez le modèle ou la page qui utilise le composant principal Image V3 avec Dynamic Media activé.

  3. Modifiez la politique du composant principal Image V3 utilisé dans le modèle ou la page.

  4. Configurez plusieurs largeurs pour les images réactives dans la stratégie du composant.

  5. Enregistrez et appliquez la politique mise à jour.

  6. Republiez les pages concernées pour que les modifications soient prises en compte.

  7. Testez le rendu d’image sur les appareils DPI standard et DPI élevé (Retina) :

    • Sur les écrans DPI standard, dpr=off apparaît dans les URL d’image dès la conception pour éviter les images volumineuses.
    • Sur les écrans à résolution élevée, des images à résolution plus élevée sont diffusées lorsque plusieurs largeurs sont configurées.
  8. Utilisez le composant Dynamic Media dédié au lieu du composant Image V3 si vous avez besoin d’une meilleure qualité d’image sans modificateurs manuels.

  9. Vérifiez que les images sont claires sur les affichages à forte DPI et se chargent efficacement sur les affichages standard.

Notes

  • L’ajout de dpr=off par défaut évite les images inutilement volumineuses sur les écrans autres que Retina. Il ne s’agit pas d’un défaut du produit, mais d’une garantie d’optimisation.
  • Le fait de forcer le DPR à utiliser des modificateurs d’URL ou des préréglages ne remplace pas cette protection dans Image V3. Utilisez plutôt plusieurs largeurs dans les politiques .
  • Aucune modification d’URL côté application n’est requise après l’activation de l’optimisation du DPR au niveau du compte. La logique côté client peut toujours être utilisée pour les scénarios avancés, si nécessaire.
  • La conversion de format d’imagerie dynamique (par exemple, WebP ou AVIF) est activée par défaut lorsque l’imagerie dynamique est active au niveau du compte. Elle s’applique uniquement lorsqu’elle réduit la taille du fichier sans affecter sa qualité.

Lecture connexe

recommendation-more-help
experience-cloud-kcs-help-kbarticles