Web 前端優(yōu)化最佳實踐第六部分面向 圖片(Image)，這部分目前有 4 條規(guī)則。在最近的 Velocity 2008 技術(shù)大會上，Yahoo! 的 Stoyan Stefanov 做的 Image Optimization: How Many of These 7 Mistakes Are You Making 也非常有參考價值。結(jié)合一起說一下。
1. 優(yōu)化圖片 (Optimize Images)
使用 GIF 、JPG 還是 PNG 格式的圖片? 盡可能的使用 PNG 格式的圖片，更多的功能，更小的尺寸(與 GIF 相比)。
對于 PNG 圖片，考慮用 Pngcrush 或類似的工具進行優(yōu)化。常見的工具如下表:
•pngcrush http://pmt.sourceforge.net/pngcrush/
•pngrewrite http://www.pobox.com/~jason1/pngrewrite/
•OptiPNG http://www.cs.toronto.edu/~cosmin/pngtech/optipng/ (refer: 教程)
•PNGOut http://advsys.net/ken/utils.htm
另請參見: Five Tips For the Effective Use of PNG Images
對 JPEG 圖片的優(yōu)化工具：
•jpegtran (http://jpegclub.org/)
必需要強調(diào)的是，圖片設(shè)計的同學(xué)啊，請考慮設(shè)計面向Web的圖片，不要動不動就設(shè)計超過可接受尺寸之外大家伙，這應(yīng)該是一種習(xí)慣，而不是什么高超的技能，只需要記住就成了。
3. 不要在 HTML 中使用縮放圖片 (Don’t Scale Images in HTML)
更多的時候，可能是因為偷懶而沒有制作合適大小的圖片，如果是批量處理圖片的話，可能一條 ImageMagic 命令（convert ）就能搞定 。必須提及的是，看到太多的對圖片拉伸很難看的頁面，救救這些頁面!
4. 用更小的并且可緩存的 favicon.ico (Make favicon.ico Small and Cacheable)
更小，可緩存，這兩條可能都不是問題。問題是，太多站點根本沒有 favicon.ico 。有的時候，判斷獨立域名的 Blog 是否專業(yè)，基本看一下是否有 favicon.ico 就差不多了。
更新時間：2009-07-22
