IE外壳浏览器横向比较（二）：正确获取收藏夹图标(favicon)

• IE 外壳浏览器横向比较专题
• 1. 中键点击与引用页
• 2. 正确获取收藏夹图标

第二篇：正确获取收藏夹图标(favicon)

在本专题的上一篇中，我谈到了四款 IE 外壳浏览器关于中键点击与引用页的比较。这次，我要说的是，浏览器如何正确地获取收藏夹图标 (favicon)。

favicon 是用于显示在浏览器地址栏和收藏夹中的图标，相信大家都不会陌生。印象中，国内网站较早启用 favicon 的是闪客帝国，那个时候，一道金黄色的闪电让人耳目一新（现在换成了蓝色闪电）。那个时候，它的制作“技巧”在网站设计和开发人员之间流传着：制作 DIY 一个 16 x 16 大小的 icon, 并确保它只有 16 色，然后把这个 .ico 图标文件放在网站根目录。

毫无疑问，favicon 是一个用于展示网站形象的不错载体。但是，随着网站的发展，仅仅在网站根目录放一个图标文件已经不能满足需求——一个大型网站可能会有多个不同的频道，比如 blogcn，它们之间表达的主题也不尽相同。都用同一个 favicon 难以表达各自的主题。于是，一种 link 标签应运而生。它的写法是： <link rel="shortcut icon" href="ICON_URL"> 这样, 可以使同一网站不同页面呈现不同的 favicon.

说到这里，就要进入今天的正题了。如果浏览器能同时查找根目录下的 favicon.ico 文件和上面 <link> 指定的 icon URL, 且 <link> 具有更高优先级，则该浏览器能正确地获取 favicon.

这里做一个简单的测试：将专题中提及的四款浏览器打开两个 tab, 分别访问如下两个网址： Microsoft Corporation Homepage: www.microsoft.com/en/us/default.aspx Microsoft Expression Homepage: www.microsoft.com/products/expression/en/default.mspx

由于各浏览器加载 favicon 策略不同，我们等页面全部加载完成后，再观察它们在 tab 上显示的图标。如果分别显示成 和 , 则说明该浏览器能正确获取 favicon, 如果都显示成 , 则表明它没能正确获取。

测试结果

在参与比较的 4 款浏览器软件中，能正确获取 favicon 的只有 IE, 其它 3 款浏览器只是“傻傻”地尝试获取 /favicon.ico.

ps: 此问题我曾经在 Maxthon 官方论坛反映过，但他们并未在 2.x 版本中做出改进。

附注：本文所说的收藏夹图标严格来说，是“地址栏图标”，有一个 <link> 标签专门用来指定收藏夹图标： <link rel="Bookmark" href="favicon.ico"> 事实上它并未引起重视，本文不考虑对它的正确处理问题。