Delivering Optimized Images for a Responsive Site

Search
Experience Manager 6.2 Assets User Guide
Applies to: Experience Manager 6.2 Assets

某些 Creative Cloud 应用程序、服务和功能在中国不可用。

You're viewing help content for version:

Use the Responsive code feature when you want to share the code for responsive serving with your web developer. You copy the responsive (RESS) code to the clipboard so you can share it with the web developer.

This feature makes sense to use if your web site is on a third-party WCM, not on AEM. If it is on AEM, you can deliver optimized images directly through AEM.

See also Embedding the Video Viewer on a Web Page.

See also Linking URLs to your Web Application.

To deliver optimized images for a responsive site:

  1. Navigate to the image you want supply responsive code for and in the drop-down menu, tap or click Renditions.

    chlImage_1

  2. Select a responsive image preset. The URL and RESS buttons appear. 

    chlImage_1

    Note:

    The selected asset and the selected image preset or viewer preset must be published to make the URL or RESS buttons available.

  3. Tap or click RESS. The responsive code displays.

    chlImage_1

  4. Select and copy the text and paste it in your web site to access the responsive asset.

  5. Edit the default breakpoints in the embed code to match those of the responsive web site directly in the code. In addition, test the different image resolutions being served at different page breakpoints.