Los dos tipos de compresión
La **compresión sin pérdida** reduce el tamaño del archivo sin descartar ningún dato: la imagen original se puede reconstruir exactamente. Se usa en capturas de pantalla, logotipos e imágenes con texto.
La **compresión con pérdida** descarta datos de forma permanente, normalmente detalle fino en las transiciones de color, para conseguir archivos más pequeños. Una vez aplicada, lo descartado no vuelve. Se usa en fotografías e imágenes complejas.
JPEG / JPG
**Tipo:** con pérdida **Ideal para:** fotografías y escenas complejas con transiciones de color suaves
JPEG es el formato fotográfico estándar de la web desde los años noventa. Su algoritmo divide la imagen en bloques de 8×8 píxeles, convierte los colores de RGB a otro espacio de color (YCbCr) que separa el brillo del color y descarta el detalle cromático al que la vista humana es menos sensible.
La calidad suele ir de 1 a 100, y entre 60 y 80 está el equilibrio para la web. Por debajo de 60 empiezan a verse los bloques, ese aspecto inconfundible de "imagen muy comprimida". La misma imagen con calidad 80 (unos 100 o 200 KB) y con calidad 95 (entre 500 y 800 KB) le parece prácticamente idéntica a casi todo el mundo.
**Limitaciones:** no admite transparencia. Y cada vez que lo vuelves a guardar se recomprime y pierde más datos: nunca regrabes un JPEG si vas a seguir editándolo.
PNG
**Tipo:** sin pérdida **Ideal para:** capturas de pantalla, elementos de interfaz, logotipos, imágenes con bordes nítidos y texto, y todo lo que necesite transparencia
PNG usa compresión DEFLATE (parecida a la de un ZIP), que no pierde información. Es perfecto para imágenes con grandes zonas de color plano, contrastes marcados o transparencia (canal alfa).
En cambio, es mala elección para fotografías: un JPEG de buena calidad de la misma foto suele pesar entre 5 y 10 veces menos. Pero para una captura con texto y elementos de interfaz, el PNG será más pequeño que un JPEG y se verá mejor, sin artefactos en los bordes nítidos.
**PNG-8 frente a PNG-24:** el PNG-8 usa una paleta de hasta 256 colores (como el GIF), lo que lo hace mucho más ligero pero limitado. El PNG-24 admite millones de colores y es el estándar.
WebP
**Tipo:** tiene variante con pérdida y sin pérdida **Ideal para:** sustituir al JPEG en fotografías (con pérdida) o al PNG en gráficos (sin pérdida) dentro de la web
Desarrollado por Google, WebP produce archivos entre un 25 % y un 34 % más pequeños que JPEG con la misma calidad visual, y un 26 % más pequeños que PNG en compresión sin pérdida. Admite transparencia en los dos modos.
Hoy lo admiten todos los navegadores (desde 2020). Lo único que hay que valorar es si necesitas dar soporte a IE11, que no lo admite, o si vas a servir las imágenes a aplicaciones nativas que quizá no lo manejen.
AVIF
**Tipo:** tiene variante con pérdida y sin pérdida **Ideal para:** exprimir al máximo la compresión cuando no necesitas compatibilidad universal
AVIF (AV1 Image File Format) es el formato importante más reciente y deriva del códec de vídeo AV1. Suele producir archivos un 50 % más pequeños que JPEG con la misma calidad, y admite alto rango dinámico, gama de color amplia y transparencia.
La contrapartida: codificar en AVIF cuesta mucho cálculo (es lento de generar) y la compatibilidad de los navegadores es buena pero no total. Es el mejor formato en cuanto a peso, aunque puede que no compense la complejidad técnica en todos los proyectos.
GIF
**Tipo:** sin pérdida, pero limitado a 256 colores **Ideal para:** solo animaciones sencillas
Para imágenes fijas, el GIF es siempre la elección equivocada a estas alturas: un PNG o un WebP pesarán menos y se verán mejor. Su único uso legítimo son las animaciones simples, y hasta ahí un vídeo corto en bucle (WebM o MP4) suele pesar menos y verse mejor.
SVG
**Tipo:** vectorial, no de mapa de bits **Ideal para:** logotipos, iconos e ilustraciones que tengan que escalar a cualquier tamaño
Los archivos SVG son texto XML que describe formas matemáticamente, así que escalan a la perfección sin perder calidad. Para un logotipo que aparece a 32 px en el móvil y a 500 px en la cabecera de escritorio, un único SVG funciona perfectamente. No sirve para fotografías.
Guía rápida para decidir
- **¿Una fotografía para la web?** → WebP (con JPEG de respaldo para navegadores antiguos)
- **¿Fondo transparente?** → WebP o PNG
- **¿Un logotipo o un icono?** → SVG si es posible, y si no, PNG
- **¿Una captura o una interfaz?** → PNG
- **¿Una animación sencilla?** → WebP animado o MP4
- **¿Máxima compresión y público moderno?** → AVIF
El compresor de imágenes de NoxaKit reduce el peso de JPEG y PNG en el navegador sin subir tus imágenes a ningún servidor. El conversor de formatos se encarga en local de WebP, PNG, JPEG y el resto de conversiones.