Icon Font，将图标做成字体文件。优点是图标支持多个尺寸，兼容所有浏览器，减少页面请求等。美中不足的是只支持纯色的icon。

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

图片压缩工具，可以在图片上线前使用压缩工具进行压缩，获得更高的压缩比。我常用的压缩工具为Yahoo的Smush.it。

5. 适用各种资源而不限于图片的优化

data url

Base64是网络上最常见的用于传输8Bit字节的编码方式之一，可用于在HTTP环境下传递较长的标示信息。将图片转化为base64编码格式，资源内嵌于CSS或HTML中，不必单独请求。

该方式的优点是：

1. 减少了HTTP请求

2. 避免了图片重新上传，还要清理缓存的问题

不足之处是：

1. IE6, IE7不支持该类型编码的图片作为背景图

2. 增加了CSS文件的尺寸

3. 维护成本较高

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

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

Responsive设计

为了适应现在众多分辨率和设备像素比的移动设备，要产生多套不同大小和分辨率的图片，然后配合Media Query进行开发。这里推荐在进行移动端页面开发时使用SVG或Icon Font等技术。这些技术可以完美支持Retina设备。关于更多响应式方案，可以参考《响应式Web设计: HTML5和CSS3实践》这本书或网上相关资料，这里不再展开。

以上为项目中常用的图片优化技术，只有更多地关注细节，才能做出优秀的产品。今后会介绍更多文章中出现的技术细节。