QA
基础
如何测试与检查你的 Favicon(免费检查器)
· 6 min read
在 Chrome、Safari、Firefox、iOS 和 Android 上,自动和手动兼具。
快捷方式:自动扫描
把你的 URL 粘贴到 favicon 检查器里,它会抓取实时页面、解析 <head>、列出每个图标标签,并在桌面、Apple、Android 和 manifest 各个位置标记出缺失或损坏的内容。这是唯一一个能一次性覆盖所有内容的检查。
检查的顺序
- 1
运行一次自动扫描
扫描你的实时 URL,列出每个 favicon 标签并标记缺失或损坏的图标。
- 2
检查浏览器标签页
强制刷新,确认图标在桌面浏览器的标签页中清晰渲染。
- 3
检查书签和地址栏
把页面加入书签,确认 16x16 图标在紧凑的场景中依然清晰可辨。
- 4
检查 iOS 和 Android 主屏幕
在 iOS 上添加到主屏幕,在 Android 上安装 PWA,以验证 apple-touch-icon 和 manifest 图标。
- 5
检查搜索结果中的 favicon
确认 Google 在你结果旁显示的图标是最新的那个。
手动检查清单
| 位置 | 要做什么 |
|---|---|
| 浏览器标签页 | 在 Chrome、Safari 和 Firefox 中强制刷新(Cmd+Shift+R / Ctrl+F5)。图标在 16-32px 下应当清晰,而非模糊或有锯齿。 |
| 书签和地址栏 | 把页面加入书签。这会在最紧凑的场景里暴露 16x16 图标。如果它在这里都难以辨认,就简化图稿。 |
| iOS:添加到主屏幕 | 在 Safari 里,分享 → 添加到主屏幕。iOS 使用 apple-touch-icon,而不是 favicon.ico,所以这能抓住一整类缺失的标签。 |
| Android / PWA 安装 | 在 Android Chrome 上安装该应用。主屏幕和启动画面图标来自 manifest.json,所以这能验证你的 manifest 图标是否解析。 |
| Google 搜索结果 | 搜索你的品牌,确认结果旁的 favicon 是最新的。Google 至少需要一个 48x48 的图标,并在重新抓取时刷新。 |
每项检查所涉及的尺寸





完整覆盖是什么样子
一套完整的 favicon 覆盖浏览器标签页、书签、搜索、iOS、Android、Windows 磁贴,以及 PWA manifest。如果你的扫描显示有缺口,那就是缺失的品牌标识。阅读为什么 favicon 覆盖很重要,并查看完整的 favicon 尺寸参考。
常见问题
我怎么检查 favicon 是否正常工作?
对你的实时 URL 运行一次自动 favicon 扫描,确认每个标签都能解析,然后在浏览器标签页、书签、iOS 主屏幕和已安装的 PWA 中手动验证图标。
上线前我怎么预览 favicon?
大多数生成器会在你设计时显示实时的标签页预览。要验证真实文件,直接打开每个图标 URL,确认尺寸和格式与你的 link 标签所引用的一致。
为什么我的 favicon 在 Google 搜索里和浏览器里不一样?
Google 会缓存上次抓取时的 favicon,并要求至少一个 48x48 的图标。浏览器会立即显示你当前的文件,而搜索只有在 Google 重新抓取后才更新。