Как пользоваться
- Перетащите файл .avif в область загрузки, нажмите на неё, чтобы выбрать файл, или вставьте изображение.
- Оставьте в списке «Преобразовать в» значение «Исходный формат». AVIF обычно самый компактный вариант, а перекодировать изображения в AVIF инструмент не умеет.
- Преобразуйте изображение в PNG, JPEG или WebP, только если принимающая сторона не поддерживает AVIF.
- Скопируйте data URI для источника в элементе picture или воспользуйтесь чистым Base64, тегом img, CSS или Markdown.
Что такое AVIF?
AVIF (AV1 Image File Format) хранит изображения, сжатые видеокодеком AV1, в контейнере HEIF. Формат опубликован консорциумом Alliance for Open Media в 2019 году и поддерживает прозрачность, анимацию, 10- и 12-битный цвет, HDR и расширенный цветовой охват. Тип MIME — image/avif.
При одинаковом визуальном качестве файлы AVIF часто заметно меньше JPEG и обычно меньше WebP, особенно при низком битрейте. Поскольку Base64 добавляет к любому файлу одну и ту же треть, меньший AVIF напрямую означает более короткий data URI.
Поддержка в браузерах и запасные варианты
AVIF отображается в Chrome 85 и новее, Firefox 93 и новее, Safari 16 и новее и Edge 121 и новее. Старые браузеры и большинство почтовых клиентов его не показывают. На сайте поместите data URI в элемент <picture> с запасным вариантом:
<picture>
<source type="image/avif" srcset="data:image/avif;base64,...">
<img src="logo.png" alt="Logo" width="120" height="40">
</picture>
Запасной вариант держите отдельным файлом. Если бы он тоже был data URI, каждый посетитель скачивал бы обе версии в составе HTML.
Кодирование и параметры преобразования
Инструмент кодирует ваш файл AVIF в точности как есть. AVIF не входит в число форматов для преобразования (это PNG, JPEG и WebP), поэтому, чтобы создать AVIF из другого формата, используйте специальный кодировщик, например avifenc, Squoosh или графический редактор, а затем закодируйте результат здесь.
Преобразование AVIF в PNG, JPEG или WebP работает в браузерах, которые умеют декодировать AVIF, и пригодится для систем, не принимающих этот формат, но результат обычно получается больше. Если нужны широкая поддержка и малый размер, ближайшая альтернатива — WebP.
Часто задаваемые вопросы
Можно ли здесь преобразовать PNG или JPEG в AVIF?
Нет. Для преобразования доступны только PNG, JPEG и WebP. Сначала создайте файл AVIF в другой программе, а затем перетащите его сюда для кодирования.
Какие браузеры показывают изображения data:image/avif?
Chrome 85+, Firefox 93+, Safari 16+ и Edge 121+. Для старых браузеров добавьте запасной вариант в формате PNG или JPEG в элементе picture.
Почему нет предпросмотра моего изображения AVIF?
Скорее всего, ваш браузер не умеет декодировать AVIF. Результат Base64 всё равно формируется из байтов файла и остаётся корректным; откройте страницу в актуальном браузере, чтобы увидеть предпросмотр.
Base64 для AVIF короче, чем для WebP?
Обычно да, при схожем визуальном качестве. Base64 добавляет к обоим форматам одни и те же 33%, поэтому меньший исходный файл всегда даёт более короткую строку.