前言
網站設計的優化是一個很大的話題,有一些通用的原則,也有針對不同開發平台的一些建議。這方面的研究一直沒有停止過，我在不同的場合也分享過這樣的話題。
作為通用的原則，雅虎的工程師團隊曾經給出過35個最佳實踐。這個列表請參考 Best Practices for Speeding Up Your Web Site （http://developer.yahoo.com/performance/rules.html），同時，他們還發布了一個相應的測試工具Yslow http://developer.yahoo.com/yslow/
我強烈推薦所有的網站開發人員都應該學習這些最佳實踐，並結合自己的實際項目情況進行應用。 接下來的一段時間，我將結合ASP.NET這個開發平台，針對這些原則，通過一個系列文章的形式，做些講解和演繹，以幫助大家更好地理解這些原則，並且更好地使用他們。
准備工作
為了跟隨我進行后續的學習，你需要准備如下的開發環境和工具
- Google Chrome 或者firefox ，並且安裝 Yslow 這個擴展組件.請注意，這個組件是雅虎提供的，但目前沒有針對IE的版本。
- https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
- https://addons.mozilla.org/en-US/firefox/addon/yslow/
- 你應該對這些瀏覽器的開發人員工具有所了解，你可以通過按下F12鍵調出這個工具。
- Visaul Studio 2010 SP1 或更高版本，推薦使用Visual Studio 2012
- 你需要對ASP.NET的開發基本流程和核心技術有相當的了解，本系列文章很難對基礎知識做普及。
本文要討論的話題
這一篇我和大家討論的是第三十二條原則：Make favicon.ico Small and Cacheable （使favicon.ico文件盡可能小並且可以緩存）。
在“優化網站設計（二十二）：避免404錯誤”文中，我提到了favicon.ico文件，但並沒有更詳細地展開。通常每個網站都應該有這個文件，這個文件主要用來顯示在瀏覽器地址欄中,或者收藏之后的圖標. 如下圖所示
關於這個文件的詳細信息，有興趣的朋友可以參考http://zh.wikipedia.org/zh-cn/Favicon，我整理總結如下：
- 每個網站都應該有該文件，瀏覽器在訪問任何頁面的時候，總是會嘗試去請求這個文件（如果本地沒有的話）。
- 該文件通常應該命名為favicon.ico ，如果希望使用別的名稱或者格式（例如PNG），則需要在頁面的頭部(Head)中定義引用（下面兩句中的第一句是必須的）
- <link rel="shortcut icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">
- <link rel="icon" href="http://example.com/favicon.ico" type="image/vnd.microsoft.icon">
- 該文件可以直接放在網站根目錄，但也可以放在其他的主機，或者你想要的任何位置。如果不在默認的根目錄下面，也是需要通過上面所提到的引用方式定義。
由於該文件的這些特性，所以我們有三條優化的建議
- 使它盡量在1KB左右。想比較其他的格式（PNG,GIF等），該文件默認的格式為ico，這種文件通常較小，強烈建議使用。要創建favicon.ico文件,我推薦大家使用 http://www.favicon.cc/ 提供的在線免費服務.
- 使它能夠緩存. 由於該文件使用很頻繁, 所以緩存顯得很重要. 關於這一點,可以參考 優化網站設計（三）：對資源添加緩存控制 的詳細介紹. 對於這個文件而言,可以設置永不過期(或者過期時間長一些).
- 將該文件放在單獨的主機中,例如 images.mydomain.com . 這樣可以避免在請求該文件時發送cookie. 關於這一點,請參考 優化網站設計（二十四）：通過使用不同的主機減少對cookie的使用
我們可以來看一個綜合的例子,仍然以博客園為例.
- 他們采用的是favicon.ico這種文件格式, 目前的體積為:5430字節,相當於5KB左右。這一點是有優化空間的。
- 他們為該文件設置了緩存策略：Cache-Control: max-age=2592000 ，這個相當於是30天（近似一個月）。這個文件其實更改的機會很小的，緩存時間應該可以更長。
- 他們將該文件放在了static.cnblogs.com ，這樣可以避免發送cookie。