11组件设计-网页元素的动态模拟-PS动态应用.ppt

一旦添加了大量的自定义更改 我们可以通过使用“双联”视图检查文件大小和质量的差异。 在面板中，提供了原稿优化的对比视图模式，方便我们进行检查，以得到最好的结果，操作如图所示： 可以看到，当我们把颜色数改成“64或128”的时候，优化图和原图效果的对比。 因为gif格式所限，它最大也只是支持8位颜色，最多只有256种颜色，还是太少了，所以“存储为web所用格式…”面板上提供了“仿色”的功能，简单理解就是通过模仿来实现更鲜艳的色彩方案。 官方解释则是指模拟计算机的颜色显示系统中未提供的颜色的方法。较高的仿色百分比使图像中出现更多的颜色和更多的细节，但同时也会增大文件大小。为了获得最佳压缩比，尽量使用可提供所需颜色细节的最低百分比的仿色。若图像所包含的颜色主要是纯色，则在不应用仿色时通常也能正常显示。 包含连续色调(尤其是颜色渐变)的图像，可能需要仿色以防止出现颜色条带现象。 常用的是默认“扩散”或“无仿色” 如图所示，仿色有三种方法： 01、扩散：应用与“图案”仿色相比通常不太明显的随机图案。仿色效果在相邻像素间扩散。 02、图案：使用类似半调的方形图案模拟颜色表中没有的任何颜色。 03、杂色：应用与“扩散”仿色方法相似的随机图案，但不在相邻像素间扩散图案。使用“杂色”仿色方法时不会出现接缝。 色彩损耗量 通过有损压缩 丢弃可视信息，从而可以减小文件的大小。 通过 调整的色彩损耗量 也可以调整GIF文件的大小， 我们将损耗调到13时，GIF文件大小变成了302K。 透明度和杂边 是用来确定如何优化图像中的透明像素。大部分情况下都使用默认设置即可； 该功能是用来确定如何优化图像中的透明像素。大部分情况下都使用默认设置即可； 如果需要进一步设置，可以参考如文本中的官方文档解释：这里不做过多讲解，可作为扩展知识了解即可。 01.要使完全透明的像素透明并将部分透明的像素与一种颜色相混合，请选择“透明度”，然后选择一种杂边颜色。 02.要使用一种颜色填充完全透明的像素并将部分透明的像素与同一种颜色相混合，请选择一种杂边颜色，然后取消选择“透明度”。 03.要选择杂边颜色，请单击“杂边”色板，然后在拾色器中选择一种颜色。或者，从“杂边”菜单中选择一个选项：“吸管颜色”(使用吸管样本框中的颜色)、“前景色”、“背景色”、“白色”、“黑色”或“其它”(使用拾色器)。 当透明度仿色选择“透明度”选项后，如图所示：可以选取对部分透明的像素应用仿色的方法： 01、“无透明度仿色”不对图像中部分透明的像素应用仿色。 02、“扩散透明度仿色”应用的随机图案通常没有“图案”仿色那么明显。仿色效果在相邻像素间扩散。如果选择此算法，请指定“仿色”百分比以控制应用于图像的仿色量。 03、“图案透明度仿色”对部分透明的像素应用类似半调的方块图案。 04、“杂色透明度仿色”应用与“扩散”算法相似的随机图案，但不在相邻像素间扩散图案。使用“杂色”算法时不会出现接缝。 前面我们都需要手动调参数，对比效果，反复的调整修改，以求达到最好的效果， 而优化菜单项的“优化文件大小”，会自动帮我们平衡各项参数，然后在我们设置的文件大小内，算出最优的结果。 设置好后，在浏览器中“预览”选项看最终GIF效果，也可以将设置保存为预设，作为参数模版供后续使用。 以上 我们讲解了web交互设计中Ps动态元素的几种优化方法，可以帮助我们在文件大小和效果之间取得一种平衡，搭配出合适的性价比；本次课我们就讲到这里，祝大家学习顺利 * 保存为网页格式是一项平衡选择——你必须在图片品质和介质的文件尺寸之间做好平衡，以便满足原型设计及平台的需求。 在速度相对重要的地方（如快速地加载网站），你可能需要牺牲一些图片品质。而在品质重要的地方，则需要牺牲一点速度。 本节课程的目的就是介绍一些方法，在这两个因素之间寻求平衡，与此同时保留尽可能高的图像品质；并教给你关于“存储为web所用格式”你需要知道的知识。 * 虽然存在有非常多的图片格式（仅举几例，如jpeg，gif和png），但是依据压缩方法不同，所有的图片都能进一步归类为两大类别：无损和有损。 无损数据压缩保证了图像在没有任何品质和信息丢失的情况下重现，而有损数据压缩的结果就是可能造成品质和信息的丢失。 在设计领域主流的无损媒介格式包括GIF，PNG，以及TIFF，而JPEG是最主流的有损压缩的图形格式。 * 由于图片巨大的文件体积，它们更多是以有损压缩格式来保存的。甚至在拍照时，相对于数倍大小的RAW格式，相机也倾向于用有损格式（如JPEG）来保存图片。 JPEG是日常中首选的图片格式，它是以它的创造者“联合图像专家小组”来命名的。Jpeg之所以能够成为标准，是因为它在压缩图像数据的同时可以保