从网页设计角度应该如何优化网站图片

　　从网页设计角度，应该如何优化网站图片

　　1、去掉无意义的修饰。

　　除了内容图片，其他的图片的作用是修饰，也就是对于传达信息来说并非本质性的。最大的优化就是压根不要图片！所以在优化之前要做的，首先是确认设计，设计本身是否需要用那么多图片？还是说可以更简洁？

　　2、不用图片。

　　切图是一件扯淡的事情，直接使用CSS替代图片来实现修饰效果吧！如半透明、边框、圆角、阴影、渐变等，在当前主流浏览器中都可以用CSS达成。将来CSS滤镜得到广泛支持后，还可以做到alpha混合、正片叠底等各种效果。

　　3、使用矢量图替代位图。

　　对于绝大多数图案、图标等，矢量图更小，且可缩放而无需生成多套图。现在主流浏览器都支持SVG了，所以可放心使用！

　　4、使用恰当的图片格式。

　　我们常见的图片格式有JPEG、GIF、PNG。基本上，内容图片多为照片之类的，适用于JPEG。而修饰图片通常更适合用无损压缩的PNG。而GIF基本上除了GIF动画外不要使用。且动画的话，也更建议用video元素和视频格式，或用SVG动画取代。

　　除了这些格式之外，Chrome、新版Opera、Android 4 支持WebP格式，IE 9 、IE mobile 10 支持JPEG XR。这两个新格式都支持无损和有损压缩，都具有更良好的压缩比。当然这需要为不同的浏览器返回不同的图片，增加了开发成本，也增加存储成本。不过你省了流量或者相同流量下改善了图片质量，提升了用户体验。你会如何取舍呢？

　　对了，别忘了使用优秀的图片编码器及合适的参数。好的图片编码器，尤其是有损图片格式的编码器（推荐Caesium），能通过算法或手动调整，获得更高的压缩比。

　　5、按照HTTP协议设置合理的缓存。

　　具体的缓存策略（如永久缓存 重命名）、部署策略（如反向代理、CDN等）这里就不展开了。