用户指南 取消(C)

图像和动画 GIF 的优化选项

  1. Adobe Animate 用户指南
  2. Animate 简介
    1. Animate 新增功能
    2. 图示术语表
    3. Animate 系统要求
    4. Animate 键盘快捷键
    5. 在 Animate 中使用多种文件类型
  3. 动画
    1. Animate 动画基础知识
    2. 如何在 Animate 中使用帧和关键帧
    3. 在 Animate 中使用逐帧动画
    4. 如何在 Animate 中使用经典补间动画
    5. 画笔工具
    6. 运动辅助线
    7. 补间动画和 ActionScript 3.0
    8. 关于运动补间动画
    9. 补间动画
    10. 创建补间动画
    11. 使用属性关键帧
    12. 用补间对位置进行动画处理
    13. 如何使用动画编辑器编辑补间动画
    14. 编辑补间动画的运动路径
    15. 处理补间动画
    16. 添加自定义缓动
    17. 创建和应用动画预设
    18. 设置动画的补间范围
    19. 处理另存为 XML 文件的补间动画
    20. 补间动画与传统补间
    21. 形状补间
    22. 在 Animate 中使用骨骼工具动画
    23. 在 Animate 中处理角色操纵
    24. 如何在 Adobe Animate 中使用遮罩层
    25. 如何在 Animate 中使用场景
  4. 交互性
    1. 如何使用 Animate 创建按钮
    2. 将 Animate 项目转换为其它文档类型格式
    3. 在 Animate 中创建和发布 HTML5 Canvas 文档
    4. 在 Animate 中通过代码片段添加交互性
    5. 创建自定义 HTML5 组件
    6. 使用 HTML5 Canvas 中的组件
    7. 创建自定义组件:示例
    8. 自定义组件的代码片段
    9. 最佳做法 - 使用 Animate 制作广告
    10. 虚拟现实创作和发布
  5. 工作区和工作流
    1. 创建和管理画笔
    2. 在 HTML5 Canvas 文档中使用 Google 字体
    3. 使用 Creative Cloud Libraries 和 Adobe Animate
    4. 使用 Animate 的舞台和工具面板
    5. Animate 工作流程和工作区
    6. 在 HTML5 Canvas 文档中使用 Web 字体
    7. 时间轴和 ActionScript
    8. 使用多个时间轴
    9. 设置首选参数
    10. 使用 Animate 创作面板
    11. 使用 Animate 创建时间轴图层
    12. 导出移动应用程序和游戏引擎的动画
    13. 移动和复制对象
    14. 模板
    15. 在 Animate 中查找和替换
    16. 撤消、重做和历史记录面板
    17. 键盘快捷键
    18. 如何在 Animate 中使用时间轴
    19. 创建 HTML 扩展
    20. 图像和动画 GIF 的优化选项
    21. 图像和 GIF 的导出设置
    22. Animate 中的资源面板
  6. 多媒体与视频
    1. 在 Animate 中变形和合并图形对象
    2. 在 Animate 中创建并使用元件实例
    3. 图像描摹
    4. 如何在 Adobe Animate 中使用声音
    5. 导出 SVG 文件
    6. 创建用于 Animate 中的视频文件
    7. 如何在 Animate 中添加视频
    8. 使用 Animate 绘制和创建对象
    9. 改变线条和形状
    10. Animate CC 中的笔触、填充和渐变
    11. 使用 Adobe Premiere Pro 和 After Effects
    12. Animate CC 中的颜色面板
    13. 使用 Animate 打开 Flash CS6 文件
    14. 在 Animate 中使用传统文本
    15. 向 Animate 中置入图稿
    16. 在 Animate 中导入的位图
    17. 3D 图形
    18. 在 Animate 中使用元件
    19. 使用 Adobe Animate 绘制线条和形状
    20. 在 Animate 中使用库
    21. 导出声音
    22. 在 Animate CC 中选择对象
    23. 在 Animate 中使用 Illustrator AI 文件
    24. 应用混合模式
    25. 排列对象
    26. 使用“命令”菜单自动处理任务
    27. 多语言文本
    28. 在 Animate 中使用摄像头
    29. 图形滤镜
    30. 声音和 ActionScript
    31. 绘制首选参数
    32. 用钢笔工具绘图
  7. 平台
    1. 将 Animate 项目转换为其它文档类型格式
    2. 自定义平台支持
    3. 在 Animate 中创建和发布 HTML5 Canvas 文档
    4. 创建和发布 WebGL 文档
    5. 如何打包 AIR for iOS 应用程序
    6. 发布 AIR for Android 应用程序
    7. 发布用于桌面的 Adobe AIR
    8. ActionScript 发布设置
    9. 最佳做法 - 管理应用程序中的 ActionScript
    10. 如何在 Animate 中使用 ActionScript
    11. Animate 工作区中的辅助功能
    12. 编写和管理脚本
    13. 启用自定义平台支持
    14. 自定义平台支持概述
    15. 使用自定义平台支持插件
    16. 调试 ActionScript 3.0
    17. 启用自定义平台支持
  8. 导出和发布
    1. 如何从 Animate CC 导出文件
    2. OAM 发布
    3. 导出 SVG 文件
    4. 使用 Animate 导出图形和视频
    5. 发布 AS3 文档
    6. 导出移动应用程序和游戏引擎的动画
    7. 导出声音
    8. 最佳做法 - 移动设备内容创建技巧
    9. 最佳做法 - 视频惯例
    10. 最佳做法 - SWF 应用程序创作指南
    11. 最佳做法 - 构造 FLA 文件
    12. 在 Animate 中优化 FLA 文件的最佳做法
    13. ActionScript 发布设置
    14. 指定 Animate 的发布设置
    15. 导出放映文件
    16. 导出图像和动画 GIF
    17. HTML 发布模板
    18. 使用 Adobe Premiere Pro 和 After Effects
    19. 快速分享和发布动画
  9. 故障排除
    1. 已修复的问题
    2. 已知问题

 

通过本主题可了解导出图像和动画 GIF时可以使用的各种选项。

Web 图形格式

Web 图形格式可以是位图(栅格)或矢量。位图格式(GIF、JPEG 和 PNG)与分辨率有关,这意味着位图图像的尺寸继而可能是图像品质会随显示器分辨率的不同而发生变化。矢量格式(SVG 和 SWF)与分辨率无关,可以放大或缩小图像,而不会降低图像品质。矢量格式也可以包含栅格数据。 

JPEG 优化选项

JPEG 是用于压缩连续色调图像(如照片)的标准格式。将图像作为 JPEG 格式进行优化依赖于 有损压缩,它会有选择地丢弃数据。

优化设置 A. 文件格式菜单 B. 压缩品质菜单 C. 优化菜单

品质

确定压缩程度。“品质”设置越高,压缩算法保留的细节越多。但是,使用高“品质”设置比使用低“品质”设置生成的文件大。查看几种品质设置下的优化图像,确定品质和文件大小之间的最佳平衡点。

优化后

创建文件大小稍小的增强 JPEG。要最大限度地压缩文件,建议使用优化的 JPEG 格式;但是,某些旧版浏览器不支持此功能。

渐进

在 Web 浏览器中以渐进方式显示图像。图像将显示为一系列叠加图形,从而使浏览者能够在图像完全下载前查看它的低分辨率版本。“渐进”选项要求使用 优化后的 JPEG 格式。

连续 JPEG 需要更多的内存用于查看,并且某些浏览器不支持该选项。

模糊

指定应用于图像的模糊量。此选项应用与 高斯模糊滤镜相同的效果,并允许进一步压缩文件以使文件更小。建议设置在 0.1 到 0.5 之间。

嵌入颜色配置文件 (Photoshop) 或 ICC 配置文件 (Illustrator)

在优化文件中保存颜色配置文件。某些浏览器使用颜色配置文件进行颜色校正。

杂边

为在原始图像中透明的像素指定一个填充颜色。单击“杂边”色板以在拾色器中选择一种颜色,或者从“杂边”菜单中选择一个选项:“吸管颜色”(使用吸管样本框中的颜色)、“前景色”、“背景色”、“白色”、“黑色”或“其他”(使用拾色器)。

原始图像中完全透明的像素由所选的颜色填充;原始图像中部分透明的像素与所选的颜色相混合。

GIF 和 PNG-8 优化选项

GIF 是用于压缩具有单调颜色和清晰细节的图像(如艺术线条、徽标或带文字的插图)的标准格式。与 GIF 格式一样,PNG-8 格式可有效地压缩纯色区域,同时保留清晰的细节。

PNG-8 和 GIF 文件支持 8 位颜色,因此它们可以显示多达 256 种颜色。确定使用哪些颜色的过程称为 编制索引,因此,GIF 和 PNG‑8 格式的图像有时称为索引颜色图像。为了将图像转换为索引颜色,构建颜色查找表来保存图像中的颜色,并为这些颜色建立索引。如果原始图像中的某种颜色未出现在颜色查找表中,应用程序将在该表中选取最接近的颜色,或使用可用颜色的组合模拟该颜色。

除了以下选项之外,您还可以在图像的颜色表中调整颜色数量。

损耗(仅限于 GIF)

通过有选择地扔掉数据来减小文件大小。较高的“损耗”设置会导致更多数据被扔掉。通常,您可以应用 5-10 的“损耗”值,有时可高达 50,而不会降低图像品质。“损耗”选项可将文件大小减小 5% 到 40%。

不能将“损耗”选项与“交错”选项一起使用,也不能将“损耗”选项与“杂色”或“图案仿色”算法一起使用。

减低颜色深度算法与颜色

指定用于生成颜色查找表的方法,以及想要在颜色查找表中使用的颜色数量。可以选择以下减低颜色深度算法之一:

可感知 创建一个自定义颜色表,将人眼感知比较灵敏的颜色放入其中。

可选择 创建一个与“可感知”颜色表类似的颜色表,它支持的颜色范围更大且可以保留 Web 颜色。此颜色表通常会生成具有最大颜色完整性的图像。“可选择”是默认选项。

随样性 创建一个自定义颜色表,将从图像主要色谱中提取出的色样放入其中。例如,只包含绿色和蓝色的图像产生主要由绿色和蓝色构成的颜色表。大多数图像的颜色集中在色谱的特定区域。

限制 (Web) 使用 Windows 和 Mac OS 8 位(256 色)调板通用的标准 216 色颜色表。该选项确保当使用 8 位颜色显示图像时,不会对颜色应用浏览器仿色。(该调板也称为 Web 安全调板。) 使用 Web 调板可能会创建较大的文件,因此,只有当避免浏览器仿色是优先考虑的因素时,才建议使用该选项。

自定义 使用用户创建或修改的调色板。如果打开现有的 GIF 或 PNG-8 文件,它将具有自定调色板。

使用“存储为 Web 和设备所用格式”对话框中的“颜色表”调板可自定颜色查找表。

黑白、灰度、Mac OS、Windows 使用一组调色板。

仿色方法和仿色

确定应用程序仿色的方法和数量。“仿色”是指模拟计算机的颜色显示系统中未提供的颜色的方法。较高的仿色百分比使图像中出现更多的颜色和更多的细节,但同时也会增大文件大小。为了获得最佳压缩比,请使用可提供所需颜色细节的最低百分比的仿色。若图像所包含的颜色主要是纯色,则在不应用仿色时通常也能正常显示。包含连续色调(尤其是颜色渐变)的图像,可能需要仿色以防止出现颜色条带现象。

带有 0% 仿色的 GIF 图像(左图)和带有 100% 仿色的 GIF 图像(右图)

可以选择以下几种仿色方法之一:

扩散 应用的随机图案通常不如“图案”仿色那么明显。仿色效果会在相邻像素间扩散。

图案 使用类似半调的方形图案模拟颜色表中没有的颜色。

杂色 应用与“扩散”仿色方法相似的随机图案,但不在相邻像素间扩散图案。使用“杂色”仿色方法时不会出现接缝。

透明度和杂边

确定如何优化图像中的透明像素。

  • 要使完全透明的像素透明并将部分透明的像素与一种颜色相混合,请选择“透明度”,然后选择一种杂边颜色。

  • 要使用一种颜色填充完全透明的像素并将部分透明的像素与同一种颜色相混合,请选择一种杂边颜色,然后取消选择“透明度”。

  • 要选择杂边颜色,请单击“杂边”色板,然后在拾色器中选择一种颜色。或者,从“杂边”菜单中选择一个选项: “吸管颜色”(使用吸管样本框中的颜色)、“前景色”、“背景色”、“白色”、“黑色”或“其他”(使用拾色器)。

只有 Photoshop 有“前景色”和“背景色”选项。

透明度和杂边示例:

A. 原始图像 B. 选择透明度并选择一种杂边颜色 C. 选择透明度并选择不带杂边颜色 D. 取消选择透明度并选择一种杂边颜色

透明度仿色

选择“透明度”选项后,可以选取对部分透明的像素应用仿色的方法:

  • “无透明度仿色”不对图像中部分透明的像素应用仿色。

  • “扩散透明度仿色”应用的随机图案通常没有“图案”仿色那么明显。仿色效果会在相邻像素间扩散。如果选择此算法,请指定“仿色”百分比以控制应用于图像的仿色量。

  • “图案透明度仿色”对部分透明的像素应用类似半调的方块图案。

  • “杂色透明度仿色”应用与“扩散”算法相似的随机图案,但不在相邻像素间扩散图案。使用“杂色”算法时不会出现接缝。

“图案透明度”仿色(左)和 Web 页背景所应用仿色(右)的示例

交错

当完整图像文件正在下载时,在浏览器中显示图像的低分辨率版本。交错可使下载时间感觉更短,并使浏览者确信正在进行下载。但是,交错也会增加文件大小。

Web 靠色

指定将颜色转换为最接近的 Web 调板等效颜色的容差级别(并防止颜色在浏览器中进行仿色)。值越大,转换的颜色越多。

优化 GIF 和 PNG 图像中的透明度

利用透明度可以创建适用于 Web 的非矩形图像。 背景透明度可保留图像中的透明像素。

这样,网页的背景可以通过图像的透明区域显示出来。 背景杂边通过用和网页背景匹配的杂边颜色填充或混合透明像素来模拟透明度。如果网页背景是纯色并且如果您知道是哪种颜色,则背景杂边效果最佳。

使用 “存储为 Web 和设备所用格式”对话框中的“透明度”和“杂边”选项可指定如何优化 GIF 和 PNG 图像中的透明像素。

  • (GIF 和 PNG-8)要使完全透明的像素透明并将部分透明的像素与一种颜色相混合,请选择“透明度”,然后选择一种杂边颜色。
  • 要使用一种颜色填充完全透明的像素并将部分透明的像素与同一种颜色相混合,请选择一种杂边颜色,然后取消选择“透明度”。
  • (GIF 和 PNG-8)要使所有透明度大于 50% 的像素完全透明,并且所有透明度等于或小于 50% 的像素完全不透明,请选择“透明度”,然后从“杂边”菜单中选择“无”。
  • (PNG-24) 要存储具有多级别透明度的图像(可高达 256 级),请选择“透明度”。由于多级别透明度允许图像与任何背景色相混合,因此将停用“杂边”选项。

在不支持 PNG-24 透明度的浏览器中,可以针对默认背景色(如灰色)显示透明像素。

要选择杂边颜色,请单击“杂边”色板,然后在拾色器中选择一种颜色。或者,从“杂边”菜单中选择一个选项: “吸管颜色”(使用吸管样本框中的颜色)、“前景色”、“背景色”、“白色”、“黑色”或“其他”(使用拾色器)。

只有 Photoshop 有“前景色”和“背景色”选项。

查看优化切片的颜色表

切片的颜色表显示在“存储为 Web 和设备所用格式”对话框的“颜色表”面板中。

选择以 GIF 或 PNG-8 格式优化的切片。所选切片的颜色表显示在“存储为 Web 和设备所用格式”颜色表中。

如果图像有多个切片,颜色表中的颜色可能会因切片而异(可以先链接这些切片以防发生这种情况)。如果选择多个使用不同颜色表的切片,则颜色表是空的,并且其状态栏显示消息“混合”。

 为 GIF 和 PNG-8 图像自定义颜色表。

可使用“存储为 Web 和设备所用格式”对话框中的颜色表对优化的 GIF 和 PNG-8 图像中的颜色进行自定义。减少颜色数量通常可以减小图像的文件大小,同时保持图像品质。

可以在颜色表中添加和删除颜色,将所选颜色转换为 Web 安全颜色,并锁定所选颜色以防从调板中删除它们。

对颜色表进行排序

从 “颜色表”调板菜单中选择一种排序顺序:

  • “未排序”将恢复原始排序顺序。
  • “按色相排序”将按颜色在标准色轮上(表示为 0 到 360 度)的位置进行排序。中性色的色相被指定为 0,且与红色在一起。
  • “按亮度排序”将按颜色的明度或亮度进行排序。
  • “按普及度排序”将按颜色在图像中出现的频率进行排序。

在颜色表中添加新颜色

可以添加在构建颜色表时遗漏的颜色。将颜色添加到动态表中将替换调板中与新颜色最接近的颜色。将颜色添加到固定或自定表中将向调板添加其他颜色。

  1. 如果当前在颜色表中选择了任一颜色,则选择 “颜色表”调板菜单中的“取消选择所有颜色”以取消对它们的选择。

  2. 请执行以下任一操作来选取颜色:

    • 单击 “存储为 Web 和设备所用格式”对话框中的“吸管颜色”框,然后从拾色器中选择一种颜色。

    • 在“存储为 Web 和设备所用格式”对话框中选择吸管工具,然后在图像中单击。

  3. 请执行下列操作之一:

    • 单击颜色表中的“新建颜色”选项 。

    • 从“颜色表”调板菜单中选择“新建颜色”。

    • 要将颜色表切换到“自定”调板,请在添加新颜色时按住 Ctrl 键 (Windows) 或 Command 键 (Mac OS)。

      新颜色将出现在颜色表中,其右下角有一个小白色方块,表示颜色被锁定。如果颜色表为动态的,则原稿颜色显示在左上角,新颜色显示在右下角。

选择颜色表中的颜色

在 颜色表中选定颜色周围会出现一个白框。

  • 要选择某种颜色,请在颜色表中单击该颜色。
  • 要在颜色表中选择多种颜色,请按 Shift 键并点按另一种颜色。第一次和第二次选中颜色之间的行中的所有颜色都被选中。要选择不相邻的一组颜色,请按 Ctrl 键 (Windows) 或 Command 键 (Mac OS) 并单击要选择的每种颜色。 “颜色表”调板菜单也提供了用于选择颜色的命令。
  • 要在预览图像中选择颜色,请使用“存储为 Web 和设备所用格式”吸管工具在预览中单击。按住 Shift 键并单击可选择其他颜色。
  • 要取消选择所有颜色,请从“颜色表”调板菜单中选择“取消选择所有颜色”。

转换颜色

可以将颜色表中的所选颜色更改为任何其他 RGB 颜色值。当重新生成优化图像时,不管出现在图像的什么地方,选中的颜色都更改为新颜色。

  1. 点按两次颜色表中的颜色以显示默认拾色器。

  2. 选择颜色。

    原稿颜色出现在色板的左上角,新颜色出现在右下角。色板右下角的小方块表示颜色被锁定。如果转换为 Web 安全颜色,色板中心将出现一个小白色菱形。

  3. 要将转换的颜色恢复为其原始颜色,请执行以下操作之一:

    • 点按两次转换了颜色的色板。拾色器中即选中原稿颜色。单击“确定”按钮以恢复颜色。

    • 要恢复颜色表中所有转换的颜色(包括进行 Web 转换的颜色),请从 “颜色表”调板菜单中选择“不改变任何颜色”。

将颜色转换为最接近的 Web 调板等效颜色

要防止颜色在浏览器中进行仿色,可将颜色转换为 Web 调板中最接近的等效颜色。这样就确保了当在只能显示 256 种颜色的 Windows 或 Macintosh 操作系统上的浏览器中显示时,颜色不会仿色。

  1. 在优化图像或颜色表中选择一种或多种颜色。

  2. 请执行下列操作之一:

    • 单击“颜色表”调板中的“Web 转换”按钮 。

    • 从“颜色表”调板菜单中选择“将选中颜色转换到 Web 调板/从 Web 调板转换回原来的颜色”。原始颜色显示在色板的左上角,而新颜色显示在右下角。色板中心的小白色菱形 表示颜色为 Web 安全颜色;色板右下角的小方块表示颜色被锁定。

  3. 要设置转换容差,请输入“Web 靠色”值。值越大,转换的颜色越多。

  4. 要恢复进行 Web 转换的颜色,请执行以下操作之一:

    • 在颜色表中选择进行 Web 转换的颜色,然后单击“颜色表”调板中的“Web 转换”按钮 。

    • 要恢复颜色表中所有进行 Web 转换的颜色,请从“颜色表”调板菜单中选取“不改变任何颜色”。

将颜色映射到透明度

通过将现有颜色映射至透明,可以在优化图像中添加透明度。

  1. 在优化图像或颜色表中选择一种或多种颜色。

  2. 请执行下列操作之一:

    • 单击“颜色表”调板中的“映射透明度”按钮

    • 从“颜色表”调板菜单中选取“将选中的颜色映射/取消映射为透明”。

      每种映射颜色的一半位置将出现一个透明度网格 。色板右下角的小方块表示颜色被锁定。

  3. 要将透明度恢复为原始颜色,请执行以下操作之一:

    • 选择要恢复的颜色,然后单击“映射透明度”按钮 ,或者从“颜色表”调板菜单中选择“将选中的颜色映射为透明/从透明取消映射选中的颜色”。

    • 要恢复所有映射为透明的颜色,请选择“取消映射所有透明颜色”。

锁定或解锁颜色

可以在颜色表中锁定所选颜色,防止它们在颜色数量减少时被删除和在应用程序中仿色。

锁定颜色不能防止它们在浏览器中仿色。

  1. 选择颜色表中的一种或多种颜色。

  2. 请执行以下任一操作来锁定颜色:

    • 单击“锁定”按钮

    • 从“颜色表”调板菜单中选择“锁定/解锁选中颜色”。

    每种锁定颜色的右下角将出现一个白色方块

  3. 请执行以下任一操作来解锁颜色:

    • 单击“锁定”按钮

    • 从“颜色表”调板菜单中选择“锁定/解锁选中颜色”。

    白色方块从色板上消失。

删除所选的颜色

可以从颜色表中删除所选颜色以减小图像文件大小。删除某种颜色时,将使用调板中剩下的最接近颜色来重新显示以前包含该颜色的优化图像区域。

当删除颜色时,颜色表自动更改为“自定”调板。这是因为当重新优化图像时,“随样性”、“可感知”和“可选择”调板会自动将删除的颜色添加回调板 -- 在重新优化图像时,“自定”调板不会变化。

  1. 选择颜色表中的一种或多种颜色。

  2. 请执行以下任一操作来删除颜色:

    • 单击“删除”图标

    • 从“颜色表”调板菜单中选择“删除颜色”。

存储颜色表

可以存储优化图像中的颜色表,用于其他图像和载入在其他应用程序中创建的颜色表。将新的颜色表载入图像后,优化图像中的颜色会更改以反映新颜色表中的颜色。

  1. 选择“存储 “颜色表”调板菜单中选择“存储颜色表”。

  2. 为颜色表命名并选取存储它的位置。默认情况下,为颜色表文件提供 .act 扩展名(对于 Adobe 颜色表)。

    如果要在为 GIF 或 PNG 图像选择“优化”选项时访问颜色表,请将颜色表存储在 Photoshop 应用程序文件夹内的 Optimized Colors 文件夹中。

  3. 单击“保存”。

    当重新载入该表时,所有转换的颜色都显示为全色板,并且它们都将被解锁。

载入颜色表

  1. 从“颜色表”调板菜单中选择“载入 颜色表”。

  2. 导航到包含要载入的颜色表的文件 — Adobe 颜色表 (.act) 文件、Adobe 色板 (.aco) 文件或 GIF 文件(以载入该文件的嵌入颜色表)。

  3. 单击“打开”。

PNG-24 优化选项

PNG-24 适合于压缩连续色调图像;但它所生成的文件比 JPEG 格式生成的文件要大得多。使用 PNG-24 的优点在于可在图像中保留多达 256 个透明度级别。

透明度和杂边

确定如何优化图像中的透明像素。

交错

当完整图像文件正在下载时,在浏览器中显示图像的低分辨率版本。交错可使下载时间感觉更短,并使浏览者确信正在进行下载。但是,交错也会增加文件大小。

更快、更轻松地获得帮助

新用户?