📚 本篇依然来自于我们的 《前端周刊》 项目!
作者:德育处主任
说起动图,你最先想到的是什么格式的图片?
看过我前两年发布的文章的工友应该知道,我很喜欢用GIF做封面。文章对你有没有用不知道,但看到动图总能乐一乐。
GIF流行了这么多年已经成为一种文化现象,我们斗图用的动态表情基本都是GIF。
但在使用GIF做封面时我遇到一些问题。
- 大多数平台对图片体积有限制,GIF体积通常很大。视频转成GIF后体积比视频还要大。
- GIF太糊了,色彩表现力很差
GIF的缺点当然不止这两个,但这两个是我遇到最大的痛点。
在前段时间(2025年6月24日)PNG发布了3.0版本,宣布支持HDR和动图的显示!
不查不知道,其实PNG在最开始的目标就是干掉GIF,但为什么没干成呢?今天就来聊聊这段恩怨情仇。
故事要从上世纪90年代那个纯真又野蛮的互联网黎明讲起。那时,网页还像是大学生的实验田,粗糙、简单,但充满了生命力。在这片数字荒原上,有一种格式统一了视觉的江湖,它就是GIF(Graphics Interchange Format,图像互换格式)。
GIF生于1987年,由CompuServe公司开发。刚开始还是免费的图片格式,什么人都可以用。GIF的核心能力是支持多帧存储,简单来说就像一个自动解压并且按顺序播放图片的能力。
在那个上网还要靠拨号的年代,想要在网页看视频是成本极高、交互极差的一件事。GIF可以说在某种程度上代替了视频的功能,在那个年代算是外星科技了,很快就在互联网上流行起来。
GIF用的是LZW压缩算法,但这个算法W部分的专利被Unisys公司注册成专利。Unisys看到GIF这么火,不想错过这个天上掉下来的馅饼。于是在1994年12月28日做了一件不讲武德的事:任何在商业用途使用GIF格式的软件开发者或公司,都必须为其中使用的LZW数据压缩算法向Unisys支付专利授权费。
消息一出,整个互联网社区炸了锅。之前用着免费GIF的用户就郁闷了,养肥再割?这不仅仅是钱的问题,更是一种对早期互联网开放、共享精神的背叛。
于是他们发起了一个名叫“Burn all GIFs”的游行示威活动,呼吁大家删掉自己电脑里的GIF文件。
同时也在各大论坛发布燃烧GIF的动图。
不过这个动图貌似也是一个GIF🤔
在这片怒火中,一位名叫Thomas Boutell的程序员站了出来。1995年1月4日,距离Unisys的“收租公告”仅仅过去了一周,他在“comp.graphics”新闻组里发帖,振臂一呼:我们不能就这么算了,我们得创造一个完全免费、不受专利限制的替代品。
这一提议,如同在干柴上扔下了一颗火星。来自世界各地的技术大牛们迅速响应,一场轰轰烈烈的技术起义就此拉开序幕。在接下来的几天里,各种天才的想法在邮件列表里碰撞、融合。
有人说,新的格式必须支持24位真彩色,彻底超越GIF那可怜的256色限制。
有人建议,压缩算法必须是公开、免费的。很快,大家锁定了一个名为“Deflate”的算法,它正是后来大名鼎鼎的ZIP压缩的核心。
一位名叫Oliver Fromme的程序员,提出了一个响亮又带点极客式挑衅的名字:“PING”,意为“PING is not GIF”(PING不是GIF)。这个名字最终演变成了我们今天所熟知的PNG。
由社区怒火点燃的PNG(Portable Network Graphics,便携式网络图形,外号叫“PNG is Not GIF”)项目,1996年10月1日,PNG 1.0规范被W3C正式批准为官方推荐标准 。它就像一个天赋异禀的挑战者,一出场就亮出了王炸。
首先是无损压缩,图片质量极高,这方面完全吊打GIF。
在色彩方面更是碾压GIF好几个段位。PNG最高支持48位色彩深度(16位3通道),而GIF只支持256色。
PNG还有一个杀手锏——Alpha透明通道。GIF只支持1比特的索引透明,也就是说这个像素要么完全透明,要么完全不透明。而PNG支持半透明。
凭借这些技术上的降维打击,PNG很快就在静态图片领域取代了GIF的王座。然而,就在它完成“弑君”大业,成为新的王者之后,却陷入了一段长得令人发指的沉寂期。
以下是PNG发展历程:
- 1996年7月1日:PNG 发布1.0版本,后来称为RFC 2083标准。
- 1996年10月1日:PNG 1.0作为W3C推荐标准发布,宣告诞生。
- 1998年12月31日:PNG 1.1发布,修复了一些关于Gamma校正和色彩校正的技术问题。
- 1999年8月11日:PNG 1.2发布,唯一的改动是增加了一个名为
iTXt
的数据块,用于存储UTF-8文本。 - 2003年11月10日:PNG第二版规范发布,这也就是很多人误以为的“PNG 2.0”。它本质上是1.2版的重新排版和修订,并于2004年3月被正式采纳为国际标准。
从2003年到2025年,整整22年,PNG的官方规范再无任何大版本更新 。这位曾经的屠龙少年,在登上王位后,仿佛直接开启了“贤者模式”,对外界的风云变幻不闻不问,过上了与世无争的退休生活。干掉旧王,然后摸鱼二十年😄。
为什么会这样?答案很讽刺,PNG陷入了“成功者的诅咒”。
它在自己的核心领域「无损、透明的静态图片」做得太好了,以至于成为了互联网世界里像空气和水一样理所当然的基础设施。当一样东西好用到让你感觉不到它的存在时,也就意味着没人有动力去改变它。
这是我从W3Techs查到的数据
到2025年8月底,网站使用的图片,PNG的占比高达78.9%,排名第一。
需要注意的是,一个网站可能使用多种图片格式,因此百分比总和不为100%。
前面也提到,PNG最早的出发点是干掉GIF,但到今天都没干成功,为什么呢?
在PNG这位静态图片之王安享晚年之时,动图领域的王座依然被年迈的GIF牢牢占据。PNG的创造者们当然不甘心,他们早就想把GIF这最后的阵地也一并拿下。于是,一场围绕“PNG动图”继承权的“权力的游戏”拉开了序幕。
“官方太子”MNG的华丽与覆灭
PNG开发组早在1995年就决定,PNG本身应该是一个纯粹的单图像格式 。为了实现动画功能,他们在2001年推出了一个独立的、雄心勃勃的官方继承人——MNG(Multiple-image Network Graphics)。
MNG的设计堪称豪华。它不仅仅是想做GIF的替代品,而是想成为一个全面的多媒体动画格式 。它支持:
- 基于精灵(Sprite)的动画,可以移动、复制和粘贴图像对象,而不是像GIF那样傻乎乎地复制每一帧,压缩效率极高 。
- 复杂的嵌套循环和脚本控制。
- 同时内嵌PNG(无损)和JNG(一种基于JPEG的有损格式),实现动画中的照片级画质 。
- 支持“Delta-PNG”,即只存储帧与帧之间的差异,进一步提升压缩率 。
从技术上看,MNG是完美的“太子”,血统高贵,能力超群。然而,它也因此患上了“太子病”——过于复杂和臃肿。它的规范极其庞大,导致解码器的实现非常困难,代码库体积巨大。在21世纪初,浏览器厂商们正在为性能和体积焦头烂额,Mozilla的开发者们在评估后发现,一个完整的MNG解码库需要增加整整300KB的体积 。这在当时是完全不可接受的。
结果就是,MNG这位“官方太子”几乎没有得到任何主流浏览器的支持,最终在无人问津中悄然“暴毙” 。它用自己的失败证明了一个残酷的真理:技术上的先进,并不等同于市场上的成功。用户想要的只是一个更好的GIF,而不是一个包罗万象的Flash。
“民间私生子”APNG的崛起与流放
就在MNG走向末路之时,两位来自Mozilla的开发者——Stuart Parmenter和Vladimir Vukićević——在2004年提出了一个截然不同的方案:APNG(Animated Portable Network Graphics。
APNG的设计理念与MNG截然相反,它充满了草根的智慧和实用主义精神。它的核心是一个天才般的“黑客”设计:
- APNG文件本身就是一个合法的PNG文件。它的第一帧就是一个标准的、完整的PNG图像流 。
- 动画的所有后续帧和播放控制信息,都被巧妙地塞进了PNG规范中预留的“辅助数据块”(ancillary chunks)里 。
- 根据PNG规范,不认识这些数据块的软件应该直接忽略它们 。
简单来说,APNG完全可以取代GIF,同时还保留了PNG的特性,完美向后兼容了。
上图是一张png动图,来自维基百科:https://zh.wikipedia.org/wiki/File:Animated_PNG_example_bouncing_beach_ball.png
就在APNG申请转正期间,GIF版权到期了😂
虽然Unisys很可恶,虽然GIF诸多缺点,但它历史悠久啊,大家都用习惯了,GIF也早已成为一种文化。APNG想翻身可不容易。
同时,PNG官方也不想承认这个私生子。PNG官方开发组和APNG之间有一段长达十余年的意识形态战争。
2007年4月20日,PNG开发组经过投票,10:8 正式拒绝将APNG接纳为官方扩展。
-
官方组的“纯血派”:以Glenn Randers-Pehrson等规范维护者为代表,他们认为PNG的灵魂就在于它是一个单图像格式。APNG这种把动画帧“藏”在辅助数据块里的做法,是对规范纯洁性的亵渎。它制造了一种混乱:一个文件扩展名是
.png
,但它到底是静态图还是动图?应用程序无法在下载前轻易分辨,也无法告知用户图片里还有更多帧 。这在他们看来是糟糕的设计。 -
Mozilla的“实用派”:他们认为,在互联网上,向后兼容性是压倒一切的最高原则。MNG的失败已经证明,任何不考虑兼容性的“完美”方案都注定失败。APNG是唯一能在现实世界中推广开来的务实选择。
这场争论的背后,是一个经典的技术发展困境:究竟是委员会定义的“法定标准”(de jure standard)说了算,还是由市场和实现者决定的“事实标准”(de facto standard)说了算?
PNG官方组手握规范的定义权,他们是“立法者”。但Mozilla手握着当时最重要的浏览器之一Firefox,他们是“执法者”。在被官方拒绝后,Mozilla做出了一个大胆的决定:他们直接在Firefox 3.0中集成了对APNG的支持 。
这一举动,彻底改变了游戏规则。它在现实世界中创造了一个既成事实,一个官方可以无视但无法抹杀的APNG生态。随后的故事证明了“得民心者得天下”的道理。APNG凭借其优异的性能和兼容性,逐渐赢得了开发者的青睐。而压倒骆驼的最后一根稻草来自苹果公司。2016年,苹果在iOS 10的iMessage中,选择APNG作为动态表情包的标准格式 。这个拥有海量用户的应用场景,瞬间让APNG的需求量暴增。
市场的天平彻底倾斜。Safari、Chrome等其他主流浏览器纷纷跟进,APNG最终成为了动图领域的事实标准 。PNG官方组被流放的“私生子”,在经历了近十年的漂泊后,最终凭借自己的实力赢得了战争。而官方组在多年后将APNG纳入PNG 3.0规范,更像是一场迟到的“追认”,承认了这个早已由市场加冕的王者。
在PNG标准沉睡的22年里,世界发生了翻天覆地的变化。其中一项重要的技术革命,就是HDR(High Dynamic Range,高动态范围)的普及。从旗舰手机到高端电视,HDR带来了前所未有的鲜艳色彩和惊人亮度,让画面无限接近人眼所见的真实世界。
然而,一个看似微不足道,却让无数内容创作者和观众抓狂的问题出现了。看过电影的人应该能察觉到,在乌漆麻黑的影院里播放着蓝光高清电影,色彩绚丽、光影震撼,但下方的字幕老是灰蒙蒙的,总感觉打扫卫生的人故意不擦屏幕底部。但这事不能怪清洁工。
这种糟糕的体验,源于一个根本性的技术矛盾:视频内容本身是HDR的,但叠加在上面的图形元素,比如字幕、台标、比分牌等,很多都是用传统的SDR(Standard Dynamic Range,标准动态范围)图像格式(比如PNG)来渲染的。这类图片的亮度通常在 0-100nit,而HDR的峰值亮度比这高太多了,当这类字幕到了峰值喂1000nit甚至更高亮度的视频里就会出现前面提到的情况。
于是,电影佬就有话要说了。你这PNG小组能不能干点正事,别整天躺在那装死。
光喊一两声还不足以叫醒装睡的人。
很快,一场围绕PNG现代化的“复仇者联盟”集结了起来。成员名单堪称豪华:Adobe、苹果、BBC、康卡斯特/NBC环球、谷歌、MovieLabs,以及W3C自身 。这些巨头之所以愿意投入资源,是因为这个问题触及了他们所有人的核心利益:
- 苹果:iPhone拍摄的HDR视频和Apple TV+的内容,都需要完美的字幕体验。
- 谷歌:YouTube上的海量HDR内容和Chrome浏览器的渲染能力,都受此影响。
- Adobe:Premiere Pro等专业视频编辑软件,急需解决HDR工作流中的图形叠加问题。
- BBC等广播公司:电视直播中的台标和滚动新闻条,在转向HDR播出时面临同样的技术障碍。
这是一个影响整个产业链的共同痛点。与其各家自研私有解决方案,不如联手升级一个开放、通用的国际标准,这才是最高效、最经济的做法。
PNG小组一看,不对劲啊!要弹起来了。
睡了20几年也睡够了,PNG小组一个鲤鱼打挺就蹦起来动次打次。
2025年6月24日,W3C正式发布《便携式网络图形(PNG)规范(第三版)》作为官方推荐标准 。而这一次,它没有像过去那样小修小补,而是直接“把牙膏挤爆”,带来了一系列堪称革命性的更新。
特性一:HDR
新版规范最核心的升级,就是正式支持HDR图像。它通过一个名为cICP
(Coding-Independent Code Points)的全新数据块来实现这一功能 。
这个设计极其聪明:
- 高效简洁:
cICP
数据块本身只占用4个字节(外加一些PNG数据块的常规开销)。它并不重新发明轮子,而是直接引用了国际电信联盟(ITU)为视频领域制定的现有标准(如BT.2100),来定义图像的色彩空间、传递函数和矩阵系数 。这使得PNG的HDR实现能够与整个HDR视频生态系统无缝对接。 - 向后兼容:
cICP
是一个“辅助数据块”,这意味着老旧的、不认识它的软件会直接跳过这个数据块,然后根据文件里依然存在的传统色彩信息(如gAMA
和cHRM
块)来渲染出一张标准的SDR图像 。网页不会因此崩溃,图片依然可见,只是没有了HDR效果。 - 解决痛点:有了
cICP
,PNG图像现在可以明确地告诉显示设备:“我是一张拥有Rec. 2020广色域和PQ传输函数的HDR图片,请用最高亮度来渲染我”。那个困扰好莱坞的“灰色字幕”问题,从根本上得到了解决。
当然,这种兼容方式也并非完美。在一些旧的查看器中,直接忽略HDR信息可能会导致图像看起来有些“褪色”或“发灰”。PNG工作组已经意识到了这一点,并计划在接下来的第四版规范中,通过引入“增益图”(gain maps)等技术来进一步改善HDR与SDR内容的互操作性 。
特性二:给“私生子”上户口
在经历了近二十年的“流放”之后,由Mozilla创造的APNG终于被“扶正”,正式写入了PNG核心规范 。这意味着:
- APNG不再是“非官方扩展”,而是PNG标准的一部分。
- 规范为APNG定义了专属的官方MIME类型——
image/apng
,解决了多年来关于其身份标识的混乱问题。
这场旷日持久的“动图继承权之战”,终于以实用主义的全面胜利而告终。那个曾经被官方拒之门外的“私生子”,如今终于名正言顺地继承了王位。
特性三:补上迟到二十年的作业
除了HDR和APNG这两项重大更新,PNG 3.0还正式加入了对Exif元数据的支持 。Exif是数码照片中用于记录拍摄信息(如相机型号、光圈、快门速度、GPS位置等)的标准。过去,虽然可以通过非官方手段将Exif数据塞进PNG文件,但始终名不正言不顺 。
这次更新,终于让PNG在元数据支持上,与JPEG、TIFF等专业的摄影格式站在了同一起跑线上。这对于摄影师、设计师以及需要进行数字存档的机构(如美国国会图书馆,它就推荐使用PNG作为存档格式)来说,是一个意义重大的改进 。
更重要的是,由于APNG等特性早已成为事实标准,各大浏览器(Chrome, Safari, Firefox)和专业软件(Photoshop, DaVinci Resolve)其实早已提供了支持 。因此,这次官方标准的发布,更像是一次“追认”,整个互联网生态的过渡异常平稳,几乎是无缝衔接。用户和开发者甚至在不知不觉中,就已经进入了PNG 3.0的时代。
回到本文最初的问题:GIF还能活多久?
我不知道🤷♀️
从今年W3Techs统计的数据来看(前面有图,这里不发了),GIF还占据着16.8%的市场份额。APNG转正了也不能让GIF一下子灭亡。毕竟前面还有WebP这种格式也是支持动图的,GIF还是活得好好。
从技术角度看,GIF早就该进博物馆了。它只有256色,只有1比特透明,压缩效率低下,文件体积巨大。无论是APNG、WebP还是AVIF,随便一个都能在动图领域把它按在地上摩擦。
但GIF的存活可能已经和技术无关。在大多数人的认知里,“GIF”这个词已经不再特指一种文件格式,而是“网络上的搞笑动图”、“会动的表情包”的代名词。它已经成了一个文化符号,一种互联网通用语言。
在生态方面GIF也有很多盟友,以GIPHY和Tenor为首的巨型GIF搜索引擎,已经深度集成到了全球几乎所有的主流社交媒体和即时通讯应用的输入法里。GIPHY每天有超过5亿的日活用户,每月处理的流量高达2100万次访问 。这个庞大的、触手可及的内容库,以及它所构建的分发网络,形成了一条任何新技术都难以逾越的护城河。
创作GIF的工具手指和脚趾加起来都不够数,比如我常用的「剪映」就支持导出GIF(这里好像可以放个广告位🤔)。
还有一个就是兼容性问题了。做过设计的工友应该知道,有些甲方要求你给的设计稿要兼容N年前的软件版本。PNG 3.0就算兼容得还行也要考虑甲方喜不喜欢。而且有些公司和人都懒得更新软件,作图软件不更新的话是不是就不支持新版PNG图片的制作了?
那么,你觉得GIF还能活多久呢?