首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

GIF图片为什么能够动起来?|怎么缩小GIF的体积?

GIF 的全称是 Graphics Interchange Format,图像互换格式,是一种位图图形文件格式。

它的特色相比于其他格式的图片,就是可以把图片“动起来”。除了没有声音,其他和小视频基本一样。这样对比静态的图片就会让用户得到更多更全面的信息。这是静态图片所不能企及的。

另外在一些不适合放视频的网页中就更加有效。因为视频的播放往往需要再点击一下播放按钮。而作为图片的 GIF,就可以做到自动播放,阅读文章时就可以有非常沉浸式的体验。

并且 GIF还可以作为表情包,在各大聊天软件里出现。这也是视频做不到的功能。

GIF常常扮演着表现内容、传达信息、传递心情的重要角色。

GIF 格式最早在 1987 年就已经诞生了,1989 年推出了增强版本,支持透明色和多帧动画。同时 GIF 有着图片和视频的双重优势,可以在有限的文件大小里包含更多信息量

那他是怎么动起来的呢?

GIF动起来的主要原理,,就是由「帧」来实现的,许多帧的静态图片组合成一张动图。换句话说,GIF 实际上是一种由一帧帧图片组合而成的压缩文件。动图的总时长则是由帧数和帧数之间的时间间隔决定的,帧数越多,体积越大。因为人眼是有自动补全机制的,当一帧帧的静态图片快速得在眼前播放时,我们就会觉得图片动起来了。

GIF 采用了优秀的压缩算法,在一定程度上保证图像质量的同时,GIF 还能让体积尽可能的小。因为它可以记录前后两帧之间的变化,而不是记录每一帧的图像。如果你尝试把每一帧的图片分开保存,会发现图片体积远远超过 GIF 本身的大小。

但即便如此,由于 GIF 仍然需要记录每个像素点的色彩信息,在比较后进行处理。增加图片的尺寸就意味着增加图片中记录的所有色彩信息。通俗地讲,图片的尺寸越大,体积越大

如果在相同尺寸不加压缩的情况下,一张1080p的PNG容量为2M,而GIF格式的容量就要比PNG格式的容量大出4倍有余。达到8.2M。那就会有人觉得疑惑了。不是说GIF画质差吗?那为什么反而会比静态图片尺寸更大呢?

这是因为,就算是不会动的GIF,内部信息还是会包含多帧图像,一旦像素发生变化,GIF 就需要记录它们的变化,此时图片的色彩变化越多,体积越大。所以在相同尺寸下,GIF 存储的信息量远超 JPG 和 PNG 格式。也就很少有人把照片文件以 GIF 格式存储。

另外GIF 的缺点也很明显,就是它的颜色质量差。GIF 采用 8 位色,也就是只能用 256 种颜色来存储图片。就类似于任天堂早期的8位红白机。所以很多人会说GIF有很强的颗粒化像素感。相比之下,JPEG 格式最高可以有 24 位色。PNG 格式的彩色图像的深度甚至可以多到 48 位色。这种颜色深度上的根本性差距,使得 GIF 的画质看上去总比其他格式要差一些。

那有没有办法让 GIF既能顺滑得动起来,又能减少体积呢?

那就需要在制作时使用下面的3个主要因素:

色彩、帧数、尺寸

大致可以理解为「GIF 体积 = 色彩 × 帧数 × 尺寸」。

我们这里不谈制作的软件,只说注意事项。软件有多种多样,但都是殊途同归。

1.色彩

GIF默认是256色,实际使用中,如果设置成64色,就可以减少40%体积,同时还能保留大多数细节。

2.帧数

减少录制中的一些空白,等待,去掉一些不必要的动作。控制录制的帧率。这里可以有2种选择:

1.设置为10帧/秒,动作虽然稍有些不连贯,但能够有效降低图片大小。

2.设置为25帧/秒,就可以有效地保留细节。人眼对于25帧以上动画是看不出停顿的。

3.尺寸

我们通常愿意牺牲一些图片质量来降低图片尺寸。让动图的长宽减半,可以轻松达到 75% 左右的压缩率。

最有效的方法是缩放。如果有一张 1600 x 900 的动图,让长宽都变成原来的一半 800 x 450,就可以立即降低 75% 的文件大小,是最有效的 GIF 压缩方式。

所以也就是大多数的GIF动图都比较小的原因。

时至今日已经过去了 30 年,在摄像头和屏幕分辨率越来越高的今天,GIF 却仍然需要为文件体积做出妥协,已经显示出了一些疲态,可谓廉颇老矣。

目前有一些新兴技术,比如 webp、apng动图格式正在逐步兴起,但在这些技术普及之前,我们还是要用到既要小,又能流畅动起来的 GIF。

那么希望这篇文章能帮助你了解到一些小技巧。

  • 发表于:
  • 原文链接https://kuaibao.qq.com/s/20221111A06UXU00?refer=cp_1026
  • 腾讯「腾讯云开发者社区」是腾讯内容开放平台帐号(企鹅号)传播渠道之一,根据《腾讯内容开放平台服务协议》转载发布内容。
  • 如有侵权,请联系 cloudcommunity@tencent.com 删除。

扫码

添加站长 进交流群

领取专属 10元无门槛券

私享最新 技术干货

扫码加入开发者社群
领券