今天下午二狗子照常上班摸鱼的时候，突然看到了一则消息，消息说 GIF 的发明人因新冠去世了。作为一个自诩理性的互联网人，二狗子第一反应是看到了一个离谱谣言，可是查看了多方消息后，二狗子难过地发现这是真的。

1.png

斯蒂芬·威尔海特就职于 CompuServe（全球第一家网络服务提供商），当时这家公司想要在网上展现彩色天气图等信息，但因受限于网络带宽而束手无策。斯蒂芬·威尔海特了解一些压缩技术，于是他参与了创造 GIF 格式的工作。在之后的1978 年，CompuServe 公司推出 GIF 格式，诞生了世界上第一张动图。

GIF 全称 Graphics Interchange Format，即图形交换格式，以8位色（即256种颜色）重现真彩色的图像。它有效地减少了图像文件在网络上传输的时间，是目前互联网广泛应用的网络传输图像格式之一。

除去 GIF，目前互联网广泛使用的图像格式还有以下种类：

  • JPEG

  • png

  • WebP


GIF

前面我们也提到了一点关于 GIF 的介绍，作为它最大的，与 JPEG 和 PNG两种格式不同的特点，就是 GIF 是“能动”的。我们通常将 GIF 用于从图像文件创建动画，可以通过在压缩中合并无损质量，无损传输和存储这些文件，并且对图像库的存储影响较小。

GIF 是无损的，采用 GIF 格式保存图片不会降低图片质量。得益于数据的压缩，文件体积小，也是 GIF 格式的优点。此外，它还具有支持动画以及透明背景。

GIF 格式适用于对色彩要求不高同时需要文件体积较小的场景，比如企业 Logo、线框类的图等。因其体积小的特点，现在 GIF 也已经被广泛应用在各类网站中。


JPEG

JPEG 全称 Joint Photographic Expert Group，即联合照片专家组。是由国际标准化组织（ISO）制定的面向连续色调静止图像的一种压缩标准。它是我们常说的 JPG 的正式扩展名，那为什么会出现 JPG 这种说法呢？这是因为 DOS、Windows 95 等早期系统采用的 8.3 命名规则只支持最长 3 字符的扩展名，所以为了兼容性使用了 .jpg 的形式。而后来所有的 apple 旗下机体都不限制扩展名长度，让 JPEG 能够完整出现。不过因为大家已经喜欢了 JPG 的喊法，所以现在 JPG 也依然很流行。

JPEG 图片格式的设计目标，是在不影响人类可分辨的图片质量的前提下，尽可能压缩文件大小。这意味着JPEG 去掉了一部分图片的原始信息，也就是进行了有损压缩。JPEG 的图片的优点，是采用了直接色，得益于更丰富的色彩，JPEG 非常适合用来存储照片，用来表达更生动的图像效果，比如颜色渐变。

然而，JPEG 不适合用来存储企业 Logo、线框类的图。因为有损压缩会导致图片模糊，而直接色的选用，又会导致图片文件体积更大。


PNG

PNG 全称 Portable Network Graphics，即可移植网络图形。是 1994 年由万维网联盟（W3C）的一个工作组开发的，当初的开发目的是为 GIF 格式创建一种现代的、免费的替代方案。

PNG 采用无损压缩算法的位图格式，文件后缀名为 .png。使用的是从 LZ77 派生的无损数据压缩算法，一般应用于 JAVA 程序、网页中，它的压缩比高，生成文件体积小。

PNG 格式是我们在数字设计项目中最常使用的格式，通常比其他格式的文件大小要大。但是它保留了硬性边缘效果，且可以处理大量颜色。另外 PNG 有个比较有趣的特性，那就是支持透明背景，因此大多数网站PNG 格式作为 Logo 。

看到这里相信大家都发现了三者的一点共同点，它们都提到了压缩和损坏，有的是有损的，有的是无损的。难道所有的图片都必须压缩吗？其实是可以不压缩的，比如 BMP 就可以不压缩存储。但是一两张图还可以这么做，如果图片多起来那对于存储和传输就造成了极大的压力。

因此如何在保证图片质量不变的情况下，压缩图片进而节省流量带宽，让传输更快，带来更好的观看体验就变得重要起来。

但是作为传统的图片格式 JPEG，PNG，GIF 等其实已经没有很大的优化空间了，那唯一剩下的道路就是发掘一种新的图片格式，或者压缩格式来解决这个问题，WebP 应运而生。


WebP

WebP 是 Google 于 2010 年提出了一种新的图片压缩格式，目的就是为 Web 上的图片资源提供卓越的有损、无损压缩。在与其他格式同等质量指数下提供更小，更丰富的图片资源，以便资源在 Web 上访问传输。

WebP 图片格式来源于 VP8 视频编解码器，也就是 WebM 视频容器，是 WebM 视频格式的单个压缩框架。VP8 编解码器的一个强大功能就是能够进行帧内压缩，或者更确切地说，能将视频的每个帧都被压缩，再压缩帧与帧之间的差异。

作为专为压缩而推出的格式，WebP 具有以下特性：

  • 有损压缩：有损压缩基于 VP8 关键编码。VP8 是 On2 Technologies 创建的视频格式，是 VP6 和 VP7 格式的后续版本。

  • 无损压缩：采用预测变换，颜色变换，减去绿色，LZ77 反响参考等技术进行压缩。

  • 透明度：8位 Alpha 通道对图形图像很有用。Alpha 通道可以与有损 RGB 一起使用。与其它格式图片所不支持的 WebP 特有的功能。

  • 动画：它支持真彩色动画图像，即可以支持动态图( 类Gif 图)

  • 元数据：它可能具有 EXIF 和 XMP 元数据

  • 颜色配置文件：它可能具有嵌入式 ICC 配置文件。

同时它的效果也是明显的，以 JPEG 作为对比，当 WebP 将 JPEG 压缩到相当于原图 90% 质量时，图片体积可以减少 50% 左右。当 WebP 将 JPEG 压缩到相当于原图 80% 质量时，图片体积则减少了 60%~80%。

2.png

△ JPEG 与 WebP 同图片压缩对比

在 WebP 出现后，它凭借自己优异的图片压缩性能，以及兼备无损和有损两种压缩算法，以及唯一可以对 GIF 进行压缩的特点，迅速在各大网站、App 普及。那要如何才能让图片变成 WebP 格式呢？

最简单的方法就是直接接入云服务的图片处理功能，比如又拍云 WebP 自适应：

3.png

在后台一键开启 WebP 自适应功能，即可通过 CDN 平台智能判断客户端浏览器是否支持 WebP 解码，如果支持则返回 WebP 格式图片，如果不支持则会返回原图，在客户端以及源站无需任何改动。