您当前的位置 >> 美术园美术学习网 > 设计网 > 软件教程 > PhotoShop教程 >

PS5.5的“Save for Web”功能

本站：（美术园）美术网时间：2012-01-12 14:29 |挑错|美术论坛

photoshop5.5中，新的网页图形输出过滤器的功能有了很大提高，由原来最弱的功能变成了现在最强的功能之一。SaveforWeb则是Photoshop5.5中最重要的功能之一，它既是一个GIF和JPEG图像输出过滤器，更是一个在图片大小和显示质量之间找到最佳平衡点的迷你程序，它包括多种功能，下面我们就来看看。
★优化网页图形　　从Photoshop5.5的file菜单选择“SaveforWeb”，会出现一个简洁的对话框，对话框右上角有四个标签，通过它们，你可以选择四个不同的视图－－原图、一种优化、原图与优化对比（2-Up视图）、三种不同优化与原图对比（4-Up视图）。　　所有视图都在“图片预览”下面显示了该图像的信息。在视图的右下方，预览还告诉你当前显示图片所用的格式、图片的大致尺寸、以及使用指定MODEM在互联网上的下载时间（MODEM可选14.4、28.8或56.6Kbps）。

在图片右下方，预览窗口告诉你指定的JPEG或GIF文件的模式。例如，在4-Up视图中，可以看到三种不同模式JPEG图片的质量，在每个预览窗口的右下角，会告诉你对应的图片模式。你也可以将4-Up视图中的原始视图转换为一种优化模式视图，这样，你就可以同时比较四种优化模式的图片质量。　　
如果你在一个预览窗口上右击鼠标（PC机），或者按Ctrl键的同时单击预览窗口（Mac机），你将看到一个弹出菜单。该菜单允许你对预览进行多种调整，如：
---打开或关闭dither设置；　　
---改变MODEM设置；　　
---放大或缩小预览窗口（如果你在4-Up视图中设置一个预览窗口以100%显示，那么其他的所有预览窗口将自动进行调整）；　　
---以多种假定色彩方案预览图像。例如，你可以看看你的图片在PC机和麦金塔机上将分别是什么样子。　　

单击预览区域右上角的一个小按钮，你也可以找到上面的多数选项。使用对话框左端的缩放工具或者左下方各预览窗口下面的另一个弹出式对话框，你还可以选择不同的缩放视图。　　

信息栏显示鼠标所指位置像素的设定情况，包括RGB、Alpha和十六进制值，其中Alpha值告诉你不透明的程度，255表示完全不透明，0表示完全透明。此外，这里还可以告诉你颜色表上指定位置的索引值。在右下端有一个弹出菜单，你可以用已经设定的浏览器打开图片。　　

预览窗口的右边是Settings选项，与颜色表和“图片尺寸”标签相邻。Adobe在这个小小的区域内安排了很多功能。在Settings的顶端，有一个进行预置的弹? 单，你可以在此添加或删除预置。　　预置下面是弹出菜单区域。首先，选择图片格式（如GIF、JPEG、PNG-8或PNG-24）。接下来出现的弹出菜单依你选择的图片格式而定。对于JPEG模式，现在没有添什么新的，但对于GIF格式，就有几个重要的功能。如果你选择了GIF格式，你可以选择包括调色板类型、抖动算法、颜色号码、交错和透明选项在内的标准排列。　　

★给GIF图片作透明效果　　当需要对一张GIF图片上进行透明处理的时候，你也许要使用过去的GIF 89a输出过滤器，因为Adobe减弱了SaveforWeb中的此项功能。　　

如果要在GIF图片中做透明效果，那么，你需要导出一张在背景层上已经作了透明处理的非层图片。换句话说，在你进行Save forWeb操作之前，应该擦除或删除你希望在GIF或PNG图片中透明的任何东西。否则，透明选项无效。　　

实际上，在你执行SaveforWeb功能之前（如象使用GIF89a输出过滤器），如果你将一张GIF图片编入索引中，你将得到透明选项。当你给图片作索引的时候，确认你已经在颜色索引对话框中（Photoshop 5.5的一个新功能）选择了透明选项，否则，Photoshop将不会为透明选项添加额外颜色。这样，Save forWeb将不能给GIF图片作出透明效果，这是因为你不能象在GIF89输出过滤器中一样，为透明指定一种具体的颜色。所以，在你执行Save forWeb功能之前，索引给你一个并不存在的透明选项，除非你已经为一张背景层已经有透明效果的图片编了索引。　　

除了以上事实说明这是一种实现透明效果的笨拙方法以外，还有另外一个原因也可以说明这一点。当你在Photoshop中，删除或擦除一个背景层上的像素的时候，默认情况下，删除部分会出现羽化效果。GIF格式只支持一种透明效果－－要么全透明要么全不透明。所以，如果在你的图片中有部分像素透明，当你在Save forWeb中使用透明功能的时候，你将得到多余的边缘，因为Photoshop将那些部分透明的像素转换为Matte选项中定义的颜色（如果什么都没选默认为白色）。　　
虽然这些选项中大多数是标准选项，但是做某些颜色表选项（尤其是Perceptual选项）的记录是有必要的。“感觉颜色表”让Photoshop建立一个让人类眼睛非常敏感的调色板。理论上Perceptual选项会产生更刺眼的颜色表。对网页设计者而言，另一个有用选项是“选择性颜色表”，它的工作与Perceptual选项类似，但它能保存网页颜色。　　
★方便的输出模式　　现在GIF选项包括Lossy压缩功能，这是Photoshop新增的一项优秀功能，而以前只有在SPG Web这类插件中才有此功能。使用Lossy，可以让你在损失很少一点点图片质量的情况下，去掉GIF图片中的多余字节，即我们平常说的给图片“减肥”，以缩短网上下载时间。　　在SaveforWeb对话框Settings部位的右上角，有一个小按钮，按下后会出现一个弹出菜单，允许你保存设置、删除设置和返回视图（通常在你每次改变设置后自动完成）。　　“优化文件尺寸”是另一个体贴用户的选项。使用该选项可以指定颜色和压缩模式，将文件优化到既定大小。你可以任意指定一种格式，强制Photoshop进行优化，或者在JPEG和GIF中选用一种。可惜的是，“优化文件尺寸”选项只能同时在一个预览窗口中进行。如果可以在4-Up视图的四个窗口中使用，那这个功能就真的很方便了。　　
★颜色表选项　　颜色表选项可对GIF模式（以及PNG-8模式）有效，其操作与你可能已经用过的老版本Photoshop中差不多，只是增加了几个与网页相关的新功能。　　当Photoshop在颜色表中组合调色板的时候，它在网页调色板中用小白点自动标记颜色。这样可以让你看到，你的调色板中有多少网页安全颜色。如果你要选择一种网页调色板上没有的颜色，你可以通过点击调色板下面的小方块图标，轻易地捕捉到最接近网页调色板上的颜色。　　
使用颜色表功能，你也可以在调色板中锁定颜色。例如，你可以锁定一种颜色并选择更高压缩率的GIF算法。当调色板重算的时候，锁定颜色不会被去掉。你还可以添加颜色到调色板中或者删除调色板上的颜色。由于不能在Save forWeb对话框内绘画，所以，添加颜色的功能不可能经常使用，但需要时，它是一种省力的方法。
在颜色表视图中，右上方有一个小按钮，按下它，会出现一个弹出菜单，可以实现几种很有用的功能。例如，你可以选择弹出菜单的“Select AllNon-WebSafeColors”项，然后，点击颜色表中的方块图标将它们转换为最接近的网页安全颜色。　　
你也可以使用这个弹出菜单上的选项锁定或解开选中颜色（避免你一次锁定所有颜色）。"WebShift/Unshiftselectedcolors”选项很重要，因为它可以让你预先看到，当转换到网页安全颜色时效果怎么样。如果这个转换产生的视觉效果你不喜欢，你可以取消转换。这是一个体贴周到的设计，弥补了在网页安全调色板中没有撤销（Undo）选项的不足（除非你计算出撤销和开始的点击数）。Save forWeb功能颜色表的弹出菜单也允许你通过色调、亮度和流行色对颜色分类。当然，你也可以调入和保存颜色表。　　
前面曾经提到，在Adobe的SaveforWeb中也包括了图像尺寸功能，它是另外一个体贴周到的设计，兼顾到了优化网页图形的一种最好方法是减少图片的尺寸。裁剪也是一个减少图片尺寸的好方法，可惜它没有被包括在里面。　　
★总结　　SaveforWeb功能清除了输出GIF、JPEG和PNG图片时产生的多余部分。现在你不必再苦苦推算何时图片文件尺寸和视觉质量达到最佳平衡了。你可以试试多种模式和格式，并对比它们的视觉效果。例如，你可能看到你图片的最佳文件尺寸或许是128 GIF图像，但使用MediumJPEG模式，图片虽然增大一半，但图片质量看起来却要好得多。　　
诚然，SaveforWeb也有一些不足，如笨拙的透明处理、没有撤销和裁剪功能等，但它毕竟将Photoshop的网页图形编辑功能向前推进了一大步，全面看待它，其强大的功能不可否认。显然，Save forWeb就是Photoshop5.5此次升级最耀眼的亮点。

［上一篇：着色模式如何使用？］

！▲▲本文被收藏: 次▲|已有0条评论|我来说两句 |挑错|↑返回顶部

本文PS5.5的“Save for Web”功能的标签： nbsp save 功能 PS5.5

［下一篇：PS中清晰显示11px中文字体］

相关文章

Photoshop CS2画笔面板中的秘密	Photoshop 蒙版笔刷使用
使用 Photoshop CS 进行自然	用 Photoshop 制作素描画像
Potoshop素描滤镜Sketch Effect	PHOTOSHOP 6 使用技巧集锦
PhotoShop 的路径组合运算制作FIFA2002	PhotoShop 6 速成教程（二十）
PhotoShop 6 速成教程（十九）	PhotoShop 6 速成教程（十八）