返回文章列表

大 GIF 压缩教程,保留动画并比较 WebP

用文件工坊调整 GIF 颜色、图片尺寸或转为 WebP 动图,检查帧数、播放效果和结果体积,并批量打包下载。

5 分钟阅读1452 字

一张动图塞进文章里,画面挺直观,文件却可能比整篇文字都大。

压缩时我更在意两个结果,文件确实变小,动作也还是原来的动作。

打开文件工坊,把 GIF 拖进去,选保留动画,再调整尺寸和输出格式。

处理在浏览器里完成,文件无需上传,也无需登录。

当前每批最多 30 张,单张上限 200 MB,整批合计上限 500 MB。

这些是文件限制,大尺寸和长动画仍会占用浏览器内存,批量时可以先拿一张试参数。

练习时可以先保存这张公开示例 GIF,保留一份原图,再比较不同输出。

先选动图处理

在右侧找到动图处理,选择保留动画。

只取首帧会把动图变成一张静态图片,适合取封面,保留动作时用前一种。

GIF、WebP 和 APNG 都是当前可用的动画输出格式。

选择 JPG 等静态格式又要求保留动画时,工具会提示更换格式。

继续用 GIF,先调颜色和尺寸

目标平台只收 GIF 时,输出格式继续选择 GIF。

GIF 颜色数量可以选择 256 色、128 色、64 色或 32 色。

教程截图、简单图形和少量配色的动画,可以先试 128 色,再和原图比较。

照片、渐变和细碎纹理更容易在减少颜色后出现色带,先看画面,再决定要不要降到 64 色。

GIF 没有可调的质量百分比,主要靠颜色数量和图片尺寸改变结果。

图片尺寸默认保持原始尺寸,也可以选择最长边 1280 px 或 800 px 等选项,按原始比例缩小。

原图已经小于所选最长边时,工具会保持它的尺寸。

我会先保留原始尺寸,只调整颜色,仍然太大再缩尺寸,免得一次改太多,看不出哪一步影响了画质。

点击开始处理,队列里会显示动画的逐帧处理进度。

完成后查看结果尺寸、动画帧数和体积变化,再下载文件。

允许换格式,就试 WebP 动图

WebP 本身支持动画和透明通道,也提供有损与无损编码方式,格式能力可以查Google 的 WebP 文档。

换成 WebP 的前提,是最终发布或展示它的平台能正常接收和播放这种格式。

在文件工坊中选择 WebP,动图处理仍选保留动画,图片质量可以先设为 80%,尺寸先保持原样。

这里的质量数值用于编码取舍,80% 的结果需要和原图比较画质。

如果结果仍然偏大,再降低质量或缩短最长边,每次都把成品下载下来比较。

把 GIF 转成 WebP,也可能得到更大的文件,所以最后看实际体积,不按扩展名判断压缩是否成功。

同一张练习动图的三份文件

这份公开示例是人工合成的高噪声压力素材,画面为测试图案,适合检查动画处理和输出信息。

原图是 960 × 540 px,60 帧,一轮播放 4.8 秒,并带有透明区域。

两份成品使用文件工坊采用的同一处理引擎生成,最长边都缩到 800 px,GIF 颜色数量设为 64 色,WebP 质量设为 80%。

文件 尺寸 体积 动画帧数 单轮时长
原始 GIF 960 × 540 px 16,224,378 字节 60 4.8 秒
800 px、64 色 GIF 800 × 450 px 7,935,363 字节 60 4.8 秒
800 px WebP 800 × 450 px 3,917,302 字节 60 4.8 秒

逐帧读取这三份文件,帧时长均为 80 毫秒,循环信息均为无限循环,三份文件都能读取到透明像素。

这组结果同时改变了尺寸和编码参数,体积差异只对应这份合成素材,画质还要打开文件比较。

成品要看完一个完整循环

结果里的帧数能帮助发现意外静态化,真正的播放效果还要打开文件查看。

从头播放到结尾,确认动作顺序、速度和循环方式,再关注文字、渐变和物体边缘。

带透明背景的素材,放在深色和浅色背景上各看一次,检查边缘和透明区域。

减少颜色、缩小尺寸或有损编码都会改变画面,动画完整和画质完全不变是两件事。

当前 GIF 处理会按原始帧序重新编码,并保留播放时长和循环信息,成品仍需在目标平台试放。

文件工坊会提示体积未减小的结果,这时可以重新调整参数,或者保留更合适的原文件。

改参数会清掉当前处理结果,已经满意的那一版先下载保存。

参数确认后,再处理整批

把其余动图加入队列,同一批使用统一的输出参数。

点击开始处理,完成后用每张文件右侧的下载按钮分别保存,也可以点击打包下载获取 ZIP。

某张失败时,查看它自己的提示,先分离出问题文件,避免为了重做一张而重复处理整组。

首次处理需要加载图像引擎,处理过程中让当前页面保持打开。

如果压缩是为了给文章插图,可以继续按Markdown 转公众号教程导入原稿并排版。

静态截图需要统一圆角和留白时,用截图美化工具处理,动画压缩和截图装饰分开完成。

标签:实用软件

相关阅读

实用软件微信技巧

Markdown 转公众号排版教程

用科排导入 Markdown、选择文章主题、插入图片并复制到公众号,附示例原稿和发布前检查方法。

4 分钟