从 SVG 到 favicon：先看小，再做大

浏览器标签页只给图标一小块位置。它没有首页那样的光影、说明和动效帮忙，往往只剩轮廓与明暗关系。因此，网站图标的第一轮设计应在小尺寸里完成：把同一个方案放在十六、三十二和一百二十八像素的预览格中，观察最细的线、最小的空隙，以及主体是否偏向一边。大图是检查做工的放大镜，小图才是它的工作现场。

坐标不是分辨率

保留一份 SVG 源文件，便于修改几何关系。一个 viewBox="0 0 256 256" 描述的是内部坐标，不是图像只能输出二百五十六像素的限制。圆心、边距和笔画先在同一坐标系里确定，再由显示尺寸决定它占多少屏幕像素。先把笔画加粗再缩小，常比给模糊边缘添加阴影有效。MDN 的 viewBox 说明

SVG 中的文字还依赖字体。源文件里写着“聚”，不表示每台电脑都有同一款字。以文字做印信时，要检查导出的 PNG；若交付给别人编辑，也应说明字体来源。需要固定字形时，可以在支持的矢量编辑器中转为轮廓，但仍应另存一份可编辑文字稿。

三种文件，各有职责

SVG 保留可编辑的形状关系，PNG 把图像固定到像素网格，ICO 则是一种可以装入多幅图像的图标容器。把 PNG 文件名改成 .ico 不会完成转换。请用真正的导出功能，并重新打开结果；检查文件是否能识别、边缘是否完整、透明背景上有没有意外的白块。Microsoft 图标文档

应用清单可以声明不同尺寸的图标，例如一百九十二和五百一十二像素的 PNG。这些是常见应用用途，不能替代小尺寸检查。一个五百一十二像素的精致纹章，缩成标签页图标仍可能失去所有细节。Web 应用清单说明

把检查放到入口上

网站页面、浏览器标签页与搜索结果不是同一个展示入口。Google 搜索按主机名选用图标，不能给同一主机下的两个子目录分别指定搜索图标；浏览器里的页面图标更新，也不意味着搜索缓存立刻更新。先确认页面引用路径与实际响应，再等待外部系统重新获取。搜索图标指南

练习：在印信工坊套用“朱砂素印”，只保留两个字母和一条外框。下载源图与位图，把它们放在白、深灰和透明棋盘背景上比较。记录一个最小可辨尺寸，以及一个需要删除的细节；修改后重复检查，而不是继续增加装饰。