favicon.website，将网页写入favicon图标

favicon.website

favicon图标装下整个网页

打开浏览器标签页时，那枚只有 16×16 像素的小图标，其实可以是一整个网站。

这个想法的源头，是开发者 Tim Wehrle 的一篇博文《I Stored a Website in a Favicon》。他做了个实验：把一段 208 字节的 HTML，逐字节写进 PNG 的 RGB 通道（每个像素存 3 字节），最终得到一个 9×9 像素、看似噪点的图标；再用一段脚本读取 favicon 像素、还原 HTML、替换页面。

思路极妙，但作者自己也承认它「不实用」。但我是谁？无聊工作室创始人，专注无聊项目，但凡有用的我是一点兴趣也没有。我顺着这个创意，做了 favicon.website，并把它推进成一套真正可用的开放格式——FWC-1（Favicon Web Container）。

原方案缺了什么？

细看 Tim 的实验，有四个硬伤：

1. 无结构：只有 4 字节长度头，没有魔数、版本、校验，读错了就崩。
2. 易失真：直接写 RGB、不处理 alpha。而浏览器会按 alpha 预乘像素，跨引擎读回来颜色会漂移。
3. 容量浪费：噪点模式每像素 3 字节是上限，但稍大内容就放不下，也没有压缩和加密。
4. 无标准：没有测试向量、没有互操作约定，只能自己写自己读。

FWC-1 做了哪些优化？

针对以上问题，我把「把网页写入 favicon」从玩具变成了规范：

• 自描述容器：12 字节头部——魔数 FW、版本号、标志位、负载长度、CRC32，任何实现都能可靠解析并校验完整性。
• alpha 恒为 255：固定不透明，让预乘变成恒等变换，保证写入的每个字节在 Blink / Gecko / WebKit 上都能原样读回，杜绝颜色漂移。
• 双重载体：noise 模式追求最大容量；lsb 模式把数据藏进封面图低位，视觉几乎无感。
• 压缩 + 加密：需要时用 deflate-raw 压缩（只在变小才启用），口令保护时用 PBKDF2 + AES-256-GCM，图标本身就是密文。
• 零依赖运行时：解包只用 Canvas、CompressionStream、WebCrypto，加载器不到 1 KB，无需任何库或 WASM。
• 完整规范：12 章节、RFC 2119 风格约束、逐字节测试向量、威胁模型、版本演进路线图，双语呈现，任何编码器与解码器都能互操作。

谁需要它？

自然是没人需要！！！

想做一个零运维的个人名片？一张会被反复复制、永不失效的「传单」？一个只能通过下载图标才能获取的内容彩蛋？

打开 /studio 写几行 HTML，点一下生成，你就得到一枚能「自立门户」的图标。一张图，就是你的网站。

欢迎访问 favicon.website，去看看这个藏在标签页角落里的世界。