favicon.ico 是什么？网站小图标扫盲指南

你打开浏览器，每个标签页左侧都有一个小图标——有的网站的图标是自家的 logo，有的还顶着个默认的地球或空白页。那个小图标，就叫 favicon（favorite icon 的缩写，直译就是"收藏夹图标"）。

favicon.ico 则是这个图标最经典的文件名：很多老浏览器约定，直接去网站根目录找 /favicon.ico 这个文件。直到今天，把图标文件命名为 favicon.ico 放在根目录，依然是全站生效、最不容易出错的方案。

浏览器是怎么找到它的

优先级大概是这样：

1. 网页 HTML 里的 <link rel="icon" href="..."> 标签，指定了就用指定的。
2. 没有的话，就去网站根目录尝试 /favicon.ico。
3. 都没有，就显示浏览器默认图标。

所以对大多数人来说，最省事的做法就是：把图标转成 favicon.ico，扔到网站根目录，完事。

为什么 favicon 通常是一个多尺寸的 ICO

favicon 的显示场景比你想的多：标签页 16×16、地址栏、收藏夹、手机桌面快捷方式、Windows 任务栏……尺寸各不相同。ICO 文件的好处就是一个文件里能装多个尺寸，系统按场景自动挑。这也是为什么 多尺寸 ICO 比单张 PNG 更适合当 favicon。

顺带一提：现在很多浏览器也接受 PNG 格式的 favicon，但 ICO 兼容性最好，尤其老系统和旧版浏览器。想要省心，就做 ICO。

怎么换上自己的 favicon

三步：

1. 准备一张图片，最好是方形、主体居中的 logo（小尺寸下才看得清）。
2. 用图片转ICO工具转成多尺寸 favicon.ico，全程本地处理。
3. 把 favicon.ico 放到网站根目录，或者用 <link rel="icon" href="/favicon.ico"> 引用。

刷新页面，标签页上的小图标就换好了。如果没生效，先强刷（Ctrl+F5），再检查文件是不是真的传上去了。