AVIF: el formato de imagen del futuro — qué es y cómo usarlo
AVIF (AV1 Image File Format) es el formato de imagen derivado del códec de vídeo AV1. Ofrece la mejor compresión disponible actualmente, superando a WebP y JPEG por un margen significativo. Pero su adopción aún está en curso.
¿Qué es AVIF?
AVIF usa el compresor de vídeo AV1 (desarrollado por Alliance for Open Media, que incluye Google, Apple, Netflix, Amazon, Microsoft) aplicado a imágenes estáticas. El resultado:
- 50% menos tamaño que JPEG a calidad visual equivalente
- ~20% menos tamaño que WebP
- Soporte para hasta 12-bit por canal de profundidad de color (HDR)
- Canal alfa (transparencia) completo
- Soporte para colores P3 y BT.2020 (amplia gama de colores)
- Modo lossless y lossy
AVIF vs WebP vs JPEG — comparativa
| Aspecto | JPEG | WebP | AVIF |
|---|---|---|---|
| Tamaño relativo | 100% | ~65% | ~45% |
| Calidad a igual tamaño | Referencia | Mejor | Mejor aún |
| Transparencia | No | Sí | Sí |
| HDR / Wide Color | No | No | Sí |
| Profundidad de color | 8-bit | 8-bit | 10-bit / 12-bit |
| Compatibilidad (2024) | Universal | Muy buena | Buena (creciendo) |
| Encoding speed | Rápido | Rápido | Lento |
Compatibilidad actual (2024)
| Navegador | Soporte AVIF |
|---|---|
| Chrome 85+ | ✅ |
| Firefox 93+ | ✅ |
| Safari 16+ | ✅ |
| Edge 121+ | ✅ |
| Opera 71+ | ✅ |
| iOS 16+ (Safari) | ✅ |
| Android 12+ | ✅ |
| Internet Explorer | ❌ |
La cobertura global de navegadores es ya >90% a finales de 2024. AVIF es seguro para producción con fallback apropiado.
Cómo implementar AVIF en web con fallback
<picture>
<!-- AVIF para navegadores compatibles -->
<source srcset="imagen.avif" type="image/avif">
<!-- WebP para navegadores sin AVIF pero con WebP -->
<source srcset="imagen.webp" type="video/webp">
<!-- JPEG como fallback universal -->
<img src="imagen.jpg" alt="Descripción" width="800" height="600">
</picture>
El elemento <picture> permite al navegador elegir el formato que soporta. Siempre incluye el fallback JPEG.
Cómo convertir imágenes a AVIF
Con avifenc (herramienta oficial de Alliance for Open Media)
# Instalar en Linux
sudo apt install libavif-bin # Ubuntu 22.04+
# Instalar en macOS
brew install libavif
# Convertir PNG a AVIF (calidad 0-100, defecto 60)
avifenc --quality 60 imagen.png imagen.avif
# JPEG a AVIF con alta calidad
avifenc --quality 80 --jobs all foto.jpg foto.avif
# Con profundidad de color 10-bit
avifenc --depth 10 --quality 70 imagen.png imagen_10bit.avif
Con FFmpeg
# FFmpeg con codec libaom-av1
ffmpeg -i imagen.jpg -c:v libaom-av1 -crf 30 -b:v 0 imagen.avif
# Con calidad específica para AVIF (menor crf = mayor calidad)
ffmpeg -i foto.png -c:v libaom-av1 -crf 23 -b:v 0 foto.avif
Con Squoosh (online, Google)
Squoosh.app de Google permite convertir a AVIF directamente en el navegador con control de calidad visual en tiempo real. Ideal para comparar visualmente la calidad antes de decidir el nivel de compresión.
Con ImageMagick (requiere versión reciente con soporte AVIF)
# Verificar soporte AVIF
magick identify -list format | grep AVIF
# Convertir
magick imagen.jpg imagen.avif
magick -quality 80 imagen.png imagen.avif
Velocidad de codificación: el principal inconveniente
AVIF tiene un problema: el encoding es muy lento comparado con JPEG y WebP.
| Formato | Tiempo de encoding aprox. (imagen 4K) |
|---|---|
| JPEG | < 0,1 segundos |
| WebP | 0,1–0,5 segundos |
| AVIF | 5–60 segundos |
Para sitios web con miles de imágenes, el tiempo de codificación es un factor importante. Soluciones:
- Usa
--jobs allen avifenc para codificación paralela - Genera AVIF offline (no en tiempo real)
- Considera un CDN que convierta a AVIF dinámicamente (Cloudflare Images, Cloudinary)
Cuándo usar AVIF en 2024
Úsalo en:
- Sitios web donde la velocidad de carga es crítica
- E-commerce con muchas fotos de productos
- Galerías fotográficas de alta calidad
- Imágenes con contenido HDR o gama amplia de colores
- Cualquier sitio donde los usuarios principales usen Chrome, Firefox o Safari moderno
Con cautela:
- Si necesitas compatibilidad con navegadores muy antiguos (siempre usa
<picture>con fallback) - Si el tiempo de encoding es limitante — considera WebP como alternativa más rápida de generar
AVIF representa claramente el futuro de las imágenes en web. Con más del 90% de cobertura de navegadores a finales de 2024, su adopción en producción está plenamente justificada.
Conversiones relacionadas
Lo más habitual al trabajar con imágenes son estas direcciones de conversión: