WordPress 6.5 将支持 AVIF 格式的图片

WordPress 6.5 将支持 AVIF 图片，这是一种现代图像格式，与以前的格式（如 JPEG、PNG 甚至 WebP）相比，它在图像质量和压缩方面有了显着改进。AVIF 图像比 JPEG 小最多 50%，同时保持相同的图像质量。AVIF 图像还支持多种颜色（包括 HDR），并且生成比 JPEG 更清晰的图像，尤其是在细节丰富的区域。

从 WordPress 版本 6.5 开始，您可以在 WordPress 中上传和使用 AVIF 图像，就像现在使用 JPEG 或 PNG 图像一样 – 只要您的托管服务支持 AVIF。将图像切换为 AVIF 格式可能会提高网站的性能和网站访问者的体验。

AVIF 图片的好处

AVIF 图像比 JPEG 图像小得多，因此页面加载速度更快，传输所需的带宽更少。AVIF 图像仍然享有 WordPress 默认添加的响应式图像、获取优先级和延迟加载的所有优点。最后，所有主要浏览器都支持AVIF，因此大多数网站现在就可以开始使用它们。

创建 AVIF 图像

许多图像编辑工具都支持导出为 AVIF。您还可以使用命令行转换工具或基于 Web 的工具，例如Squoosh。将图像保存为 AVIF 后，将它们上传到 WordPress 并像使用任何其他图像一样使用它们。WordPress 还可以自动为您创建 AVIF，请参阅下面的常见问题解答项。

在 WordPress 中使用 AVIF 图像

AVIF 图像的工作方式与 WordPress 中的任何其他图像格式类似，但有一些重要注意事项：

WordPress 中的 AVIF 取决于 Web 服务器图像处理库的支持（WordPress 内置了对Imagick和LibGD图像处理的支持）。您可以通过访问“工具”->“站点运行状况”，单击“信息”选项卡并展开“媒体处理”部分，最后在支持的格式列表中查找“AVIF”来检查wp-admin中是否支持 AVIF。

如果您的受众群体中有大量使用不受支持的浏览器的用户，请避免使用 AVIF 图像，或将浏览器polyfill脚本引入。

常问问题

如何调整生成的 AVIF 图像的压缩级别？

`wp_editor_set_quality`过滤器可用于设置质量设置。传入的mime类型可以按类型设置，例如：

// Use a quality setting of 75 for AVIF images.
function filter_avif_quality( $quality, $mime_type ) {
if ( 'image/avif' === $mime_type ) {
return 75;
}
return $quality;
}
add_filter( 'wp_editor_set_quality', 'filter_avif_quality', 10, 2 );

如何输出无损 AVIF 图像？

使用 100 的压缩级别会将 AVIF 设置为无损模式。

当我上传 JPEG 时，WordPress 可以创建 AVIF 图像吗？

是的。开发人员可以使用image_editor_output_format过滤器来指定这种类型的上传转换。以下是例子：

// Output AVIFs for uploaded JPEGs
function filter_image_editor_output_format( $formats ) {
$formats['image/jpg'] = 'image/avif';
return $formats;
}
add_filter( 'image_editor_output_format', 'filter_image_editor_output_format' );

如果我使用 WordPress 多站点，我的所有站点都可以使用 AVIF 图像吗？

否。多站点存储创建站点时允许用户上传的文件类型。我们仍在#53167中努力改进这一点。同时，为了确保网络上的所有现有站点都允许 AVIF 文件，您可以通过必要插件 mu-plugins 的方式使用 site_option 过滤器将 avif 添加到所有网络站点允许的文件类型中：

// Ensure all network sites include AVIF support.
function filter_site_option_upload_filetypes( $filetypes ) {
$filetypes = explode( ' ', $filetypes );
if ( ! in_array( 'avif', $filetypes, true ) ) {
$filetypes[] = 'avif';
}
return implode( ' ', $filetypes );
}
add_filter( 'site_option_upload_filetypes', 'filter_site_option_upload_filetypes' );

WordPress