Dynamic Mediaを使用したAEMaaCSでのスマートイメージングとDPR動作の設定

Dynamic Mediaを使用したAdobe Experience Manager as a Cloud Service(AEMaaCS)でのブラウザーフォーマット変換(BFC)、ネットワーク帯域幅の最適化、デバイスピクセルレシオ(DPR)の最適化などのスマートイメージング機能は、設定と理解を混乱させる可能性があります。 この記事では、これらの機能がどのように機能するのか、画像の配信にどのような影響を与えるのか、コアコンポーネントを使用する際に正しく設定するために何を考慮すべきかについて説明します。

説明 description

環境

  • 製品: Adobe Experience Manager as a Cloud Service - Assets (Dynamic Media)
  • 制約:Dynamic Media統合でのImage V3 コアコンポーネントの使用

問題/症状

  • Dynamic Media アカウントレベルでスマートイメージングを有効にしても、Image V3 コアコンポーネントでレンダリングされた画像にDPR最適化が自動的に適用されません。
  • パラメーターdpr=offは、複数の幅がコンポーネントポリシーで設定されていないか、smartCropが有効になっていない場合に、Scene7画像URLに追加されます。
  • 高DPI/Retina ディスプレイで画像の画質が低い、またはシャープが少ない場合は、正しく設定されていません。
  • dpr=onを設定するか、画像修飾子を使用してDPR値を渡しても、コンポーネントロジックが原因でこの動作が上書きされません。

解決策 resolution

この問題を修正するには、次の手順に従います。

  1. 環境(ステージングまたは実稼動)のDynamic Media会社またはアカウントレベルでスマートイメージングを有効にします。

  2. Dynamic Mediaが有効になっているImage V3 コアコンポーネントを使用するテンプレートまたはページを開きます。

  3. テンプレートまたはページで使用されるImage V3 コアコンポーネントのポリシーを編集します。

  4. コンポーネントポリシーで、レスポンシブ画像の複数の幅を設定します。

  5. 更新したポリシーを保存して適用します。

  6. 影響を受けるページを再公開して、変更を有効にします。

  7. 標準的なDPIと高DPI (Retina)デバイスの両方で画像レンダリングをテストします。

    • 標準のDPI画面では、大きな画像を避けるために、デザインごとにdpr=offが画像URLに表示されます。
    • 高DPI画面では、複数の幅が設定されている場合に、高解像度の画像が配信されます。
  8. 手作業による修飾子を使用せずに画質を向上させる必要がある場合は、画像V3の代わりに専用のDynamic Media コンポーネントを使用します。

  9. 高DPI ディスプレイで画像がクリアされ、標準ディスプレイで効率的に読み込まれることを確認します。

メモ

  • デフォルトでdpr=offを追加すると、Retina以外の画面に不必要に大きな画像が表示されなくなります。 これは製品の欠陥ではなく、最適化のセーフガードです。
  • URL修飾子またはプリセットを使用してDPRを強制しても、Image V3でこのセーフガードは上書きされません。 代わりに、ポリシーで複数の幅を使用してください。
  • アカウントレベルのDPR最適化を有効にした後、アプリケーション側のURLを変更する必要はありません。 クライアントサイドのロジックは、必要に応じて高度なシナリオに使用できます。
  • スマートイメージング形式の変換(WebPやAVIFなど)は、アカウントレベルでスマートイメージングがアクティブな場合、デフォルトで有効になります。 品質に影響を与えることなくファイルサイズを縮小する場合にのみ適用されます。

関連トピックス

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