GIF 是什么？什么时候该用、什么时候别用

GIF 自 1987 年就存在了，比万维网本身还老。虽然技术上早已过时，但 GIF 至今仍随处可见——社交媒体的反应图、表情包、网页里的小动画。下面把它的真面目讲清楚，以及什么时候用更新的格式更划算。

GIF 是什么？

GIF 全称 Graphics Interchange Format。它是一种位图格式，通过把多帧画面塞进同一份文件来呈现动画，每帧都有一个显示时长。

它最关键的技术限制是色彩——每帧最多 256 色。对照片和复杂图像来说远远不够，会出现明显的色块带。但对色彩简单、时长不长的动画来说，够用。

GIF 适合的场景

• 色彩单一的简单动画。 Logo 动效、加载圈、UI 演示。
• 能自动播放的短动画。 在视频需要点击播放的场景，GIF 能静默自动播放。
• 表情包和反应图。 整个文化语境都建立在 GIF 之上，大家也习惯了它。
• 极致兼容性。 GIF 哪都能用，不用 JavaScript，也不用视频播放器。

这些场景请改用别的

较长的动画请用 MP4 而不是 GIF

5 秒的 GIF 体积常常 5–20 MB，同样内容做成 MP4 通常小 10–20 倍。多数浏览器支持自动播放静音视频，HTML 也很简单：

<video autoplay loop muted playsinline>
  <source src="animation.mp4" type="video/mp4">
</video>

加载更快、画面更好看（MP4 支持百万级色彩），还为访客节省大量带宽。

网页动画用 Animated WebP

Animated WebP 支持完整色彩，同等画质下比 GIF 小约 64%。浏览器支持率已超 95%，做网页用是务实的选择。代价是它在通讯软件和社交平台上的覆盖度，还达不到 GIF 的程度。

静态图请用 PNG 或 SVG

如果图根本不动，GIF 永远不是正确答案。带透明的静图用 PNG，要清晰缩放的图标和插画用 SVG。

为什么 GIF 容易变巨大

GIF 体积膨胀的原因：

• 帧数越多越大。 流畅的动画需要每秒很多帧。
• 画布尺寸大。 动图 GIF 尽量控制在 600px 宽以内。
• 颜色种类多。 即便在 256 色限制下，色彩越丰富，体积越大。

10 秒的 720p 流畅动画做成 GIF 几乎不可能——体积会大到离谱。请用视频。

GIF 的转换工具

要从 GIF 抽出静帧，或者转成更高效的格式：

• GIF 转 PNG —— 把第一帧保存为 PNG
• GIF 转 JPG —— 保存为 JPG（更小，无透明）
• GIF 转 WebP —— 转成更高效的动图格式

常见问题

GIF 念「gif」还是「jif」？ 作者本人说是「jif」（和那个花生酱品牌发音一样），但互联网上多数人念硬「G」。怎么念都听得懂，没必要为此吵架。

为什么 GIF 在照片上看起来很糟糕？ 就是因为 256 色限制。照片需要成千上万种颜色才能自然呈现，硬塞到 256 色就会出现明显的色块带和抖动伪影——也就是那种典型的「颗粒感」。

能从视频做 GIF 吗？ 能。但你可以先想想，是不是用一个自动播放的 MP4 就够了——它通常更好看、加载更快。