什么是APNG · 语雀
APNG 是什么?相对于 GIF 有哪些优势?APNG 是一个基于 PNG 格式的位图动画格式图片,因为对于一直以来的特点就是以动态显示为主的 GIF,为了更好地在网络上传播,它需要牺牲质量来降低体积,图像信息比较多的情况下,颗粒感很明显。APNG 是普通 png 图片的升级版,它的后缀依然是.png,包含动态的情况下体积会比普通静态 png 打出数倍,可以做到无损的情况展示动态。其诞生的目的是为了替代老旧的 GIF 格式,但它目前并没有获得 PNG 组织官方的认可。
APNG 全称是 Animated Portable Network Graphics,是 PNG 的位图动画扩展,可以实现 png 格式的动态图片效果。但是 PNG 组织一直都不认可 APNG。因为 PNG 组织也曾做过一个名叫 MNG 的图像格式,希望可以成为 PNG 动画的标准,主流。可惜,MNG 不争气,过多浪费社会资源,以至于 PNG 组织都放弃了。
GIF 是一个非常古老的格式,1987 年诞生,最后一个版本是 1989 年。至今已经足足三十年,却依然未被新的技术所取替,这是为什么呢?
主要有四个原因:
几乎所有的主流浏览器都支持 GIF早期选择不多,GIF 几乎是唯一选择(GIF – 1987、JPEG – 1992、PNG – 1996、APNG – 2004、WebP – 2010)实现起来简单,制作的工具多采用 LZW 数据压缩算法,使得 GIF 体积小,在早期慢速的互联网易于传播
APNG 相对新一些,是 Mozilla 在 2004 年推出的,十几年的科技进步是不容小觑的,所以 APNG 相对于 GIF 的优势十分明显,后面会分析。APNG 格式是 PNG 的扩展,第一帧储存方式和普通的 PNG 一样在 IDAT 区段中,APNG 只是新增了三种区段,所以如果一个软件只支持 PNG 而不支持 APNG 的话,依旧可以显示出图片的第一帧,只是不能动罢了。
APNG 新增的三种区段分别为:
acTL (animation control) 用来存放帧数和播放次数,整个文件只有一个区段fcTL (frame control) 用来存放每一帧的高、宽、位置、延时等信息,每一帧一个区段fdAT (frame data) 用来存放除了第一帧以外后面每一帧的图片数据,采用 Deflate 压缩,每一帧一个区段
关于压缩率
GIF 采用的是 LZW,而 APNG 采用的是 Deflate,再加上 APNG 继承了 PNG 的 filter,利用相邻像素的相似性使压缩率大大提高。
关于颜色
GIF 每个像素只有 8 bit,也就是说只有 256 种颜色,于是很多人误以为 GIF 不支持 24 bit RGB,但实际上,GIF 的限制是每一帧最多只能有 256 种颜色,但是每种颜色可以是 24 bit 的。不过即使是这样,256 种颜色还是太少了,这就导致了 GIF 的画质都比较差。而 APNG 和 WebP 则完全没有这方面的限制。
关于透明
GIF 虽然也支持透明,但是他只支持将某个颜色标记成透明,也就是说他不支持半透明,只支持完全透明或者完全不透明。如果把一个边缘是半透明的图片转换成 GIF,就会出现另一个答案中提到的杂边问题。 而 APNG 和 WebP 都支持 8 bit alpha channel,透明度可以有 256 级。
关于兼容性
GIF 的兼容性不用多说,这也可能是其唯一的优势了吧,因为你可能就找不到不支持 gif 图片格式的浏览器,但是对于 APNG 而言,支持的浏览器只有 Firefox 和 Safari,同时 Chrome 59 也将支持 APNG,但是对于微软下面的 IE 或者 EDGE 嘛,子凡我就笑笑不说话啦!
就目前的各种情况来看,aPNG 还是很难流行或者真正的使用起来,因为对于制作方面还是非常麻烦的,当然如果大家感兴趣可以去看看这个网站(里面就是一些 APNG 制作的软件。
总的来说子凡并不是非常看好 APNG,这里就不得不说到 Google 在 2010 年推出的全部通吃的图片格式:WebP,为什么叫全部通吃呢?因为他既可以有损(替代 JPEG)也可以无损(替代 PNG),还可以动(替代 GIF),并且在压缩率上全面超越了这三种常用的格式。,目前支持 WebP 的只有 Chrome 和 Opera,据说 Firefox 也即将支持 WebP,据说 Safari 也在测试 WebP 的支持。至于 IE 和 EDGE 大家就别想了,子凡也就一笑而过吧!