JPEG vs PNG vs WebP vs AVIF vs JXL
Cinco formatos, cinco compromisos distintos. Esta guía explica cómo comprime realmente cada uno, dónde falla y cómo elegir sin adivinar.
La versión en una línea
Usa JPEG para fotografías cuando la máxima compatibilidad sea lo importante, WebP como opción moderna y segura por defecto, AVIF cuando quieras el archivo más pequeño posible y PNG siempre que la imagen tenga bordes nítidos, texto o transparencia. Usa JXL cuando quieras un formato moderno de nivel archivo y controles el software que lo abre.
Cómo comprime cada formato
JPEG: el caballo de batalla universal
JPEG es el formato fotográfico por defecto desde 1992, y sigue siendo el que entiende cualquier herramienta, navegador o impresora. Es con pérdida: divide la imagen en bloques, los transforma en datos de frecuencia y después descarta el detalle de alta frecuencia al que tu ojo es menos sensible. Por eso, bajar demasiado la calidad produce los típicos artefactos de bloques y halos alrededor de los bordes.
Puntos fuertes: archivos diminutos para fotos, compatibilidad universal, codificación y decodificación rápidas. Puntos débiles: sin transparencia, rinde mal con bordes nítidos y texto, y se degrada cada vez que la vuelves a guardar. No recomprimas un JPEG una y otra vez.
PNG: sin pérdida, y con orgullo
PNG guarda cada píxel con exactitud. Combina filtros de predicción con DEFLATE, así que comprime bien cuando hay grandes zonas repetidas: colores planos, interfaces, capturas de pantalla, diagramas, logotipos. También admite transparencia alfa completa, algo que JPEG no puede hacer.
Puntos fuertes: salida idéntica al píxel, transparencia, ideal para texto e ilustración lineal. Puntos débiles: las fotografías comprimen muy mal; una foto guardada como PNG puede pesar fácilmente de cinco a diez veces más que esa misma foto en JPEG. Ten en cuenta que la salida PNG es siempre sin pérdida, y por eso es la opción segura cuando no puedes permitirte ninguna pérdida de calidad.
WebP: el término medio pragmático
Google diseñó WebP como una mejora directa sobre JPEG y PNG, y hace los dos trabajos: un modo con pérdida para fotografías y un modo sin pérdida para gráficos, además de transparencia alfa. En la práctica, el WebP con pérdida suele quedar entre un 25 y un 35 % más pequeño que JPEG con una calidad comparable, y hoy lo admiten todos los navegadores actuales.
Puntos fuertes: buen ahorro con un soporte amplio; también gestiona la transparencia en modo con pérdida. Puntos débiles: unas cuantas herramientas antiguas o de nicho todavía no pueden abrirlo, y el WebP sin pérdida no siempre supera a un PNG optimizado.
AVIF: los archivos más pequeños
AVIF se basa en el códec de vídeo AV1 y es el formato más eficiente en uso extendido hoy en día. Frente a JPEG suele producir archivos mucho más pequeños con la misma calidad visual, a menudo cerca de la mitad del tamaño, y además admite transparencia, gama de color amplia y HDR.
Puntos fuertes: la mejor compresión por un margen claro, funciones modernas. Puntos débiles: la codificación es lenta (segundos en lugar de milisegundos por imagen) y los navegadores muy antiguos no pueden mostrarlo. Para un lote de imágenes, es el formato en el que la paciencia rinde más.
JXL: la opción moderna para archivo
JPEG XL (JXL) se diseñó como sucesor de JPEG. Ofrece modos con y sin pérdida, transparencia alfa completa, gama de color amplia, HDR y decodificación progresiva. Con una calidad comparable suele producir archivos más pequeños que JPEG, lo que lo hace atractivo para archivar y para flujos en los que tú controlas el decodificador.
Puntos fuertes: compresión eficiente en un solo formato que puede ser con o sin pérdida, funciones modernas y sin regalías de patentes. Puntos débiles: la codificación es lenta con niveles de esfuerzo altos y la visualización en navegadores sigue siendo desigual: Chrome y Firefox no muestran archivos JXL de forma predeterminada, así que todavía no es un reemplazo seguro de WebP o AVIF en la web abierta. tinyimg puede codificarlo y decodificarlo, pero comprueba antes a quién va dirigido.
Comparación lado a lado
| Formato | Compresión | Transparencia | Mejor para | Ojo con |
|---|---|---|---|---|
| JPEG | Con pérdida | No | Fotos, máxima compatibilidad | Artefactos a baja calidad; se degrada al volver a guardar |
| PNG | Sin pérdida | Sí | Capturas, interfaces, logotipos, texto | Muy pesado para fotografías |
| WebP | Ambos | Sí | Opción moderna de uso general | Alguna que otra laguna en herramientas; el modo sin pérdida rara vez supera a PNG |
| AVIF | Ambos | Sí | Archivos más pequeños, sitios con muchas imágenes | Codificación lenta; requiere un navegador reciente |
| JXL | Ambos | Sí | Archivos, fotos de alta calidad, flujos controlados | Codificación lenta; visualización desigual en navegadores |
Elegir según lo que realmente es la imagen
- Una fotografía (personas, paisajes, productos): AVIF primero si puedes permitirte el tiempo de codificación; si no, WebP. Recurre a JPEG solo cuando una herramienta posterior lo exija.
- Una captura de pantalla o un mockup de interfaz: PNG o WebP sin pérdida. Las líneas nítidas de un píxel y el texto son justo donde los formatos con pérdida emborronan.
- Un logotipo o icono de color plano: PNG o WebP sin pérdida; considera SVG si nació como arte vectorial.
- Una imagen que necesita transparencia: PNG, WebP, AVIF o JXL. JPEG sencillamente no puede.
- Algo ya muy optimizado: déjalo en paz. Volver a codificar un archivo optimizado lo hace más grande con frecuencia.
La respuesta práctica para la web: exporta AVIF y WebP, y sírvelos con un JPEG de reserva mediante <picture>. Los navegadores más nuevos reciben el archivo pequeño y los antiguos siguen viendo la imagen.
Dos reglas que importan más que elegir formato
- Redimensiona antes de comprimir. Servir una foto de 4000 píxeles de ancho en un hueco de 800 píxeles desperdicia muchos más bytes de los que cualquier diferencia de códec puede recuperar. La guía de rendimiento web cubre los presupuestos de tamaño.
- Conserva los originales. Cada guardado con pérdida es irreversible. Comprime copias y trata los archivos comprimidos como resultado de compilación, no como tu archivo maestro.
Pruébalo con tus propios archivos
Como los números dependen mucho de tus imágenes concretas, el único punto de referencia fiable es tu propio conjunto. tinyimg puede comprimir un lote a varios formatos a la vez, para que compares los tamaños lado a lado, y todo se ejecuta en local, así que no se sube nada mientras experimentas.