jpg、png、gif图片格式的浅析

原文地址：图片格式与设计那点事儿

以前面试时被面试官问到了jpg、gif、png格式的区别，当时就扯了一些，感受都是扯淡，上网搜了下，分享一篇文章

 

第一次写技术博客，有不尽如人意的地方，还请见谅和指正。

为何想整理这方面的类容，我以为就像油画家要了解他的颜料和画布、雕塑家要了解他的石材同样，做为网页设计师也应该对图片格式的特性有必定了解，这样才能更好的表达你的创意和想法。

除此以外，咱们在平时工做中也会遇到许多与图片格式相关的问题。好比设计师会奇怪为何有些页面的产出物老是无法达到设计稿那样的品质和效果，什么样的设计才更适合Web页面；页面重构师和前端工程师则想知道在切图的时候应采用什么图片格式、如何进行参数设置才能达到品质和性能的最优化。

有时候咱们可能会由于一张格式不正确的图片而致使设计品质的降低以及页面性能的下降。了解图片格式的特性就是为解答这些困惑从而让咱们设计的产品更好、更快。

本文主要包括如下几方面内容：

         一、基本概念

1. • 矢量图与位图
   • 有损压缩与无损压缩

         二、实际应用

1. • 何时应该使用PNG
   • 何时应该使用JPG
   • 总结

        三、思考与实践四、附录-Photoshop中各类参数的含义及设置技巧

1. • 什么样的设计更适合Web页面？
   • 咱们还能够作些什么？

一、基本概念

要了解图片格式的特性，首先得从一些基本概念开始。这部份内容读起来可能会比较枯燥，但若是你耐着性子读完它，相信会获益匪浅。

 

矢量图与位图

矢量图-完美的几何图形

矢量图是经过组成图形的一些基本元素，如点、线、面，边框，填充色等信息经过计算的方式来显示图形的。就比如咱们在几何学里面描述一个圆能够经过它的圆心位置和半径来描述，固然还能够经过边框的粗细、颜色以及填充的颜色等数据去描述它的样式。而电脑在显示的时候则经过这些数据去绘制出咱们定义的图像。

矢量图的优势在于文件相对较小，而且放大缩小不会失真。缺点则是这些完美的几何图形很难表现天然度高的写实图像。

须要强调说明的是咱们在web页面上所使用的图像都是位图，即使有些称为矢量图形（如矢量icon等）也是指经过矢量工具进行绘制而后再转成位图格式在web上使用的（区别于像素绘制的图形）。

位图-神奇的拼图

位图又叫像素图或栅格图，它是经过记录图像中每个点的颜色、深度、透明度等信息来存储和显示图像。一张位图就比如一幅大的拼图，只不过每一个拼块都是一个纯色的像素点，当咱们把这些不一样颜色的像素点按照必定规律排列在一块儿的时候，就造成了咱们所看到的图像。因此当咱们放大一幅像素图时，能看到这些拼片同样的像素点（以下图）。

位图的优势是利于显示色彩层次丰富的写实图像。缺点则是文件大小较大，放大和缩小图像会失真。

尽管咱们在web页面中所使用的JPG、PNG、GIF格式的图像都是位图，即他们都是经过记录像素点的数据来保存和显示图像，但这些不一样格式的图像在记录这些数据时的方式却不同，这就是涉及到有损压缩和无损压缩的区别。

有损压缩与无损压缩

有损压缩-你看到的不必定是真实的

按照个人理解有损压缩就是在存储图像的时候并不彻底真实的记录图像上每一个像素点的数据信息，它会根据人眼观察现实世界的特性（人眼对光线的敏感度比对颜色的敏感度要高，生物实验证实当颜色缺失时人脑会利用与附近最接近的颜色来自动填补缺失的颜色）对图像数据进行处理，去掉那些图像上会被人眼忽略的细节，而后使用附近的颜色经过渐变或其余形式进行填充。这样既能大大下降图像信息的数据量，又不会影响图像的还原效果。

JPG是咱们最多见的采用有损压缩对图像信息进行处理的图片格式。JPG在存储图像时会把图像分解成8*8像素的栅格（如上图），而后对每一个栅格的数据进行压缩处理，当咱们放大一幅图像的时候，就会发现这些8*8像素栅格中不少细节信息被去除，而经过一些特殊算法用附近的颜色进行填充（为了让你们看得更清楚我将图像的压缩比率调到很低）。这也是为何咱们用JPG存储图像有时会产生块状模糊的缘由。

无损压缩-最精确的拼图

相对有损压缩而言无损压缩则会真实的记录图像上每一个像素点的数据信息，但为了压缩图像文件的大小会采起一些特殊的算法。无损压缩的压缩原理是先判断图像上哪些区域的颜色是相同的，哪些是不一样的，而后把这些相同的数据信息进行压缩记录，（例如一片蓝色的天空之须要记录起点和终点的位置就能够了），而把不一样的数据另外保存（例如天空上的白云和渐变等数据）。

PNG是咱们最多见的一种采用无损压缩的图片格式。无损压缩在存储图像前会先判断图像上哪些地方是相同的哪些地方是不一样的，为此须要对图像上全部出现的颜色进行索引（如上图），咱们把称这些颜色称为索引色。索引色就比如绘制这幅图像的“调色版”，PNG在显示图像的时候则会用“调色版”上的这些颜色去填充相应的位置。

这里你们可能会疑惑既然PNG采用的是无损压缩为何咱们保存的PNG格式图片还会有失真呢？这是由于无损压缩只是说它的压缩方式会尽量真实的还原图像，但从它的压缩原理咱们能够知道它是经过索引图像上相同区域的颜色进行压缩和还原的，这就意味着只有在图像上出现的颜色数量小于咱们能够保存的颜色数量时，咱们才能真实的记录和还原图像，不然就会丢失一些图像信息（PNG8最多只能索引256种颜色，因此对于颜色较多的图像不能真实还原；PNG24则能够保存1600多万种颜色，基本可以真实还原咱们人类肉眼所能够分别的全部颜色；PNG格式最多能够保存48位颜色通道）。而对于有损压缩来讲，无论图像上的颜色多少，都会损失图像信息。

JPG和PNG

关于JPG和PNG的基本信息介绍这里就不赘述了，有兴趣详细了解的同窗能够去这里：
什么是JPG、什么是PNG。另外这里咱们也不对GIF进行讨论，是由于PNG就是为取代GIF而生的，并且PNG的压缩算法也要优于GIF，因此只要不是须要动画效果的地方强烈建议都采用PNG格式图片。

这里咱们不妨把JPG和PNG的一些特性进行一个简单对比：

格式	压缩模式	交错支持	透明支持	动画支持
JPG	有损压缩	支持	不支持	不支持
PNG	无损压缩	支持	支持	不支持

JPG的特性

1. 一、支持摄影图像或写实图像的高级压缩，而且可利用压缩比例控制图像文件大小。
2. 二、有损压缩会使图像数据质量降低，而且在编辑和从新保存JPG格式图像时，这种降低损失会累积。
3. 三、JPG不适用于所含颜色不多、具备大块颜色相近的区域或亮度差别十分明显的较简单的图片。

PNG的特性

1. 一、能在保证最不失真的状况下尽量压缩图像文件的大小。
2. 二、PNG用来存储灰度图像时，灰度图像的深度可多到16位，存储彩色图像时，彩色图像的深度可多到48位，而且还可存储多到16位的α通道数据。
3. 三、对于须要高保真的较复杂的图像，PNG虽然能无损压缩，但图片文件较大，不适合应用在Web页面上。

PNG8与PNG24

提到PNG格式就不得不提到PNG8和PNG24，这种叫法并不是官方定义，不过因为广泛使用已经被你们普遍接受了。经过前面的介绍咱们知道PNG采用无损压缩是经过索引色去存储和还原图像的，PNG8和PNG24后面的数字则是表明这种PNG格式最多能够索引和存储的颜色值。”8″表明2的8次方也就是256色，而24则表明2的24次方大概有1600多万色。

不只如此，PNG8还支持1位的布尔透明通道，所谓布尔透明指的是要么彻底透明要么彻底不透明。而PNG24则支持8位（256阶）的alpha通道透明，也就是说能够存储从彻底透明到彻底不透明一共256个层级的透明度（即所谓的半透明）。

格式	最高支持色彩通道	索引色编辑支持	透明支持
PNG8	256色	支持	支持布尔透明
PNG24	约1600万色	不支持	支持8位（256阶）alpha透明

可能经过以上特性的对比你们还不能很直观的理解在实际应用中到底因该选择什么格式的图片文件，咱们不妨结合上面的基本概念经过几个例子去给你们说明。

二、实际应用

何时应该使用PNG

示例1

下图是淘宝网最多见的一个图片即“马上购买”按钮，这里我尝试用JPG和PNG8格式分别进行保存，能够看到保存的结果有两个值得注意的地方：

1. 一、JPG保存的文件大小是PNG保存的文件大小的2倍
2. 二、JPG不只文件更大而且还出现了噪点（如图中红色方框标注的）

那么是什么缘由形成这样的差别呢？

首先咱们能够看出“马上购买”这个按钮是在photoshop中用矢量工具绘制出来的，其渐变填充是很是规则的线性渐变，文字颜色和描边等都是采用纯色，因此这个图像所包含的色彩信息很是有限。根据前面咱们介绍的无损压缩的特性，当用PNG存储这个图像时，只须要保存不多的色彩信息就能够真实还原这个图像。而对于JPG格式来讲大小主要决定于图像的颜色层次，因此在这种颜色较少但对比强烈的状况下，反而不能很好的压缩文件大小。

另外根据有损压缩的压缩算法JPG会在图像中经过渐变或其余方式填充一些被删除的数据信息来对图像进行压缩，图中红色和白色的地方因为色差较大，JPG在压缩过程当中就会填充一些额外杂色进去，反而影响的图像的质量。这也是为何JPG不利于存储大块颜色相近区域以及亮度差别十分明显的图像的缘由。

示例2

咱们再来看另一个应用场景，下图是在淘宝彩票页面使用的一个Banner图像。一样用PNG8和JPG进行了保存，能够发现当用PNG8保存时不只保证了图像的质量且图像文件的大小仅有8.3K，而当用JPG 100%保存时文件大小则增长到44.2K，若是不经放大可能还看不出具体的差别，但实际和前面同样也会出现没必要要的噪点。若是咱们要达到PNG8的压缩率采用JPG 45%进行保存，则图像会出现较严重的失真。

由此咱们能够得出结论，具有如下条件的图像更适合用PNG8格式进行存储：

1. 一、图像上颜色较少，而且主要以纯色或者平滑的渐变色进行填充。
2. 二、具有较大亮度差别以及强烈对比的简单图像（如“马上购买”按钮中的背景和文字）。

根据经验具有上述条件的图像通常是使用photoshop或其余软件中的矢量工具进行绘制而后再保存成位图的图像。

何时应该使用JPG

示例1

从JPG的特性介绍咱们知道JPG更适合用来存储摄影或写实图像，因此咱们不妨先拿一张摄影做品作尝试。

下图是一副巴士车的照片，咱们尝试用JPG 60%（左上）、PNG8 256色 无仿色（右上）、PNG8 256色 扩散仿色（左下）、PNG32（右下）分别进行了存储。能够看出当用JPG存储图像时不只可以达到最大的压缩率，也能尽可能保证原图的还原效果。而采用PNG8进行保存时图像文件大小更大，失真也较严重。只有在PNG24的格式下才能保证品质，然而文件大小却比JPG要大不少。

产生这种结果的缘由也与JPG和PNG各自的压缩算法有关。

对于摄影或者写实做品，因为受环境光线的影响，图像上的色彩层次十分丰富。好比巴士车上的红色区域因为反光、阴影以及透视效果会造成明暗、深浅各异的区域，若是用PNG去保存，则须要不一样明暗度的红色去存储这个区域。对于整张图片来讲，PNG8的256色没法彻底索引图像上出现的全部颜色，因而在存储时就会丢失许多颜色而产生失真。若是要保证图像的效果，则须要色彩范围更广的PNG24进行存储，相应的文件大小也会增长。

而JPG的压缩算法则更利于对真实世界中这些复杂的色彩变化进行压缩处理，从而在尽可能压缩文件大小的状况下比较好的还原图像的视觉效果。

示例2

那么是否是只有在存储照片的时候才须要用到JPG呢？咱们不妨来看另一个例子。

下图是最近比较火爆的某微博页面，在这里咱们能够选择不一样的风格，每种风格都会有一个很是有特点的背景图片。咱们尝试用不一样图片格式对背景进行保存时能够发现：当用JPG进行保存时（直接背景另存为）文件大小仅36.3K；而用PNG8 256色无仿色去保存时大小增长到57.7K，不只如此因为颜色的缺失在图像上还出现了一些带锯齿的色块；为了下降这些色块对图像质量的影响咱们对PNG8增长了扩散仿色的效果，此时文件大小达到了156.3K；而当采用PNG24彻底不失真的保存时文件大小是231.9K。

尽管这幅背景图也是经过photoshop制做，但咱们能够发现因为在图像上采用了不少的真实素材（好比白云、蚂蚁、绿叶等），而这些真实素材和摄影图像同样也会存在很是丰富的色彩层次，因此也不适合用PNG格式进行保存。这个时候咱们就应该采用JPG格式。

由此咱们能够得出结论：对于写实的摄影图像或是颜色层次很是丰富的图像采用JPG的图片格式保存通常能达到最佳的压缩效果。

根据经验咱们在页面中使用的商品图片、采用人像或者实物素材制做的广告Banner等图像更适合采用JPG的图片格式保存。

总结

因而可知在存储图像时采用JPG仍是PNG主要依据图像上的色彩层次和颜色数量进行选择。通常层次丰富颜色较多的图像采用JPG存储，而颜色简单对比强烈的则须要采用PNG。但也会有一些特殊状况，例若有些图像尽管色彩层次丰富，但因为图片尺寸较小，上面包含的颜色数量有限时，也能够尝试用PNG进行存储。而有些矢量工具绘制的图像因为采用较多的滤镜特效也会造成丰富的色彩层次，这个时候就须要采用JPG进行存储了。

另外还有一个原则就是用于页面结构的基本视觉元素，如容器的背景、按钮、导航的背景等应该尽可能用PNG格式进行存储，这样才能更好的保证设计品质。而其余一些内容元素，如广告Banner、商品图片等对质量要求不是特别苛刻的，则能够用JPG去进行存储从而下降文件大小。

三、思考与实践

什么样的设计更适合web页面？

慎用较“重”的视觉设计元素

Web2.0时代网页设计的一大趋势就是愈来愈“轻”。除了对那些高光和圆角效果的审美疲劳以外，设计师们也开始意识到好的设计应该是内容与形式的完美结合，而非形式的堆砌。因此设计师在应用那些较“重”的视觉效果时，必定要想清楚这样作的目的和意义，以及是否与产品的特色和受众的气质相契合。

“轻量“设计一个比较典型的例子就是国内某知名网站，几乎没有采用任何须要图片的视觉元素，而是经过简单的CSS样式去实现，这样不只可以突出内容，更能提高页面的访问速度。因此我十分强烈的建议视觉设计师也掌握必定的html和css知识（尤为是CSS3实现了不少过去须要图片才能实现的效果，例如圆角和渐变），这样在作设计的时候可以全面的去考虑产品效果。

下面这个电子商务网站则采用过多无心义的视觉元素堆砌，不只没有实现很好的设计效果，反而因为须要太多的图片元素而影响了页面的性能。

若是因为产品须要在设计中不得不使用较”重“的视觉元素，咱们也能够根据图片格式的特色选择适当的表现形式以达到更好的效果。

例如在下面这个例子中，第一个Banner应用了更适合PNG格式的设计风格（较多纯色和简单渐变的应用）不只能达到热烈、突出的视觉效果，在保证图片质量的同时也更好的压缩了文件大小；而第二个Banner因为应用了过于复杂的渐变色和强烈对比，而且在局部区域采用太多的高光和阴影效果，致使图片的色彩层次过多，不论采用PNG仍是JPG格式保存都没法实现图像质量和文件大小的最优化。

固然举这个例子并非要设计师在作设计的时候过度考虑页面性能问题，而是要清楚不一样设计形式的效果和实现成本，在设计过程当中多问本身为何要这样作？

内容和形式的分离

对于一些比较强调视觉效果的特殊产品，好比活动推广页面或Mini Site。咱们也能够利用图片格式和一些前端知识对设计进行优化，比较经常使用的一种设计方法就是内容和形式的分离。

以下面一些国外比较流行的设计风格，以及前面提到的微博网站，都是经过大幅的背景图去进行意境的传达和睦氛的渲染。这样作的一个好处就是能把须要用到图片的视觉元素进行集中的压缩优化，同时又不会因为加载太慢而影响用户的访问速度（前端实现时通常会用相近的背景色先进行填充，而后在逐步显示背景图）。

我的认为好的视觉设计最重要是意境传达和睦氛渲染，使用高光、阴影等滤镜效果的目的也仅仅是为了达到质感上的统一从而更好的去传达意境和渲染气氛，因此切忌为了质感而质感。即使是为了体现设计品质也不必定非要使用炫丽的滤镜，相较而言优美的布局和精巧的结构才是体现品质的关键！

经过较小的视觉牺牲换取较大的性能提高

有时候为了提高页面的加载速度达到更好的用户体验，不得不对设计进行优化。这个时候利用咱们对图片格式知识掌握就能够更有目的性的去进行优化。

例以下图是淘宝“双十一”大促活动的一个页头设计，因为页面访问量很是大而且要使用较多的商品图片，不得不对页头设计进行优化以提高性能。这个时候咱们就能够去掉一些不过重要的高光、渐变和阴影效果，从而大大下降文件大小。

咱们还能够作些什么？

Sprite图片二次优化

因为目前国内不少互联网公司没有页面重构师这一职位，因此页面切图和静态代码实现基本都是前端工程师去完成。为提升页面性能目前广泛采用的实现方式是将与页面结构相关的须要用到图片的视觉元素集中在一个PNG图片上，而后经过CSS样式将其应用到页面中，咱们称这个图片为Sprite图片。因为这个图片上常常要集中较多的视觉元素，在用PNG格式存储时不免会产生失真而影响图片质量。这个时候就须要视觉设计师帮助前端开发工程师对Sprite图片进行优化，这样作的好处是不只能提高图片质量，还能达到减少文件大小的效果，可谓一箭双雕。

下图是一个优化前的Sprite图片，因为视觉元素过多PNG8没法真实保存全部的颜色信息，因而便会产生颜色的缺失和杂色的产生（如局部放大图所示）。

在前端工程师完成页面的静态代码以后，视觉设计师能够将定位好的Sprite图片进行像素级的优化，去掉没必要要的杂色，而且用已存在的索引色对缺失的地方进行补充，这样不只能压缩文件大小，还能提高设计品质。

Sprite图片的优化方式有不少种，好比经过索引色排序进行颜色的删减和替换，或是直接经过像素描绘进行优化。设计师能够根据具体的场景进行选择和处理。

以上设计和优化的方法只是我在工做中一些经验的积累和总结，我的感受每个点展开来都有不少值得研究和讨论的地方，限于篇幅有限不能继续深刻。关于图片优化的高级技巧有两篇比较经典的文章推荐给你们：Clever PNG Optimization Techniques、Clever JPEG Optimization Techniques。

四、附录-Photoshop中各类参数的含义及设置技巧

PNG8的参数设置

减低颜色深度算法与颜色

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

1. 一、可感知：经过为人眼比较灵敏的颜色赋以优先权来建立自定颜色表。
2. 二、可选择：建立一个颜色表，此表与”可感知”颜色表相似，但对大范围的颜色区域和保留 Web 颜色有利。此颜色表一般会生成具备最大颜色完整性的图像。“可选择”是默认选项。
3. 三、随样性：经过从图像的主要色谱中提取色样来建立自定颜色表。例如，只包含绿色和蓝色的图像产生主要由绿色和蓝色构成的颜色表。大多数图像的颜色集中在色谱的特定区域。
4. 四、受限 (Web)：使用 Windows 和 Mac OS 8 位（256 色）调板通用的标准 216 色颜色表。该选项确保当使用 8 位颜色显示图像时，不会对颜色应用浏览器仿色。（该调板也称为 Web 安全调板。） 使用 Web 调板可能会建立较大的文件，所以，只有当避免浏览器仿色是优先考虑的因素时，才建议使用该选项。
5. 五、自定：使用用户建立或修改的调色板。若是打开现有的 GIF 或 PNG-8 文件，它将具备自定调色板。使用”存储为 Web 和设备所用格式”对话框中的”颜色表”调板可自定颜色查找表。
6. 六、黑白、灰度、Mac OS、Windows使用一组调色板。

建议：通常状况下默认选择“可选择”项便可。

仿色方法和仿色

肯定应用程序仿色的方法和数量。”仿色”是指模拟计算机的颜色显示系统中未提供的颜色的方法。

较高的仿色百分比使图像中出现更多的颜色和更多的细节，但同时也会增大文件大小。为了得到最佳压缩比，请使用可提供所需颜色细节的最低百分比的仿色。

若图像所包含的颜色主要是纯色，则在不该用仿色时一般也能正常显示。包含连续色调（尤为是颜色渐变）的图像，可能须要仿色以防止出现颜色条带现象。

能够选择如下几种仿色方法之一：

1. 一、扩散：应用与”图案”仿色相比一般不太明显的随机图案。仿色效果在相邻像素间扩散。
2. 二、图案：使用相似半调的方形图案模拟颜色表中没有的任何颜色。
3. 三、杂色：应用与”扩散”仿色方法类似的随机图案，但不在相邻像素间扩散图案。使用”杂色”仿色方法时不会出现接缝。

建议：通常只在图片颜色过多产生失真的状况下才须要选择仿色。建议选择扩散仿色，能够适当调节仿色的百分比以达到最佳的效果。仿色度越高文件大小也越大。

透明度和杂边

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

1. 一、要使彻底透明的像素透明并将部分透明的像素与一种颜色相混合，请选择”透明度”，而后选择一种杂边颜色。
2. 二、要使用一种颜色填充彻底透明的像素并将部分透明的像素与同一种颜色相混合，请选择一种杂边颜色，而后取消选择”透明度”。
3. 三、要选择杂边颜色，请单击”杂边”色板，而后在拾色器中选择一种颜色。或者，也能够从”杂边”菜单中选择一个选项：”吸管”（使用吸管样本框中的颜色）、”前景色”、”背景色”、”白色”、”黑色”或”其它”（使用拾色器）。

建议：强烈建议由视觉设计师根据实际应用场景在保存以前就处理好透明图像的背景。

交错

PNG、GIF这两种图像格式都提供了一种功能，让图像可以更快地显示。图像能够以一种特殊方式存储，显示时先大概显示图像的草图，当文件所有下载后再填充细节。这起到一种颇有意义的心理效果，由于这样令人们有东西可看，而没必要坐着干等大型图像慢慢显示在屏幕上。

建议：对于尺寸和文件大小相对较大的图片建议勾选此项。

JPG的参数设置

品质

从”品质级别”菜单中选取一个选项，或者在”品质”文本框中指定一个值。”品质”设置越高，压缩算法保留的细节越多。可是，使用高”品质”设置比使用低”品质”设置生成的文件大。查看几种品质设置下的优化图像，肯定品质和文件大小之间的最佳平衡点。

品质设置技巧

1. 一、不要存100%品质的JPG格式图片。由于100%并不必定是最高的品质，而是一个优化算法的极限值，因此会增长没必要要的文件大小。建议存储95%品质的图片就能够最大限度的下降失真。
2. 二、谨慎使用50%品质如下的压缩率。使用50%如下品质存储时会采用额外的压缩算法而致使图片失真更严重，尤为是对于有高对比度的图片。

优化

选择”优化”建立文件大小稍小的加强型 JPEG。建议使用”优化 JPEG”格式以得到最大文件压缩量；可是，一些较旧的浏览器不支持此特性。

建议：建议勾选此项，目前基本已经不存在不支持改功能的浏览器。

连续

选择”连续”建立在 Web 浏览器中连续显示的图像。图像将显示为一系列的叠加，使查看者在整个图像下载完毕以前，可以看到图像的低分辨率版本。连续 JPEG 须要更多的内存用于查看，一些浏览器不支持该选项。

建议：勾选此项在某些状况下可压缩文件大小（图片大小大于10k时），某些状况下会增大文件大小，建议在保存是根据实际状况决定。不过IE6及更早版本的IE浏览器不支持JPG连续显示，而是在图片彻底加载后一次成像，用户体验上可能还不如不使用连续的逐步成像要好，因此建议慎选此项。

模糊

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

ICC 配置文件

选择”ICC 配置文件”将图片的 ICC 配置文件与文件保留在一块儿。ICC 配置文件由某些浏览器用于色彩校订。（请参阅Photoshop中设置色彩管理。）

杂边

指定原稿图像中透明像素的填充色：点按”杂边”色板，而后在拾色器中选择一种颜色。从”杂边”菜单中选取选项。原稿图像中彻底透明的像素由选中的颜色填充，原稿图像中部分透明的像素与选中的颜色相混合。