fireworks网页图片导出优化

很多同学都搞不明白，这么多图片格式，什么情况用什么格式图片。
我在这里就简单分享下我的经验。
原则：保证图片不失真的前提下，以最小的图片大小来导出图片。
目前我们网络上普遍使用的图片格式分为JPG、GIF、PNG-8、PNG-32(PS中的PNG24)。
具体图片格式的原理，我就不说了，大家可以去度娘查询下。
我只说明什么情况使用什么格式，以及它们的优缺点。
JPG：
一般来说，大型的、颜色丰富的图片可以用JPG，例如照片、商品图片。
缺点：JPG会损伤一些像素化的东西，例如文字，如果你的照片上有些像素字体，这些字会被扩散，周边会出现杂点。
PNG-8：
目前使用图片最多的格式之一，仅次于jpg，PNG-8是用来代替以前的GIF的，大部分情况PNG-8要比GIF小20%。
跟GIF一样PNG-8是以像素点来存储图像的，所以比起JPG来说，它更加精确，不会产生像素字出现杂点的现象，一般用在按钮、导航背景、图标等地方。
PNG-8和GIF一样，是支持图片透明效果的。
缺点：大型、颜色丰富的图片中，PNG-8的大小会越来越大，甚至达到PNG-32的大小。FW导出PNG-8的时候大跨度渐变会产生失真（这个如何处理后面会说）。
GIF：
目前GIF属于淘汰阶段，因为PNG-8比它更为优化，当然优点也显而易见，那就是动画。
PNG-32：
无损压缩，32位真彩色图片+alpha透明通道，几乎完美的格式。
缺点：图片大小很大，IE6下透明部分会产生灰底。
如何使用FW导出图片
1.为什么使用Firewroks
fw有着比PS更好的图片优化功能，
fireworks于photoshop的图片优化比较。http://blog.dmtuan.com/?p=270
2.使用
FW导出图片利用文件-图像预览来导出图片，类似PS的导出web格式功能。
jpg：
默认是80优化度，这个程度跟PS的60是一样的，不过有时候会增加些，我一般用84。
png-8：。
png-8导出选项中有分：不透明、索引色透明、alpha透明。
不透明，顾名思义，不说了。
索引色透明中，你可以选择一个颜色当作色板，那么你选择的这个颜色会以透明显示，其他颜色则不透明。
半透明的地方会以色板颜色+半透明颜色的混合值输出。

如图，我们使用白色作为索引色，那么这个圆中的文字也同样变成了透明，这个方面真心PS做的好，我会用个笨办法，外面画个白色底，合并平面化所选后用0-实边的魔术棒把白色删了再用alpha透明导出。
另外，如果背景是深色调的，会有明显的白色毛边出现，这个和PS是一样的毛病。
重点来了，PNG-8 alpha透明
我使用最多的就是这个模式。
此模式PS是不具备的，这也是FW的强大，此模式下，png-8能支持图片半透明，也就是说我们可以解决上面白色毛边问题了！！
所以，个人觉得PNG-8优美的图片大小今后必将代替PNG-32！！
我上面说了今后，是的，PNG-8 alpha透明还是有它的缺点，依然是IE6，不过这个缺点对比PNG-32的灰底来说已经是好了很多。
PNG-8 ALPHA透明在IE6下会把所有半透明的部分解析成全透明。
所以有些半透明的诸如背景、边框，还是老老实实的采用png-32，然后滤镜或者VML处理，直到IE6消亡为止。
当然，更多地方我们可以以优雅降级的思想来处理更多的透明问题。
例如按钮，小图标。这些只有边缘少量半透明像素的东东，其他浏览器很完美，就如同PNG-32那样，IE6中会处理成边缘像素化。
见google使用的png-8 alpha透明 http://blog.dmtuan.com/demo/google_png8/Google.htm
这是google在纪念牛顿诞辰的时候的皮肤，我们见到，google这里的苹果用的就是png-8 alpha透明，你可以自行测试IE6和其他浏览器的区别。
大跨度渐变失真问题

如图，当FW导出png-8的时候，渐变有可能产生失真现象，这个时候可采取抖动来消除这个现象，不过抖动后，有时候会产生一些颗粒状像素，这个时候我就要考虑是否用JPG来代替了，因为这张图的颜色数可能过于丰富了。
当然，在制作css spirtes拼合图的时候，可能必须采用png-8来导出，这时颗粒状像素如果真的无法忍受，那么就导出PNG32再使用PS导出吧，比起质量来说PS要更优化，不过大小就会大很多了。