什么是 AVIF 格式？
AVIF 是一种相对较新的图像格式，比流行的 JPEG、PNG 和 WebP 格式具有更好的压缩率和质量。AVIF 代表 AV1 图像文件格式，基于开放媒体联盟开发的 AV1 视频编解码器。
AVIF 使用与 AV1 相同的压缩技术，例如帧内预测、变换编码、熵编码和环路滤波，以在不牺牲视觉质量的情况下减小图像文件的大小。AVIF 支持透明度、动画、颜色配置文件和 HDR（与WebP不同）。
AVIF 的主要优点之一是它可以实现比 JPEG 和 PNG 甚至 WebP 高得多的压缩比，同时保持或提高图像质量。
尺寸的减小对开发人员来说意义重大，因为带宽需要花钱 – 相信我们 MajorGeeks 会推送大量带宽（因此在查看我们的页面广告拦截人群时请记住这一点 – 它的价格昂贵。）此外，页面速度对于最终用户体验也很重要以及谷歌搜索算法。如果所有条件都相同，则速度更快的页面可能排名更高。
例如，在我的狗（Titan 和 Loki）的这张图像中，您可以看到巨大的优势，原始照片的 JPG 格式为 9.04 MB，但 AVIF 格式为 706KB。我的眼睛根本看不出任何质量差异。您还可以看到 Windows 10 文件资源管理器尚不支持 AVIF。但您可以想象像 Facebook（支持 AVIF）这样显示数十亿张图像的公司可以节省多少成本。大量的。
AVIF 的另一个好处是它是开放且免版税的，与 HEIC 和 JPEG 2000 等其他图像格式不同。任何人都可以使用和实施 AVIF，无需支付许可费或担心专利问题。AOMedia 是一个由谷歌、微软、Netflix、Facebook、亚马逊、Mozilla 等科技公司和组织组成的联盟。
AVIF 仍然是一种相对较新的格式，尚未得到浏览器和应用程序的广泛支持。然而，Chrome、Firefox 和 Edge 等主要浏览器已经添加或宣布支持 AVIF，预计更多平台也会跟进。
如何创建 AVIF 图像
首先，您需要创建图像或将图像转换为 AVIF 格式。有多种工具和服务可以帮助您完成此任务。您可能熟悉的桌面环境包括：GIMP、 Photoshop、 ImageMagick、 FFMPEG、 irfanview和Zoner Photo Studio X。
如果您正在寻找网络应用程序，请尝试Squoosh。您可以拖放图像、选择输出格式（包括 AVIF）并调整质量设置。Squoosh 还向您展示原始图像和压缩图像的并排比较，以查看文件大小和外观的差异。
UberGeeks 应该看看libavif：一个为 AVIF 图像提供编码和解码功能的库。您可以使用它来创建处理 AVIF 文件的应用程序或脚本。
如何在网页上使用 AVIF
准备好 AVIF 图像后，就可以将它们添加到您的网页了。执行此操作的最佳方法是使用元素，它允许您为图像指定多个源，并让浏览器根据其功能和首选项选择最佳的源。例如：
此代码告诉浏览器首先尝试加载 image.avif 文件（如果它支持 AVIF 格式）。如果没有，它将尝试加载 image.webp 文件（如果它支持 WebP 格式）。如果这两种格式都不支持，它将回退到 image.jpg 文件，即标准 JPEG 图像。
通过使用此技术，您可以确保您的网页加载速度更快，并且对于拥有支持 AVIF 格式的浏览器的用户来说效果更好，同时仍然为不支持 AVIF 格式的用户提供兼容的体验。
但是，在网页中使用 AVIF 格式时，您应该注意一些挑战和限制。
– 浏览器支持：目前，只有少数浏览器原生支持 AVIF 格式，例如 Chrome、Edge、Firefox 和 Opera。其他浏览器可能需要扩展程序或插件才能显示 AVIF 图像。您可以在此处查看浏览器对 AVIF 格式支持的当前状态：https ://caniuse com/avif
– 编码速度：由于压缩算法的复杂性，创建 AVIF 图像可能比创建 JPEG 或 PNG 图像花费更长的时间。如果您需要频繁或动态生成或更新图像，这可能会影响您的工作流程或性能。
– 兼容性：某些图像编辑工具或服务可能尚不支持 AVIF 格式，或者其功能或选项可能有限。这可能会限制您根据需要操作或优化图像的能力，或者您可能需要下载其他应用程序。
总结：AVIF 是一种很有前途的图像格式，与现有格式相比，它为 Web 开发人员提供了许多好处。它可以显着减少网络上图像的文件大小和带宽消耗，同时保留或增强视觉质量。它还可以支持其他格式无法实现或高效的各种功能和用例。鉴于 AVIF 是一种开放且免版税的格式，并且有大量不同的行业参与者支持该格式，因此它很可能很快就会成为一种广泛使用的图像格式。
