如何选择 WordPress 网页中的图片格式？

在现代化网站中，应该尽量抛弃 JPG 或 PNG 等使用旧技术的图片格式，而应该采用 WebP 或 AVIF 这样通过先进算法压缩的新型图片格式。 因为大部分网页不可避免的会使用图片，而图片的体积会严重影响网页加载速度。

抛弃旧格式

JPEG（JPG）和 PNG 是两种常见的图像格式，但它们已经过时！

JPEG 是一种有损压缩格式，适用于照片和复杂图像。但 JPEG 图像通过丢弃图像中的一些细节和颜色信息来减小文件大小，这可能会导致图像失真或出现压缩伪影，尤其是在高压缩率下。如果要保持图片画质，会导致文件体积较大。

PNG 是一种无损压缩格式，适用于包含文本、图标和简单图形的图像且支持透明背景，它可以保持图像的精确细节和颜色，但通常会导致文件大小较大。

在以前新技术并未普及时，那时候大部分浏览器尚不支持（WebP 或 AVIF ）的前提下，为了保证兼容性所以 JPG 与 PNG 成为网页图片格式的首选，但今天的情况已经发生彻底改变。除了像 IE 这样已被淘汰的古董之外，主流浏览器均已支持新的图片格式。

正因如此，是时候抛弃它们了。

Web 与 AVIF 谁更强

压缩效率

WebP 具有很高的压缩效率，通常比 JPEG 和 PNG 有更小的文件大小（包括无损模式），但在一些情况下可能略逊于 AVIF。

AVIF 使用先进的编码技术，如基于树状二叉编码（Entropy Coding）的 AV1 视频编码器，以及用于图像压缩的可变分辨率编码（Variable Resolution Coding）等技术，因此在相同图像质量下，AVIF 文件通常更小，但比 WebP 的优势并不太大。

图像质量

AVIF 支持高保真图像，并且通常可以在相同文件大小下保持更高的图像质量。这得益于 AV1 编码器的先进压缩技术，能够更好地保留图像细节和色彩信息。还支持更广泛的颜色深度和范围，包括标准动态范围（SDR）、高动态范围（HDR）和广色域等，因此可以呈现更丰富和更准确的颜色。

透明背景

AVIF 与 WebP 都支持 alpha 通道，因此可以存储半透明图像和图像元素，使其在网页和应用程序中具有更好的叠加效果。

动画支持

WebP 格式支持动画，通过将多个图像帧编码为一个 WebP 文件，可以创建动画图像序列。尽管 AVIF 主要用于静态图像，但它也支持包含动画的图像序列。

浏览器支持情况

因 AVIF 采用的技术更先进，所以仅新版本的浏览器支持它。WebP 已经流行了好一段时间了，在浏览器兼容方面比 AVIF 更广泛。但 AVIF 系出名门，由于 AVIF 由影视专家组（MPEG）和 JPEG 工作组（JPEG）制定，因此在未来可能会成为更广泛的标准。

目前主流的 Web 浏览器新发布的版本（如 Chrome、Firefox、Edge 等）和许多图片编辑软件都已支持 AVIF ，WordPress 从 6.5 版开始正式支持 AVIF 格式的图片。

WordPress 网页如何选择？

在比较 WebP 和 AVIF 时，很难说哪一个“更强”，因为在当下它们各有优点和适用场景，随着旧版浏览器使用者更少时，AVIF 会更具有优势。

现在具体而言，对于比较激进追求新技术的网站而言，AVIF 是一个不错的选择，但架不住还有很多用户可能在使用一些旧版本的 WEB 浏览器，保守一些选择 WebP 也无不可。WordPress 的主流插件对 WebP 的支持也更普遍，例如：Wp Smush Pro 图片优化插件等。

注：如果要在 WordPress 网页中使用 AVIF 格式，必须使用 WordPress 6.5 或以上版本。

本站是一个技术型的博客网站，对图片的要求并不高，所以依旧使用 WebP 格式，但也许一段时间后，会改变这个态度。