Форматы изображений в 2026 году: когда AVIF лучше WebP, а когда нет

Состояние форматов изображений в 2026 году

AVIF достаточно долго называли «форматом будущего», и теперь он уже ощущается как настоящее. В конце 2024 года поддержка в браузерах превысила 95% глобального покрытия, CDN добавили автоматическое транскодирование в AVIF, а большинство инструментов оптимизации изображений теперь поставляют AVIF по умолчанию. WebP тем временем стал безопасным запасным вариантом — повсеместно поддерживаемым, быстрым в кодировании и достаточно хорошим для большинства сценариев.

Вопрос уже не в том, лучше ли AVIF теоретически. Лучше. Вопрос в том, оправдывают ли практические компромиссы — время кодирования, зрелость инструментов, поведение в пограничных случаях — переход именно для вашей нагрузки.

В этой статье мы пройдем по дереву решений. Если вы отдаете тысячи изображений, загруженных пользователями, ответ будет другим, чем если вы вручную настраиваете десяток крупных маркетинговых hero-изображений. Если для вас важна скорость кодирования, ответ снова меняется.

Где AVIF уверенно выигрывает

AVIF использует внутрикадровое сжатие видеокодека AV1, а значит, получает выгоду от многолетней оптимизации для видео. В результате при сопоставимом воспринимаемом качестве файлы стабильно меньше, чем WebP, особенно для фотографического контента.

В повторных тестах на разных наборах изображений файлы AVIF оказываются на 20-30% меньше WebP при том же показателе SSIM. Для фотографий высокого разрешения — товарных снимков, редакционных изображений, всего шире 1200px — эта разница быстро накапливается. WebP размером 2MB превращается в AVIF размером 1.4MB. Умножьте это на сотню изображений на странице, и экономия трафика станет существенной.

AVIF также лучше, чем WebP, справляется с плавными градиентами и низкоконтрастными областями. Наследие WebP от VP8 означает, что он может вносить полосатость в небо, тени и другие тонкие тональные переходы. Более сложное трансформное кодирование AVIF позволяет этого избежать. Если в ваших изображениях много градиентов — дизайн-работы, иллюстрации, закаты, — AVIF будет выглядеть чище при меньшем размере файлов.

Поддержка браузеров теперь достаточно сильна, чтобы AVIF мог быть основным форматом для большинства сайтов. Safari добавил поддержку в версии 16.4 (март 2023 года), и это был последний крупный отсутствующий участник. По состоянию на начало 2026 года глобальная поддержка превышает 95%. Оставшийся пробел — старые Android-устройства и устаревшие корпоративные браузеры, поэтому запасной вариант все еще нужен.

Где WebP все еще имеет смысл

Скорость кодирования — главное практическое ограничение. Кодирование AVIF в 5-10 раз медленнее, чем WebP, в зависимости от настроек качества и реализации кодировщика. Для пользовательского контента — фотографий профиля, вложений на форумах, всего, что загружается в реальном времени, — эта задержка важна. Кодирование WebP, которое занимает 200ms, превращается в 2-секундное кодирование AVIF. Если вы обрабатываете загрузки синхронно, это задержка, заметная пользователю.

Решение — либо кодировать асинхронно (загрузить оригинал, показать placeholder, кодировать в фоне), либо оставить WebP для пользовательского контента и использовать AVIF для курируемых ресурсов, которые вы контролируете. Многие сайты делают и то и другое: AVIF для маркетинговых изображений, WebP для пользовательских загрузок.

У WebP также выше зрелость инструментов. Каждая библиотека изображений, CMS-плагин и CDN поддерживают WebP уже много лет. Поддержка AVIF догоняет, но пограничные случаи все еще есть. Некоторые старые сборки ImageMagick создают AVIF низкого качества. Некоторые CDN берут дополнительную плату за транскодирование в AVIF. Если вы работаете в ограниченной среде — устаревшая CMS, небольшой бюджет, сжатые сроки, — WebP остается путем наименьшего сопротивления.

Наконец, WebP почти всегда меньше JPEG, а кодирование достаточно быстрое для использования в реальном времени. Если ваша текущая базовая точка — JPEG и вы еще не перешли на современные форматы, WebP будет более безопасным первым шагом. AVIF всегда можно добавить позже как прогрессивное улучшение.

Практическое дерево решений

Вот как выбрать:

• Курируемые маркетинговые изображения, hero-изображения, редакционные фотографии: используйте AVIF как основной формат, WebP — как первый запасной вариант, а JPEG — как финальный запасной вариант. Экономия размера файлов оправдывает стоимость кодирования, и вы контролируете pipeline.
• Пользовательский контент, загружаемый в реальном времени: используйте WebP. Скорость кодирования важнее последних 20% эффективности сжатия, и вы не можете позволить себе многосекундные задержки.
• Иллюстрации, графика с плоскими цветами, скриншоты: AVIF лучше WebP, но PNG часто конкурентоспособен для простой графики с большими однотонными областями. Тестируйте оба варианта. Если ваш PNG уже небольшой и хорошо сжимается, миграция формата может не стоить усилий.
• Миниатюры и небольшие изображения: WebP обычно достаточно. Абсолютная экономия байтов от AVIF невелика (WebP размером 10KB становится AVIF размером 8KB), а скорость кодирования важнее при большом масштабе.
• Критически важна поддержка старых браузеров: оставьте WebP основным современным форматом. Покрытие AVIF в 95% отлично, но если вы обслуживаете аудиторию со старыми устройствами или корпоративными средами, почти универсальная поддержка WebP безопаснее.

Если вы не уверены, самый безопасный паттерн — отдавать AVIF браузерам, которые его поддерживают, с запасным WebP и финальным запасным JPEG. Элемент <picture> делает это простым:

<picture>
  <source srcset="image.avif" type="image/avif">
  <source srcset="image.webp" type="image/webp">
  <img src="image.jpg" alt="Description">
</picture>

Этот подход дает лучшее из обоих миров: максимальное сжатие для современных браузеров и безопасные запасные варианты для старых.

Настройки кодирования, которые важны

Если вы переходите на AVIF, настройки кодирования сильнее влияют на качество результата, чем в случае с WebP. Гибкость AVIF означает, что существует больше способов получить плохой результат.

Две наиболее важные настройки — качество и скорость. С качеством все просто: более высокие значения означают более приятные изображения и более крупные файлы. Для AVIF значение качества 75-85 обычно является оптимальным диапазоном для фотографического контента. Ниже 70 начинают появляться заметные артефакты. Выше 90 размеры файлов резко растут без значимого прироста качества.

Скорость управляет тем, сколько времени кодировщик тратит на оптимизацию результата. Более медленное кодирование дает меньшие файлы, но отдача быстро снижается. Большинство кодировщиков используют шкалу 0-10, где 0 — самое медленное, а 10 — самое быстрое. Значение скорости 6-8 — хороший компромисс: кодирование достаточно быстрое для пакетной обработки, а размеры файлов находятся в пределах 10-15% от теоретического минимума.

Если вы кодируете AVIF на сервере, используйте свежую версию libavif или avifenc. Старые кодировщики (до 2024 года) дают заметно худший результат при том же размере файла. Формат все еще развивается, и улучшения кодировщиков были существенными.

А что насчет JPEG XL?

JPEG XL технически превосходит и AVIF, и WebP. Он лучше сжимает, быстрее кодирует, поддерживает сжатие без потерь и работает с более широким диапазоном типов изображений. Но это также мертвый формат.

Google удалил поддержку JPEG XL из Chrome в 2022 году, сославшись на низкое внедрение и сложность. Apple так и не добавила поддержку. По состоянию на 2026 год JPEG XL поддерживается только в Firefox и Safari Technology Preview, а значит, он не пригоден для production-использования. Если поставщики браузеров не изменят курс — что маловероятно, — JPEG XL останется форматом для энтузиастов и архивных workflows, а не для веба.

Путь миграции

Если вы переходите с JPEG на современные форматы, самый безопасный путь такой:

1. Проведите аудит текущего pipeline изображений. Определите, откуда приходят изображения (CMS, пользовательские загрузки, CDN), как они обрабатываются и какие форматы вы сейчас отдаете. Почему обработка изображений в браузере — плюс для приватности разбирает некоторые компромиссы, связанные с тем, где происходит обработка изображений.
2. Начните с WebP. Он быстро кодируется, широко поддерживается и сразу уменьшает размеры файлов. Это первый шаг с низким риском.
3. Добавьте AVIF для курируемого контента. Когда WebP заработает надежно, добавьте AVIF для ценных изображений, где размер файла особенно важен. Проверьте время кодирования и убедитесь, что ваш CDN или сервис изображений поддерживает этот формат.
4. Следите за поддержкой браузеров. Сейчас покрытие AVIF отличное, но если аналитика показывает заметную долю пользователей на старых браузерах, оставьте WebP основным форматом.
5. Измерьте эффект. Используйте real user monitoring, чтобы отслеживать время загрузки страниц и Largest Contentful Paint до и после миграции. Как читать отчет Lighthouse без паники — полезное руководство по интерпретации метрик производительности.

Цель не в том, чтобы использовать самый новый формат просто потому, что он новый. Цель — отдавать меньшие изображения без потери качества, улучшая скорость страниц и снижая расходы на трафик. AVIF делает это лучше WebP в большинстве случаев, но практические ограничения — скорость кодирования, инструменты, поддержка браузеров — означают, что WebP все еще остается правильным выбором для некоторых нагрузок.

Главное

• AVIF на 20-30% меньше WebP при сопоставимом качестве, особенно для фотографического контента и изображений с градиентами.
• Кодирование AVIF в 5-10 раз медленнее WebP, что делает его непрактичным для пользовательских загрузок в реальном времени, если вы не кодируете асинхронно.
• Поддержка AVIF в браузерах превышает 95% глобально, но почти универсальная поддержка WebP делает его более безопасным запасным вариантом.
• Для курируемых маркетинговых изображений используйте AVIF как основной формат с запасными WebP и JPEG. Для пользовательского контента придерживайтесь WebP.
• JPEG XL технически превосходит альтернативы, но не имеет жизнеспособной поддержки в браузерах и не должен использоваться на production-сайтах.

FAQ

Q: Можно ли отдавать AVIF без запасного варианта?

A: Пока нет. Поддержка AVIF превышает 95%, но это все еще оставляет миллионы пользователей на старых браузерах. Всегда добавляйте запасной WebP или JPEG с помощью элемента <picture>. Браузер автоматически выберет лучший формат из поддерживаемых.

Q: Поддерживает ли AVIF прозрачность?

A: Да. AVIF поддерживает альфа-канал, что делает его жизнеспособной заменой PNG в случаях, когда нужна прозрачность. Размеры файлов обычно меньше, чем у PNG, хотя кодирование медленнее.

Q: Нужно ли перекодировать все существующие изображения в AVIF?

A: Только если экономия трафика оправдывает усилия. Начните со страниц с высоким трафиком и крупных изображений, где эффект наиболее заметен. Для страниц с низким трафиком или небольших изображений ROI минимален. Сначала сосредоточьтесь на новом контенте, затем выборочно заполните старый.

Q: Какой лучший инструмент для пакетного кодирования AVIF?

A: avifenc (часть libavif) — самый широко используемый инструмент командной строки. Среди GUI-инструментов AVIF поддерживают Squoosh (веб-инструмент) и ImageOptim (Mac). Большинство современных CDN и сервисов изображений (Cloudflare, Cloudinary, imgix) могут автоматически транскодировать в AVIF.

Q: Работает ли AVIF с responsive images и srcset?

A: Да. Используйте элемент <picture> с несколькими элементами <source> для запасных форматов и srcset внутри каждого <source> для responsive-размеров. Браузер выберет лучший формат и размер с учетом поддержки и ширины viewport.

<!-- tool-cta:start -->

💡 Попробуйте это: Сравните два формата на своих собственных ресурсах с помощью Image Converter, который может выводить как AVIF, так и WebP, чтобы вы могли измерить реальный размер и качество.

<!-- tool-cta:end -->

Источники

• AVIF vs WebP: A Comprehensive Comparison — Подробный анализ эффективности сжатия и настроек качества для разных типов изображений.
• Can I use AVIF? — Актуальные данные о поддержке формата изображений AVIF в браузерах.
• libavif GitHub repository — Эталонная реализация кодировщика и документация по AVIF.
• Web Almanac: Images — Ежегодный отчет о внедрении форматов изображений и производительности в вебе.