关于Favicon
- 总是被命名为favicon.ico
- 默认存放在网站web根目录。我们常常看到这样的一个请求/favicon.ico
- 它总是显示在浏览器地址栏,网址的左边
- 当访问一个页面的时候，不管怎么样，浏览器都会请求这个文件，即/favicon.ico
- 可以通过在页面的<head>部分加入<link>元素来重新指定它的位置
<link rel=”shortcut icon” href=http://cnd.perfgeeks.com/p.ico /> - ico格式可以是不同分辨率的图像，比如16×16, 32×32等。
上图从客户端和服务端监测，可以知道每次访问页面的时候，都会访问/favicon.ico，不管该文件存不存在（一些工具像httpwatch、firebug不会将/favicon.ico请求罗列出来）。如果/favicon.ico文件不存在，则响应404错误。图-1和图-2比较而言，图-1(404响应)反倒花费的时间更少，这是图-2需要传输favicon.ico文件，http 200响应比http 404响应更大。通常在这种情况，我们应该减少对/favicon.ico请求来达到整体优化效果。
优化Favicon
- 确定文件/favicon.ico存在，不应该返回404错误。404错误意味着，每次访问浏览器都会重新请求一次/favicon.ico。我们应该减少这样的请求，将/favicon.ico缓存在客户端。减少不必要的http请求是web前端优化的一条重要准则
- 设置Expires头，将/favicon.ico缓存在客户端。比如，Apache可以通过mod_expires增加这样的设置。缓存时间可以是一个月，甚至可以是一年。
<IfModule mod_expires.c> ExpiresActive On ExpiresByType image/ico "access plus 1 year" ExpiresByType image/icon "access plus 1 year" </IfModule> - 通过<link>更新缓存。/favicon.ico名字和位置总是固定死的，如果你需要更新缓存的话，可以通过<link>元素重新指定它的位置
- 保持较小的图片大小。虽然ico格式文件支持不同的分辨率，但是我们推荐16×16大小，并且文件大小在1kb左右。
转载请注明：爱开源 » 网站优化 Favicon