通过本主题可了解在photoshop、Animate等adobe软件中导出图像和动画 GIF时可以使用的各种选项。

Web 图形格式

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


(资料图片)

一、JPEG 优化选项

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

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

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

2. 优化后:创建文件大小稍小的增强 JPEG。要最大限度地压缩文件,建议使用优化的 JPEG 格式;但是,某些旧版浏览器不支持此功能。3. 渐进:在 Web 浏览器中以渐进方式显示图像。图像将显示为一系列叠加图形,从而使浏览者能够在图像完全下载前查看它的低分辨率版本。“渐进”选项要求使用 优化后的 JPEG 格式。

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

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

5. 配置文件:嵌入颜色配置文件 (Photoshop) 或 ICC 配置文件 (Illustrator)  。         

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

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

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

二、GIF 和 PNG-8 优化选项

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

2.透明度和杂边 :确定如何优化图像中的透明像素。

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

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

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

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

透明度和杂边示例:

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

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

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

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

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

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

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

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

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

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

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

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

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

(GIF 和 PNG-8)要使所有透明度大于 50% 的像素完全透明,并且所有透明度等于或小于 50% 的像素完全不透明,请选择“透明度”,然后从“杂边”菜单中选择“无”。

(PNG-24) 要存储具有多级别透明度的图像(可高达 256 级),请选择“透明度”。由于多级别透明度允许图像与任何背景色相混合,因此将停用“杂边”选项。

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

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

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

推荐内容