AVIF vs WebP в WordPress: сравнение качества, сжатия и поддержки

Что такое AVIF и WebP

AVIF (AV1 Image File Format) и WebP – современные форматы растровых изображений, разработанные для снижения веса веб‑страниц без потери визуального качества. Оба формата используют продвинутые алгоритмы сжатия, но различаются по истории, лицензированию и техническим возможностям.

История

• WebP появился в 2010 году как часть проекта Google Chrome, основанного на видеокодеке VP8.
• AVIF вышел в 2019 году, базируется на открытом видеокодеке AV1, разработанном Alliance for Open Media.

Технические характеристики

WebP поддерживает как lossy, так и lossless‑сжатие, а также анимацию и альфа‑канал. AVIF предлагает более эффективное сжатие, поддерживает HDR, 10‑/12‑битные цвета и также lossless‑режим.

Качество изображения и степень сжатия

В реальных тестах AVIF показывает от 30 % до 50 % лучшую степень сжатия при том же визуальном качестве, что и WebP.

Показатели на практике

1. Исходный JPEG – 2 МБ.
2. WebP (80 % качества) – 1,2 МБ (40 % экономия).
3. AVIF (50 % качества) – 0,8 МБ (60 % экономия) при почти идентичном PSNR.

Для WordPress‑сайтов, где каждая сотня килобайт влияет на время до первого байта, переход на AVIF может ускорить загрузку до 0,3 сек.

Поддержка браузеров в 2026 году

К моменту 2026 года поддержка обоих форматов стала практически полной, но есть нюансы.

Desktop

• Chrome + Edge + Opera – полная поддержка AVIF и WebP.
• Firefox – WebP поддерживается с версии 65, AVIF – с версии 93 (≈2022 год).
• Safari – WebP с версии 14, AVIF с версии 16 (2025 год).

Mobile

• Android Browser – оба формата поддерживаются.
• iOS Safari – WebP с iOS 14, AVIF с iOS 16.

Если ваш трафик сильно зависит от старых Safari (10‑12), стоит оставить fallback‑изображения в WebP или JPEG.

Как подключить AVIF/WebP в WordPress

Начиная с WordPress 5.8, ядро умеет генерировать WebP‑версии при загрузке изображений. AVIF поддерживается только через плагины или сторонние инструменты.

Встроенная поддержка

Для WebP достаточно включить add_filter( 'wp_generate_attachment_metadata', 'wp_generate_image_subsizes' ); – WordPress автоматически создаст .webp рядом с оригиналом.

Плагины для AVIF

• AVIF Image Optimizer – конвертирует JPEG/PNG в AVIF при загрузке.
• WebP Converter for Media – добавляет WebP и AVIF, а также задает srcset‑разметку.

Не забывайте о кэшировании: включите объектный кеш (Redis) и настройте заголовки Cache-Control для новых форматов.

Конвертация изображений: инструменты и код

Если вы хотите автоматизировать процесс без плагинов, используйте CLI‑утилиты или небольшую PHP‑функцию.

CLI (cwebp, avifenc)

# Конвертация в WebP
cwebp -q 80 input.jpg -o output.webp
# Конвертация в AVIF
avifenc -j 8 -a cq-level=30 input.png output.avif

PHP‑скрипт с Imagick

function convert_to_avif( $file_path ) {
    if ( ! extension_loaded('imagick') ) return false;
    $img = new Imagick($file_path);
    $img->setImageFormat('avif');
    // 80 % качества (0‑100)
    $img->setImageCompressionQuality(80);
    $new_path = preg_replace('/.(jpe?g|png)$/i', '.avif', $file_path);
    $img->writeImage($new_path);
    $img->clear();
    $img->destroy();
    return $new_path;
}
// Пример использования в hook `add_attachment`
add_action('add_attachment', function($attachment_id){
    $file = get_attached_file($attachment_id);
    convert_to_avif($file);
});

После конвертации добавьте новые файлы в массив wp_get_attachment_image_srcset, чтобы браузер выбирал оптимальный формат.

Практические рекомендации и влияние на скорость

Сокращение веса изображений – один из самых эффективных способов ускорить WordPress‑сайт. AVIF дает дополнительный прирост по сравнению с WebP, но требует более новой инфраструктуры.

Кеширование и сжатие уровня сервера

Для максимального эффекта включите Brotli в Nginx/Apache – он дополнительно сжимает уже сжатые AVIF/WebP без потери качества.

Fallback‑стратегия

1. Проверяйте поддержку формата через picture‑тег с source type="image/avif" и source type="image/webp".
2. Для старых браузеров оставляйте оригинальный JPEG/PNG.
3. Обновляйте .htaccess или nginx.conf, чтобы отдавать правильный MIME‑type.

Не забывайте про HTTPS‑миграцию – многие браузеры блокируют AVIF/WEBP по незащищённому протоколу.

Итоги: AVIF или WebP?

Если ваш сервер поддерживает AVIF‑кодеки и аудитория использует современные браузеры, выбирайте AVIF – он экономит до 60 % трафика при том же визуальном качестве. Для совместимости с более старыми клиентами лучше установить двойной подход: AVIF + WebP + fallback‑JPEG.

Внедрение новых форматов в WordPress требует лишь нескольких строк кода и пару проверенных плагинов, а выигрыш в скорости и SEO окупит затраты уже в первые недели.