敬业的IT人 >> 网站建设 >> 网页设计 >> Fireworks >> Fireworks 4.0 认证教程 第九章 图像的优化及输出

Fireworks 4.0 认证教程 第九章 图像的优化及输出

敬业的IT人互联网佚名 2008-1-10 11:10:46

　　【内容提要】

　　本章将介绍Fireworks关于优化和输出的基本操作　，讲解对常用图像格式的优化措施，以及图像的输出设置。同时要求掌握优化面板和调色板的各项操作，能够熟练的使用Fireworks 强大的图像优化功能对图片进行理想的优化处理。

　　主要内容：

　　1. 优化的基本操作

　　2. 对GIF、PNG、JPEG图像格式的优化设置

　　3. 优化调色板

　　4. 图像的输出

　　重点与难点：

　　优化面板的操作、对常用格式的优化措施、调色板的设置、图像输出

　　关键字：

　　优化面板、调色板、优化设置、输出

　　【本课内容】

　　在网络中，影响图片浏览速度的两大因素，一是颜色，二是像素，图像中的颜色品种和像素越多，图像效果越逼真　，同时图像文件的尺寸也越大。在目前的网络环境下，为了得到较好的图片质量保留原有的颜色像素，必然导致因文件体积过大使图像的下载速度的太慢，而要保证浏览速度，去减小文件的体积又可能影响图像的质量，导致图像的失真，这似乎是鱼和熊掌不可兼得的事情。

　　Fireworks为我们提供了一个绝好的折中方案，通过选择图像格式、任意调节图像的导出质量以及其他相应的设置，可以得到无论是图像质量还是图像尺寸都比较满意的图片来。本章将对Fireworks强大的图像优化功能做详细的讲解，从中你会发现Fireworks在网络图像处理上是一款多么优秀的软件。

　　9.1 优化的基本操作

　　在Fireworks中对图像的优化操作，有好几种方式，运用优化面板、颜色表面板或者在导出预览中都可以实现对图像的优化设置。下面将一一介绍。

　　9.1.1 优化面板

　　单击【Window】菜单中的【Optimize】命令，打开优化面板。如图：

　　优化面板上有几个下拉列表，包含了优化图像的若干选项，在设置过程中将逐渐了解它们的含义。

　　9.1.2 优化操作

　　单击优化面板上"Setting"项的小三角，打开下拉菜单，如图：

　　菜单中有六个选项，分别表示：

　　GIF Web 216 ：Gif格式，Web安全色，调色板最多包含216种颜色

　　GIF WebSnap 256 ：Gif格式，非Web安全色，调色板最多包含256种颜色

　　GIF WebSnap 128 converts ：Gif格式，转变为非Web安全色，调色板最多包含128种颜色

　　GIF Adaptive 256 ： Gif格式，调色板只包含图像中存在的颜色，调色板最多包含256种颜色

　　JPEG - Better Quality　：JPEG格式，设置为原图像质量的百分之八十，图像平滑度为0，图像质量较好，但体积大

　　JPEG - Smaller File ：JPEG格式，设置为原图像质量的百分之六十，图像平滑度为2，图像质量较差，但体积小于原图像的二分之一。

　　当图像颜色较少时，通常选择GIF WebSnap 128 作为典型设置，可以得到合适的图像质量和体积较小的图片。另外，解释一下Websafe colors: Web安全色是在苹果机和windows操作系统中通用的图像颜色，这些颜色在各种标准的Web浏览器中都不会失真。即采用这种颜色模式的图像，不用担心在浏览器中会走样。

　　9.1.3 保存自定义优化方案

　　1. 完成相关的优化设置

　　2. 单击优化面板上的保存按钮，

　　3. 在弹出的对话框中填入自定义方案名如："My Optimize"，点击"ok"。

　　完成操作，此时"Settings"的弹出菜单中会多出一项名为"My Optimize"的选项，如图：

　　9.1.4 删除自定义以及方案

　　1. 打开优化面板中的"Settings"的弹出菜单，选中要删除的选项。

　　2. 点击"Optiomize"面板上的删除按钮，即可完成删除操作

　　不能删除Fireworks默认的设置。

　　9.2 对常用格式的优化设置

　　在第五章（文本处理）中，已经对GIF、JPEG、PNG等常用格式做了详解，本节则直接进入对这些常用格式的优化设置中去，用实例进行讲解。

　　9.2.1 优化设置GIF格式

　　打开一幅256色的原始图像，打开优化面板中"Colors"下拉列表，选择颜色数目为"8" ，如图：

　　颜色数目改变后，可以看出图像的质量改变并不大，而图像尺寸减小了近两倍，差别很明显，见下图：

　　

　　优化面板上还有几个调节区域：

　　1. "Loss"：设置图像质量的损失程度。

　　2."Dither"：设置颜色抖动量，有效范围0～100％，抖动量越大，图像颜色于原始图像颜色越接近，图像尺寸也越大，否则反之。

　　3. 透明效果列表：

　　No Transparency：不透明

　　Index Transparency：索引透明，将图像中的一种或多种颜色映射为透明色，以形成透明效果

　　Alpha ：利用文档的Alpha通道形成透明效果。

　　4..指定其他透明色：

　　在优化面板上有三个用来指定透明颜色的按钮，点击它们以后，鼠标变成吸管状，再将鼠标移动到文档中选取颜色，按钮表示将选取颜色设为透明，增加透明颜色种类，取消该颜色的透明设置。

　　9.2.2 优化设置PNG格式

　　打开一幅PNG格式的原始图像，打开优化面板中格式下拉列表，选择"PNG8"，如图：

　　其他设置同前，（但PNG格式不能进行"loss"的设置）设置完后，在文档窗口的"2-UP"标签下，查看前后效果见下图：

　　9.2.3 优化设置JPEG格式

　　打开一幅JPEG格式的原始图像，在优化面板中的"setting"下拉菜单中选择"JPEG-Better Quality"，则优化面板作出相应的改变，变成JPEG格式的设置面板，如图：

　　在"Selective Quality"一栏中点击按钮会打开一个对话框，如图：

　　选中"Enable Selective Quality"复选框，则其他选项都被激活，可以设置图像质量，选取覆盖颜色，下面两个复选框表示所做的设置是否保持文本、按钮的质量，按具体情况点选它们。

　　可以调节优化面板"Quality"选项，设置图像质量，调节"Smoothing"选项，设置图像边缘模糊。

　　9.3 优化调色板

　　调色板是一个颜色索引的集合，它将图像中的像素的二进制数值同某种颜色对应起来，在显示时，根据颜色和像素值的对应关系，将图像中的颜色正确显示出来。

　　9.3.1 选择调色板

　　在"Optimize"面板中，打开调色板选项，会看到许多Fireworks默认的调色板，如图：

　　选项的各自含义为：

　　Adaptive：该调色板由图像中所包含的实际颜色组成。

　　WebSnap Adaptive：使用网络安全色，图像中超出图像范围的颜色，将由安全色中接近的颜色取代。

　　Web 216：网络安全色调色板，适用于苹果机和Windows系统。

　　Exact：256色以下的图像可应用这种调色板，反映256色以下图像的真实颜色。

　　Macintosh：苹果机系统专用调色板。

　　Windows：适合Windows系统的调色板

　　Grayscale：包含256个灰度级别的调色板。

　　Black & White：只有黑白两色的调色板。

　　Custom：自定义调色板，可以从外部调色板以及文件中载入调色板。

　　9.3.2 "Color Table"

　　选择合适的调色板，再对调色板进行优化设置。

　　单击【Window】菜单中的【Color Table】命令，打开颜色表面板，如图：

　　颜色表中显示了选择的颜色板样本，在颜色表下面有一排按钮，用来编辑颜色表。各自的作用分别为：

　　：编辑颜色表中表选中的颜色。

　　：将选中颜色设为透明。

　　：将选中的颜色转换成网络安全色。

　　：锁定选中颜色。

　　：新增颜色。

　　：将选中颜色删除。

　　利用这些按钮，可以编辑出适合的颜色表，并可以将其保存，以便以后使用。

　　9.4 图像输出

　　前面学习的所有优化操作，它的最终目的是图像的输出，得到设置好的GIF或JPEG格式的图片，Fireworks提供了多种输出方式，最有人情味的一项便是"Export Wizard"（输出向导），单击【Window】菜单中的【Export Wizard】命令，输出向导程序便会指引用户一步步进行优化设置，同时提出建议，帮助用户完成输出操作。

　　本节将重点介绍另一个重要的输出方式：

　　"Export Preview"输出预览

　　"Export Preview"将优化面板、颜色表、预览窗口等所有的优化操作和输出操作放在一个对话框中进行，这极大的方便了用户。

　　单击【Window】菜单中的【Export Preview】命令，打开对话框，如图：