在移动应用程序中,文章文件和图像的大小会影响性能。建议尽可能避免使用较大的文章文件并在图像大小和显示质量之间找到恰当的平衡。

图像优化视频

图像优化视频
本视频介绍了提高 AEM Mobile 应用程序性能的四种方法。(2017 年 1 月录制)

优化集合背景图像

我们建议您使用主目标设备的尺寸来创建背景图像(如纵向 iPad 应用程序的 1536x2048 JPG 图像),并且将 JPG 图像的质量级别设置为中等。

缩放背景图像以填充屏幕并居中放置,这样,如果背景图像的尺寸与设备尺寸不匹配,可对图像的边缘进行裁剪。

可以对背景图像使用 JPG 或 PNG 格式。在大多数情况下,JPG 格式产生的图像文件较小,但质量高。 

但是,在下列情况下,请考虑使用 PNG,而不是 JPG:

  • 如果图像带有透明度(例如,如果您希望背景颜色可透视显示)。
  • 如果图像包含较小的调色板,则 PNG 图像通常可比 JPG 图像能更好地进行压缩。
  • 如果图像包含文本或矢量对象,则 PNG 图像通常比 JPG 图像更清晰。

 

找到大小和质量之间理想的结合点。例如,一张标准的背景图像大约应为 200KB,而不是 5MB。

浏览带背景图像的页面

优化卡图像和横幅

我们建议您根据卡的图像显示区域的最大尺寸来创建卡和横幅图像,并将质量级别调整为中等。找到大小和质量之间理想的结合点。

在测试过程中,我们发现使用尺寸较大,但质量设置较低的 JPG 图像可在移动应用程序中实现最有效的尺寸质量平衡。如果图像带有透明度或文本,请使用 PNG 图像。

卡图像用于卡上时会进行缩放、居中和裁剪处理。因此图像与您的设计意图可能会有所不同。使用突出功能在图像中心附近设计图稿。卡的大小、尺寸和卡上图像长宽比的更改将影响图像显示在卡上的样式。

浏览全宽卡页面

在文章和动态横幅中使用 HTML 内容的指南

注意您包含在 HTML 文章中的图像文件的大小。虽然大图像在 Web 浏览器中可能会显示正常,但大图像会影响移动应用程序中文章的下载速度。压缩图像。查找将在您的目标设备上显示清晰图像的正确压缩设置。

如果使用 AEM Mobile Article Packager 创建 HTML 文章或动态横幅,请记住,当您将 HTML 文件的文件夹拖放到 Packager 时,即使未使用资源,所生成的文章文件也将包括这些文件夹中的所有文件。确保在生成文章文件前简化您的 HTML 文件。例如,如果包含同一图像的多个实例(如 PSD、JPG 和 PNG 图像),请确保删除所有未用在 HTML 中的图像。

如果您使用内容管理系统 (CMS) 创建文章文件,请确保文章文件不包含过大的图像或未使用的资源。

有关详细信息,请参阅创建适用于 AEM Mobile 的 HTML 文章

在基于 InDesign 的文章中使用的图像

调整嵌入式视频文件的大小或对其进行优化,还可考虑使用流式传输视频而非进行嵌入。

如果您使用 InDesign 创建固定布局的文章,则在您导出文章时,所有非交互式资源将自动进行重新取样,因此您无需担心在 InDesign 布局中使用大图像。

对于交互式叠加,了解传递重新取样叠加之间的差异很重要。

  • 重新取样叠加(幻灯片、按钮和可滚动框架)采用与非交互式内容类似的方式进行压缩。
  • 传递叠加在您导出文章时未压缩。它们以您在创建它们时使用的大小进行传递。传递叠加包括视频和音频文件、图像序列、平移和缩放图像以及音频控制器文件。对于传递叠加,请注意文件的大小和质量。

有关详细信息,请参阅交互式叠加概述

在 HTML 文章中共享字体

不必为每篇 HTML 文章加载同一组字体,即可使用 On-Demand Services 门户指定要在应用程序中包含的字体。然后,您可以单击相应选项以复制使用的字体列表并在 CSS 或 HTML 文件中包含此列表。通过引用共享字体,可缩短应用程序中 HTML 文章的下载时间。请参阅以下文章:

自定义 AEM Mobile 应用程序:使用自定义字体

创建适用于 AEM Mobile 的 HTML 文章:使用共享字体

在 HTML 文章中共享资源

如果使用内容管理系统 (CMS) 为 AEM Mobile 创作文章,则可以使用共享内容 API 绑定在这些文章之间共享的内容。共享图像、JavaScript 和 CSS 文件是提高应用程序性能和确保一致性的好方法。请参阅使用 On-Demand Services API 处理共享内容

本产品经 Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License 许可  Twitter™ 与 Facebook 中的内容不在 Creative Commons 的条款约束之下。

法律声明   |   在线隐私策略