AVIF — формат для изображений в интернете
Что произошло? На различные видеокодеки есть авторские права. Такие права предусматривают использования кодеков на платной основе. К примеру, с 1 устройства — 1 доллар. Такой подход не устраивал крупные корпорации. Итого был создан альянс, в который вошли такие компании как Apple, Intel, Google, Microsoft, Arm, AMD, Nvidia, Amazon, Facebook, Cisco, Netflix, Mozilla.
В результате альянс Alliance for Open Media создал формат AOMedia Video 1, или кратко — AV1. Применяемые технологии решили использовать и для изображений. Так появился формат AV1 Still Image File, или коротко — AVIF. Данный формат изображений является свободным форматом сжатия изображений с потерями качества, основанный на библиотеке для сжатия кадров AV1.
Спецификация AVIF получила версию 1.0.
Чем AVIF лучше других форматов? Преимущества по сжатию такие:
В среднем AVIF сжимает большую часть изображений значительно лучше. Пример данных, полученных на основе тестирования — AVIF test. В обновленном браузере Chrome формат AVIF уже по умолчанию поддерживается. Оптимизацию можно делать уже сейчас.
Какие браузеры поддерживают формат AVIF? Список браузеров, который поддерживают формат — AVIF. Пока только Chrome. Но доля на рынке у браузера самая большая, а также поддержка появится в Firefox.
Зачем внедрять AVIF? Цели:
Как внедрить на сайте?
Вариантов по внедрению множество.
Способ 1. Наилучшее решение заключается в настройках веб-сервера. В таком варианте нет надобности даже менять верстку на страницах сайта. Разметка на сайте не изменяется.
При правильной конфигурации сервера данный участок на сайте изменять не надо.
Также внедрять следует используя прогрессивный метод. Что конкретно имеется ввиду? Принцип действия:
Как реализовать такое решение на сайте? Решение в виде автоматической пакетной обработки следует имплементировать на стороне сервера. Вариант с использованием NGINX в примере.
Внедрением подобных решений занимаются технические специалисты. Задача оптимизатора заключается в правильной постановке цели.
Способ 2. Использовать тег "picture".
При использовании такой разметки браузер загрузит первое изображение, которое поддерживает. Если браузер не поддерживает picture, то указан img по умолчанию.
Что делать, есть нет возможности для имплементации решения на стороне сервера?
Способ 3. Если контента на сайте мало, есть вариант использовать конвертер изображений.
Теперь Squoosh поддерживает и формат AVIF. Инструмент предоставляет возможность оптимизации изображений. Разработкой занимался Google.
AVIF — замена WebP, JPG и PNG. Формат использует технология для сжатия нового кодека AV1 и контейнер HEIF с поддержкой анимации, live фото. Доступны анимация и прозрачность. Если использовать AV1 AVIF-файлы, то изображения будут меньше в 2 раза в сравнении с JPG, и на 30% в сравнении с WEBP.
Компания AVSEO держит руку на пульсе всех новостей и новинок поисковой оптимизации и продвижения в интернете, чтобы с легкостью вывести Ваш сайт в топ Google.