图标手记
01
明明有 256px,为什么 ICO 还是模糊?
预览清晰,不代表桌面上的图标也清晰。要分别检查原图、ICO 内包含的尺寸,以及实际显示图标的位置,避免反复转换却没有改善。
阅读文章 ↗02favicon 换了,为什么仍显示旧图标?
浏览器标签页和 Google 搜索结果需要分别排查。先证明网站实际提供了正确文件,再处理缓存或搜索抓取问题。
阅读文章 ↗03透明图标为什么出现白底?先分清这三种情况
白色可能来自图片本身、预览背景或目标软件的显示方式。仅把文件扩展名改成 .ico,不能判断或解决这些问题。
阅读文章 ↗04ICO、PNG 还是 SVG:先确定交付用途
网站图标、Windows 快捷方式和手机应用图标,需要的文件并不相同。先查清目标平台接受的格式,再制作素材。修改扩展名不会改变文件内部的数据。
阅读文章 ↗05ICO 应该勾选哪些尺寸?
最大的图片不是唯一有用的图片。尺寸组合应围绕目标用途选择,并按实际显示大小检查。原图很大,也不能保证 16 像素下的细节可读。
阅读文章 ↗06正确安装 favicon,让内页也能显示
电脑里有一个 ICO 文件,并不表示网站已经使用它。分开检查上传位置、网页声明和浏览器真正请求的文件,才能知道问题出在哪里。
阅读文章 ↗07favicon 在标签页正常,Google 为什么不显示?
浏览器标签正常,只证明一种显示场景可用。搜索结果还涉及域名、抓取权限和 Google 的要求,不是上传之后立即更新的预览窗口。
阅读文章 ↗08iPhone 主屏幕为什么需要单独的图标?
iPhone 将网站添加到主屏幕时,使用的不是简单放大后的浏览器标签 ICO。需要准备单独素材,并实际走一遍“添加到主屏幕”的操作。
阅读文章 ↗09PWA 图标被裁切或变成小白块,如何排查?
安装后的网页应用,可能需要 manifest 中声明的图标以及普通 favicon。启动器应用形状遮罩时,同一张图片可能呈现完全不同的效果。
阅读文章 ↗10Windows 图标不对:文件、快捷方式还是应用?
替换“下载”目录里的文件,不一定会改变已有快捷方式或运行中的应用。先确认实际引用的资源,再重做 ICO 或考虑系统缓存问题。
阅读文章 ↗11宽 Logo 怎样变成清晰的小图标?
适合网页页眉的文字 Logo,放进正方形 favicon 后可能只剩一条细线。通常需要单独的小尺寸构图,而不是下载更大的文件。
阅读文章 ↗12转换保密 Logo 前,先核对隐私与文件限制
出现文件选择框,不代表图片一定被上传;写着隐私口号,也不能证明图片留在本机。使用尚未公开的素材前,应检查真实操作过程。
阅读文章 ↗