动态 Favicon（GIF 与 JavaScript）
动态 favicon 通常是一张用作图标的动态 GIF；Firefox 和一些 Chromium 版本会在标签页里播放它，而 Safari 和其他一些只显示第一帧。网站主要用动画来表示实时活动（一个转圈、一个未读计数、一个录制小红点），往往是用 JavaScript 切换图标，而不是依赖 GIF。对于品牌标志，静态图标更清晰，也支持得更广。
支持并不均衡，所以把它当作增强项
一张作为 favicon 引用的动态 GIF 会在 Firefox 和一些 Chromium 版本里播放，但 Safari 和另外几个只渲染第一帧。所以动画永远不能是承载信息的：图标需要表达的任何内容，都必须仅凭那第一帧就清晰可辨。
正因如此，现实中大多数"动态"favicon 根本不是 GIF。它们是一段脚本，从一个画布重绘图标并切换 link 标签的 href：加载时的一个转圈、录制时的一个小红点，或者叠加在标志上的一个未读计数。这带来精确的控制，并通过同样的 link 切换机制到处可用。
用 JavaScript 表示实时状态的路径
要显示一个未读徽标或状态点，就把每种状态画到一个画布上、导出它，再把 favicon link 的 href 设为结果。浏览器会实时更新标签页图标。这正是邮件和聊天应用把一个数字放进标签页的做法，而在脚本被关闭时它会优雅地退化成一个静态图标。
动态 favicon 常见问题
动态 favicon 在 Chrome 和 Safari 里有用吗？
支持并不一致。Firefox 会播放 GIF favicon，Chromium 时好时坏，而 Safari 通常只显示第一帧。永远不要指望动画一定被看到。
我怎么在 favicon 里显示未读计数？
在 JavaScript 里把图标加徽标画到一个画布上，然后把 favicon link 的 href 设为画布的输出。每当计数变化时更新它。这和邮件与聊天应用用的是同一种技术。
我该用动态 favicon 吗？
对于品牌标志，不该。静态图标更清晰，也普遍受支持。把动画留给真正的实时状态，并用 JavaScript 的 link 切换而非 GIF 去实现它。