文档AEM用户指南

[AEM Assets]{class="badge positive" title="适用于AEM Assets)。"}

优化图像质量的最佳做法 best-practices-for-optimizing-the-quality-of-your-images

最近更新： 2026年9月29日
  • 适用对象：
  • Experience Manager as a Cloud Service

创建对象：

  • 用户
TIP
您是 Dynamic Media 的新手吗？ 如需快速、全面地了解 Dynamic Media，请参阅使用 Dynamic Media。

Adobe Experience Manager提供了​ 100多条Dynamic Media图像投放命令 ​用于优化、优化和渲染图像。 这个庞大的命令集可以控制图像处理和提供方式的几乎每个方面，从分辨率和压缩到锐化和颜色渲染。

优化图像质量是一个反复的过程，有时很耗时，因为有多个不同的因素会影响可接受的结果，包括​分辨率、压缩级别、文件格式、锐化​和​颜色精度。 结果也是部分主观的，因为个人对图像质量的感知是不同的，并且观看条件因显示器、浏览器或设备的不同而不同。 由于这种可变性，结构化试验是必不可少的：一次系统地调整一个变量并比较渲染的输出是获得一致质量的最可靠途径。

以下最佳实践使用一组核心命令和经验证的技术，简化了流程并高效地提供高质量结果。 应用这些组件不仅在美学上很重要：正确优化的图像可减少文件大小和加载时间，从而在所有设备和网络条件下提高页面性能、改善用户体验并提高交付。

影响图像质量的关键因素

  • 分辨率和尺寸 — 将交付的像素尺寸与实际显示大小相匹配，以避免不必要地放大或缩小项目。
  • 压缩 — 平衡文件大小以防止可见质量损失，因为主动压缩会减少带宽，但可能会引入工件。
  • 文件格式 — 选择最适合图像内容和目标设备的格式，以平衡质量和传递效率。
  • 锐化 — 应用锐化以抵消在调整大小过程中发生的柔化，从而恢复感知到的详细信息。
  • 颜色渲染 — 保留精确的颜色，以便在不同显示器和查看环境中显示一致的图像。

推荐的方法

  1. 建立基线。 使用默认设置渲染图像，以便您具有用于比较的参考点。
  2. 一次调整一个变量。 更改单个命令或参数，然后评估结果，因为隔离变量可以清楚地说明哪个调整产生了哪些效果。
  3. 以可视方式比较渲染输出。 由于图像质量在一定程度上是主观的，因此在代表性设备上并排查看结果并显示结果。
  4. 平衡品质与性能。 确认质量改进不会使文件大小增加到页面加载时间和投放受损的程度。
  5. 标准化成功的设置。 确定产生一致结果的命令组合后，请重复使用它们以简化将来的优化。

通过将这些基本命令与结构化试验相结合，您可以跨Dynamic Media资产快速且可重复地实现高质量、高性能图像交付。

在Dynamic Media中启用智能成像 bp-enable-smart-imaging

智能成像：

  • 在Dynamic Media中启用智能成像允许基于客户端浏览器功能自动优化图像​格式、大小​和​质量。 智能成像对每个请求都执行此格式协商，提供给定浏览器支持的最有效图像，以便页面加载速度更快，占用带宽更少。
    有关详细信息，请转到智能成像。
  • 它通过动态调整这些参数来增强图像投放性能，因为针对每个浏览器投放最小的合适文件可减少已传输的有效负载并缩短页面加载时间。
  • 管理员和开发人员可以使用自我评估工具快照来评估智能成像。

图像格式：

  • 避免在URL中使用显式fmt=webp (WebP)或fmt=avif (AVIF)命令，除非用例特别需要。 对URL中的格式进行硬编码将覆盖自动协商，并且可以阻止智能成像为支持更高效的替代方案的浏览器提供最佳格式。
  • 智能成像会自动为每个请求选择最佳格式。 这减少了传送的字节数并产生最佳带宽增益。

默认行为：

  • 如果未在URL中指定格式命令并且未启用智能成像，则Dynamic Media图像投放默认为​ JPEG ​格式。 因此，在启用智能成像之前，不会自动提供新一代格式，如​ WebP ​和​AVIF。

通过就图像格式做出明智选择并启用智能成像，您可以直接改善交付性能和用户体验。

选择源图像的最佳实践 bp-select-source-image

使用源图像的基本注意事项：

  • Source图像格式：

    • 使用​无损格式 — PNG （可移植网络图形）、TIFF （标记图像文件格式）或PSD （Photoshop文档） — 保持高图像质量并消除压缩伪像，这些伪像是有损格式（如JPEG）引入的可见扭曲。
    • 这些格式会保留所有原始像素数据。 这使得它们非常适合进行编辑、修饰和重复重新保存，因为每次处理文件时都不会丢失任何质量。

  • Source图像大小：

    • 从​ 高分辨率图像 ​开始，可提供更多详细信息和更大的灵活性，因为升级小图像无法恢复从未捕获的详细信息。
    • 当需要以不同大小（例如，跨设备或屏幕分辨率）显示图像时，较大的源图像允许在每一个目标维度上实现更好的缩放和更清晰的结果。
    • 对于支持缩放的图像，例如客户检查细微细节的产品照片，最大尺寸为​约2,000像素或更多，位于最长的一侧。
    • 不需要缩放的标识或横幅可以按照其预期用途所需的最大尺寸上传。

在源级别做出这些选择将直接决定最终可视内容的质量，因为每个下游的调整大小、裁切和压缩步骤都会继承原始文件的优点和缺点。

图像大小的最佳实践 best-practices-for-image-size

动态减小图像大小是图像投放中最常见的任务之一。 它涉及指定目标尺寸，以及（可选）选择用于缩小图像的缩减取样模式。 建议的最佳实践URL模式为​&wid=<value>&hei=<value>&resMode=sharp2（或者在仅设置高度时为​&hei=<value>&resMode=sharp2），这可为调整大小的图像提供最高的视觉质量。

调整参数大小

要调整图像大小，请使用​ &wid=<value> ​和​&hei=<value>：

  • &wid=<value>​设置图像宽度。
  • &hei=<value>​设置图像高度。
  • 当只指定了一个尺寸时，这些参数根据图像的纵横比自动计算另一个尺寸，从而保持原始比例并防止失真。

缩减取样模式(resMode)

&resMode=<value>​控制用于缩减像素采样的算法 — 减少图像像素尺寸的过程。 算法的选择直接影响最终缩放图像的锐度和质量。

  • 开始于&resMode=sharp2。 该值可提供最佳的图像质量，因为它在缩放图像时保留边缘细节和精细纹理，从而生成清晰、无人工因素的结果。
  • &resMode=bilin （双线性）速度更快，但由于它更简单地计算像素的平均值，因此它经常产生锯齿伪像 — 可见的锯齿边缘、叠印图案和细节丢失。 因此，bilin用图像质量换取处理速度。

与 bilin不同，sharp2模式优先处理视觉保真度，使其成为提供高品质调整大小图像的首选选择。

推荐的最佳实践

作为调整图像大小的最佳实践，请使用​ &wid=<value>&hei=<value>&resMode=sharp2 ​或​&hei=<value>&resMode=sharp2。 此组合设置目标维度，保持正确的纵横比，并应用最高质量的缩减像素采样算法。

图像锐化的最佳实践 best-practices-for-image-sharpening

图像锐化是控制网站上图像的最复杂方面，并且会产生许多错误。 要详细了解锐化和USM在Experience Manager中的工作方式，请参阅以下有用资源：

在Experience Manager中，您可以在摄取和/或交付期间锐化图像。 作为最佳实践，锐化图像时只使用一种方法，而不是同时使用两种方法。 通过URL在投放时锐化图像可在大多数工作流中提供最佳结果，因为它允许您调整锐化以最终呈现的大小，而不是将其烘焙到摄取的资产中。

可以使用两种图像锐化方法：

  • 简单锐化(&op_sharpen) — 与Adobe Photoshop锐化滤镜类似，它在动态调整大小后应用基本锐化。 此方法不是用户可配置的；除非需要，否则避免使用&op_sharpen。

  • USM锐化(&op_USM) -USM锐化是一种行业标准锐化滤镜，它增加边缘对比度以使图像看起来更清晰。 最佳实践是遵循以下准则，使用钝化蒙版来锐化图像。 USM锐化允许您控制以下三个参数：

    • &op_sharpen=金额，半径，阈值

      • 数量 （0-5，效果的强度。）
      • 半径 （0-250，围绕锐化对象绘制的“锐化线”的宽度，以像素为单位。）

      半径​和​ 数量 ​参数具有相反的效果：因为减小半径会削弱效果，所以可以通过增加数量进行补偿。 半径允许更细的控制，因为较低的值仅锐化边缘像素，而较高的值锐化较宽范围的像素，从而产生更明显的光晕。

      • 阈值 （0-255，影响敏感度。）

      此参数确定锐化的像素与周围区域必须有多大的不同，才会被视为边缘像素，而滤镜会锐化这些像素。 threshold​参数有助于避免过度锐化颜色相似的区域，如肤色。 例如，阈值为​ 12 ​时忽略肤色亮度的细微变化，以避免添加“杂色”，同时仍会为高对比度区域添加边缘对比度，如睫毛与皮肤相遇的地方。

      有关如何设置这三个参数的更多信息（包括要与过滤器一起使用的最佳实践），请参阅以下资源：

作为最佳实践，请从钝化蒙版半径参数开始。 可以开始使用的Radius设置如下：

  • 网站： 0.2-0.3像素
  • 照片打印(250-300 ppi)： 0.3-0.5像素
  • 胶印打印(266-300 ppi)：0.7-1.0像素
  • 画布打印(150 ppi)： 1.5-2.0像素

请按照以下步骤优化锐化：

  1. 逐渐将数量从​1.75增加到4。
  2. 如果锐化仍不能令人满意，请将半径增加一个小数点。
  3. 再次运行从​ 1.75到4 ​的金额。
  4. 根据需要重复执行，直到获得满意的结果。

将单色参数设置保留在​0。

JPEG压缩的最佳实践(&qlt=) best-practices-for-jpef-compression-qlt

  • 建议的JPG压缩最佳实践设置为&qlt=85,0。 该值可在大多数图像的高视觉质量与受控文件大小之间取得平衡。

  • 此参数可控制JPG编码质量。 较高的值​表示图像质量较高，但文件大小较大；较低的值​表示图像质量较低，但文件大小较小。 有效范围为​0-100。

  • 要优化质量，请勿将参数值设置为​100。 90或95​设置与​ 100 ​之间的差异几乎肉眼看不到。 因此，设置​ 100 ​会不必要地增大图像文件大小，而不会产生可察觉的视觉增益。 因此，要优化质量，同时避免文件过大，请将qlt= value设置为​90或95。

  • 要优化小文件大小，同时使图像质量保持在可接受的级别，请将qlt= value设置为​80。 低于​ 70-75 ​的值会引入显着的可见降级，例如阻止工件、分段，以及细部细节的丢失，因此不建议将它们用于生产图像。

  • 作为一般最佳实践，请将qlt= value设置为​85，这可在多种图像内容中在质量和文件大小之间提供一个可靠的中间点。

  • 在qlt=​中使用色度标志

    • qlt=参数具有控制​ RGB色度缩减采样 ​的第二个设置，该压缩技术降低了颜色（色度）信息的分辨率，同时保留亮度细节。 使用值​ ,1 ​关闭缩减像素采样​开启，或使用值​ ,0 ​关闭​关闭。
    • 对于大多数工作流，从RGB色度缩减像素取样关闭​开始 (,0)。 此设置可提供更好的图像质量，因为它会保留全分辨率颜色数据，这对于具有锐边、高对比度和精细颜色过渡的合成图像最重要，否则缩减像素取样伪像将可见。

作为压缩JPG的最佳实践，请使用​&qlt=85,0。

JPEG大小调整的最佳实践(&jpegSize=) best-practices-for-jpeg-sizing-jpegsize

&jpegSize=参数可确保交付的图像不超过指定的最大大小，因此对于将JPEG图像交付到内存有限的​设备至关重要。 通过强制设置文件大小的上限，可以防止过大的图像超出受限客户端上的可用内存。

&jpegSize=的工作方式

  • 使用语法jpegSize=<size_in_kilobytes>设置&jpegSize= （以KB为单位）。 此值定义图像投放允许的最大文件大小​为。
  • &jpegSize=与​JPEG质量（压缩）参数 &qlt=结合使用。 当指定&qlt=值的JPEG响应​ 不 ​超过jpegSize限制时，将返回与定义完全相同的&qlt=图像，并保留请求的质量。
  • 如果图像​ 在指定的&qlt=处超过jpegSize限制，则系统将逐步减少&qlt=，直到图像符合最大允许大小。 ​因此，质量仅被减少到满足尺寸限制所需的程度，从而确保与目标设备的兼容性。
  • 如果系统确定图像​ 不能缩小 ​以适合所允许的最大大小，它返回错误而不是传送不兼容的图像。

有限内存设备的最佳实践

作为最佳实践，在将JPEG图像传送到内存受限的设备时，设置&jpegSize=并将其与&qlt=​配对。 此组合允许您同时指定目标质量和硬大小上限，因此系统可提供尽可能最高的质量，并且仍符合设备的内存限制。

最佳实践摘要 best-practices-summary

若要以较小的文件大小​ 实现 ​高图像质量，请从以下推荐的Dynamic Media图像服务参数组合开始：

fmt=jpg&qlt=85,0&resMode=sharp2&op_usm=1.75,0.3,2,0

这种组合在大多数情况下都能产生出色的结果，并且是大多数图像的可靠基准。 op_usm值应用​ 钝化蒙版(USM) ​锐化，其中参数控制效果的量、半径、阈值和单色行为。

微调锐化（USM锐化）

如果图像需要进一步优化，请使用以下过程逐步调整​ 钝化蒙版(USM) ​参数：

  1. 将​ 半径设置为0.2或0.3 ​作为起点。
  2. 将​数量从1.75增加到最大4 — 相当于Adobe Photoshop 中的 400%。
  3. 查看渲染的图像以确认达到了预期效果。
  4. 如果锐化结果仍然不令人满意，请以小数点增量​ 增加 ​半径。
  5. 对于半径的每次小数增量，请在​ 1.75 ​处重新启动该数量，并逐渐将其增加到​4。
  6. 重复步骤4和5，直到达到预期结果。

虽然上述值代表了创意工作室已经验证的方法，但您可以从其他值开始并遵循其他策略。 结果是否令人满意是一个主观问题，因此​结构化、迭代实验是必不可少的，以便在每幅图像的清晰度、质量和文件大小之间达到最佳平衡。

工作流优化提示

在实验过程中，以下一般建议有助于优化您的工作流：

  • 在URL上实时测试参数。 通过直接在URL中调整值，您可以立即预览效果并快速进行迭代。
  • 将命令分组到图像预设中。 Dynamic Media图像服务命令可以分组为图像预设。 图像预设是一组URL命令宏，这些宏指定了自定义预设名称，如$thumb_low$和&product_high$。 在URL路径中引用自定义预设名称会调用这些预设。 此功能可帮助您管理整个网站中不同图像使用模式的命令和质量设置，通过重用促进一致的设置，并缩短URL的总长度。
  • 在Experience Manager中使用高级优化选项。 Experience Manager还提供了更高级的方法来调整图像质量，例如在摄取时应用锐化。 要调整和优化渲染结果，Adobe的咨询服务可提供自定义的insight和最佳实践。
recommendation-more-help
experience-manager-cloud-service-help-main-toc