这是什么
favicon(「favorite icon」的缩写)是显示在浏览器标签页页面标题旁边、书签列表中,有时还会出现在浏览历史和搜索建议里的小方形图片。它通常是徽标的简化版本——小到只有几个像素大小依然能辨认出来,比如一个字母、一个简单的形状,或一个图标。
如果没有它,浏览器会在那个位置显示一个通用的空白页图标——任何未设置 favicon 的网站都会用这个占位图,这会让人立刻看出这个细节从未被配置过。
为什么重要
缺失 favicon 是件小事,但也是最显眼的小事之一:它出现在你网站的每一个页面上、每个浏览器标签页里、面向每一位访客,而且始终如此。当有人打开了好几个标签页时,favicon 往往是他们从一排标签中找回你那个标签的唯一视觉方式——通用的空白图标让这件事变得更难,也悄悄传递出「这个网站从未真正完工」的信号。
这也是整个清单里最快能拿到成效的事情之一:与内容或设计决策不同,favicon 只需几分钟就能创建并添加,一旦到位就无需持续维护。
如何解决
- 创建一个简单的方形图片(最好是你徽标的简化版本)——免费的 favicon 生成工具可以自动把现有的徽标图片转换成合适的文件格式和尺寸。
- 将结果保存为
favicon.ico或favicon.svg,并上传到你网站的根目录(或你的托管平台要求存放图标文件的位置)。 - 在页面的
<head>部分添加<link rel="icon" href="/favicon.ico">(或对应的 SVG 版本)。 - 如果你使用的是网站建设工具(Squarespace、Wix、Webflow、WordPress),在通用网站设置中寻找「favicon」或「网站图标」上传字段,而不是直接编辑代码。
- 在一个全新的浏览器标签页中重新加载页面(或清除浏览器缓存),确认新图标已经出现——favicon 有时会被缓存,更新较慢。