Record how an author selects an asset, how that asset becomes available for delivery and how the component chooses an image URL. A page rendering successfully does not prove that its image request is correctly sized or publicly available.
AEM Assets and Dynamic Media: Responsive Image Delivery Architecture.
Responsive imagery connects editorial choices in AEM Assets to the bytes a browser downloads. This representative design aligns Dynamic Media transformations, component image requests and asset publication, while treating the asset delivery endpoint separately from the AEM page cache.
Representative engineering design, not a verified client delivery record. Implementation steps and validation checks describe the proposed approach; no measured results are claimed.
Follow the asset from DAM selection to browser request
A valid image URL may still be the wrong delivery choice
Original-size downloads, unsuitable crops and inconsistent transformation parameters can undermine a responsive component. The contract must cover both visual intent and delivery behavior.
Keep page delivery and image delivery distinct
AEM Sites renders the component markup; Dynamic Media supplies transformed imagery through its configured delivery URLs. Inspect the actual asset host and caching behavior instead of assuming every image traverses the page’s Dispatcher path.
Constrain transformations around component requirements
Define reviewed image presets or transformation conventions that match real component widths and crop needs. Pair them with responsive markup and sensible dimensions so the browser can select an appropriate resource.
- Validate the generated URL and transformation parameters.
- Check asset publication independently from page publication.
- Preserve meaningful alternative text and author-controlled visual intent.
Prefer a bounded transformation contract
An agreed set of image sizes and presets is easier to reason about than unconstrained URL variations. Allow exceptions deliberately where editorial composition needs them.
More image variants increase delivery complexity
Fine-grained variants can fit more layouts but create more URLs to validate and cache. Aggressive cropping also risks changing the intended subject, so performance choices need editorial review.
Inspect what the browser actually downloads
Use representative viewport sizes and assets to verify delivery, without inventing a performance improvement.
- Inspect selected resource dimensions, transferred bytes and content type.
- Check crop intent, missing-asset behavior and layout stability.
- Update an asset and verify freshness at its delivery URL.
Image architecture is also an authoring contract
The author should not need to understand delivery URL syntax to produce a correct experience. Keep transformation choices predictable and diagnose image delivery independently from HTML caching.
Technical references
These sources document product behavior. The design and validation approach above are engineering proposals, not claims made by the vendors.
Working through a similar platform problem?
This representative case study explores technical trade-offs and architectural decisions for a specific engineering scenario. If you are planning a similar migration, modernization, or integration, let's discuss the engineering approach.
Start a conversation