favicon.ico：它是什么，以及你是否还需要它
favicon.ico 是当一个页面没有声明自己的任何图标时，浏览器从你域名根目录的 /favicon.ico 请求到的图标文件。它是一个 ICO 容器，所以单个文件可以同时容纳多个位图（通常是 16x16、32x32 和 48x48），由客户端挑选它需要的尺寸。你依然会想要一个，因为爬虫、订阅阅读器和链接预览机器人会在不读取你 HTML 的情况下请求那个确切路径。
一种惯例，而非标准
路径 /favicon.ico 从来没有被任何人规定过；是 Internet Explorer 5 请求了它，然后其余的网络跟着效仿。这就是它为什么完全不需要任何标记也能工作。一个在你页面上找不到 icon link 标签的浏览器，就干脆向服务器请求那个路径，并使用返回回来的任何东西。
由此带来的连锁反应是：无论你有没有那个文件，这个请求都会发生。如果它缺失，服务器就会为每个访客记录一个 404，而任何只检查那个路径的工具都会为你的网站显示一个空白占位符。
一个典型 favicon.ico 里有什么
| 条目 | 用于 |
|---|---|
| 16x16 | 地址栏、书签列表、历史记录条目 |
| 32x32 | 标准密度显示器上的浏览器标签页 |
| 48x48 | Windows 快捷方式和更高密度的标签页 |
文件放在哪里
- public/
- favicon.icoaddServed at /favicon.ico
- favicon-32x32.pngPrimary tab icon
- apple-touch-icon.pngiOS Home Screen
它必须在站点根目录解析，而不是在某个子目录里。大多数框架正是为此把 public 或 static 目录映射到根目录；有些框架，包括较新的 Next.js，还接受一个 app/favicon.ico 并为你接好标签。
显式声明它
<link rel="icon" href="/favicon.ico" sizes="any">可选，因为这个路径本来就会被请求，但值得加上：它让图标集在标记中可见，并让你能在图标变更时用查询字符串做缓存清除。
favicon.ico 常见问题
favicon.ico 真的可以是一张 PNG 吗？
浏览器嗅探内容而不信任扩展名，所以一张以 /favicon.ico 提供的 PNG 通常能用。但这仍然是个坏主意。你会失去多尺寸行为——而那正是使用这个路径的唯一理由——而且更严格的使用方可能会拒绝它。
我怎么停掉日志里的那些 404？
发布这个文件。压制那行日志只是掩盖了症状，而每一个请求那个路径的工具仍然什么都得不到。
文件必须放在根目录吗？
对于那个自动请求来说，是的。客户端专门请求 /favicon.ico。如果你用一个 link 标签指向它，你可以从任意路径提供图标，但根目录那个文件才是覆盖那些从不解析你 HTML 的客户端的东西。