卡卡網(wǎng)

盡管做網(wǎng)站好多年了，但一直忽視favicon.ico這個(gè)圖標(biāo)，也許大家設(shè)置favicon.ico的目的，是為了在瀏覽器上顯示時(shí)更好看點(diǎn)，更能個(gè)性化網(wǎng)站，但我認(rèn)為沒有這個(gè)必要。不過(guò)，今天我要說(shuō)的是，我之前的看法是不對(duì)的，任何網(wǎng)站都應(yīng)該設(shè)置一個(gè)favicon.ico圖標(biāo)，不是為了好看，也不是為了個(gè)性化，而是為了優(yōu)化網(wǎng)站速度。

為什么今天說(shuō)在網(wǎng)站上設(shè)置了favicon.ico，就可以優(yōu)化網(wǎng)站速度呢？難道服務(wù)器缺少favicon.ico就影響網(wǎng)站速度嗎？答案是肯定。

Yahoo：減小favicon.ico體積和緩存favicon.ico

在Yahoo的網(wǎng)站速度優(yōu)化建議里，有一條是：減小favicon.ico體積和緩存favicon.ico。它是怎么解釋的呢？看看那Yahoo的解釋：

favicon.ico是一個(gè)放在服務(wù)器根目錄的圖片，這是必需的，因?yàn)榧词鼓悴魂P(guān)心它但是瀏覽器一樣會(huì)請(qǐng)求它，所以最好不要響應(yīng)“404未找到”。
另外，由于它放在相同的服務(wù)器上，每次它被請(qǐng)求的時(shí)候，都會(huì)發(fā)送cookies。
這張圖標(biāo)也會(huì)干擾下載順序，例如在IE中，當(dāng)在onload時(shí)你請(qǐng)求額外的組件，favicon將先于這些額外組件下載。

所以為了減輕favicon.ico帶來(lái)的弊端，請(qǐng)確保：
它是小體積的，最好在1K以內(nèi)。

使用你覺得合適的方法設(shè)置過(guò)期標(biāo)頭（因?yàn)楫?dāng)你要改變它時(shí)你不能重命名它），你可以安全地設(shè)置過(guò)期標(biāo)頭為幾個(gè)月的時(shí)間，你可以檢測(cè)你現(xiàn)在的favicon.ico的最后修改時(shí)間以做出合適的決定。

Imagemagick能幫助你創(chuàng)建一個(gè)小體積的圖標(biāo)。

卡卡網(wǎng)站速度診斷：缺少favicon.ico響應(yīng)404錯(cuò)誤

在卡卡網(wǎng)的網(wǎng)站速度診斷（http://pagespeed.webkaka.com/）里，如果網(wǎng)站缺少favicon.ico圖標(biāo)，那么就返回一條404的錯(cuò)誤提示。

缺少favicon.ico響應(yīng)404錯(cuò)誤（點(diǎn)擊圖片放大）

缺少favicon.ico響應(yīng)404錯(cuò)誤，符合Yahoo的優(yōu)化規(guī)則，而響應(yīng)404的錯(cuò)誤提示，勢(shì)必會(huì)影響網(wǎng)站的速度，在上圖中，我們清楚的看到，瀏覽器請(qǐng)求favicon.ico時(shí)等待時(shí)間用了62ms。在Google的網(wǎng)站速度優(yōu)化建議中，也提到“去掉錯(cuò)誤的請(qǐng)求”，因?yàn)?ldquo;錯(cuò)誤的請(qǐng)求會(huì)增加請(qǐng)求時(shí)間，應(yīng)盡量避免”。

標(biāo)簽: 網(wǎng)站優(yōu)化