Formatos de archivo
Cómo comprimir una imagen sin perder calidad (y por qué es un problema distinto)
Comprimir un PNG no es como comprimir un JPG. El intercambio es distinto, y para algunas imágenes no hay intercambio en absoluto.
Hay una pregunta que aparece cada vez que alguien intenta reducir un PNG, y es la pregunta equivocada: "¿cómo comprimo esto sin perder calidad?" Para la mitad de los PNG que hay en la web, la respuesta es que la pregunta está mal planteada, porque el PNG en sí es el problema.
Los dos tipos de PNG
Un PNG de una fotografía. Una foto tiene tono continuo, degradados suaves y casi ninguna repetición. El PNG es sin pérdidas, así que guarda cada píxel exactamente. No hay nada que comprimir salvo la repetición, y una fotografía tiene casi ninguna. El archivo es enorme, entre 5 y 10 veces el tamaño de la misma imagen en JPG, y cada byte de eso es desperdicio.
Un PNG de un gráfico. Una captura de pantalla, un logotipo, un diagrama, un gráfico, un trozo de interfaz. Bordes nítidos, zonas planas de color, texto. El PNG es exactamente el formato correcto para esto, y el archivo es pequeño porque el formato es eficiente precisamente con este tipo de imagen.
En el primer caso el problema es el formato, no la compresión. Ninguna compresión sin pérdidas convertirá un PNG de 3 MB en un archivo de 40 KB. La solución es convertirlo a JPG o a WebP, que descartan el detalle que el ojo no nota bien y encogen el archivo en un 90%.
Qué hace realmente la compresión sin pérdidas
Un archivo PNG ya está comprimido. La compresión es sin pérdidas y es buena en su trabajo. Sacarle más significa encontrar las pequeñas ineficiencias que el codificador original dejó atrás.
Los números honestos:
- Entre un 10% y un 30% más pequeño, y ese es el techo para la mayoría de los archivos.
- A veces nada en absoluto. Un PNG que ya se guardó bien no tiene holgura que encontrar.
- Los píxeles son idénticos antes y después. No se pierde nada, porque no se descarta nada.
Así que "comprimir un PNG sin perder calidad" es una operación real y un resultado real, pero el resultado es una reducción del 20% en un archivo que puede ser cinco veces demasiado grande para empezar. Merece la pena hacerlo. No es la respuesta que la gente busca.
La palanca real: reducir la paleta de colores
Para gráficos sencillos - iconos, logotipos, diagramas, capturas de interfaces planas - la mejora grande no es una compresión mejor. Es menos colores.
Un PNG de un icono de 16 colores guardado como RGB de 24 bits tiene 16 millones de colores posibles y usa 3 bytes por píxel. Guardado como paleta de 8 bits, tiene 256 colores posibles y usa 1 byte por píxel. El archivo es aproximadamente un tercio del tamaño, y la imagen es idéntica, porque nunca tuvo más de 16 colores.
El truco es que esto solo funciona con imágenes que genuinamente tienen pocos colores. Una fotografía tiene millones; reducirla a 256 colores la convierte en un poster. Un logotipo con degradado tiene cientos; reducirlo a 256 está bien. Una captura de una página web tiene decenas; reducirla a 256 es gratis.
La regla: reduce la paleta de colores en los gráficos, nunca en las fotografías.
Qué significa "calidad" para un PNG
Para un JPG, la calidad es un ajuste: 85%, 70%, 50%. Menos calidad, archivo más pequeño, más pérdida. Todo el mundo entiende el intercambio.
Para un PNG no hay un ajuste de calidad en el mismo sentido, porque no hay pérdida que intercambiar. Lo que puedes intercambiar es:
- La paleta de colores (arriba) - con pérdidas en el sentido de que se fusionan colores, pero invisible si la imagen era sencilla.
- La precisión del alfa - un canal alfa de 24 bits es más suave que uno de 8 bits, y cuesta unos cuantos kilobytes más.
- El entrelazado - hace que la imagen cargue progresivamente, a costa de tamaño.
- Los metadatos - EXIF, perfiles ICC y el resto pueden añadir decenas de kilobytes a un archivo pequeño.
Los dos primeros son los que merecen pensarse. Los dos últimos suelen ser mejoras gratuitas.
Qué hace la herramienta
La herramienta para comprimir imágenes te muestra el tamaño antes y después lado a lado, para que veas lo que ganaste antes de descargar. Eso importa porque la ganancia varía enormemente según la imagen: un PNG de una interfaz plana puede bajar un 40%, y un PNG de una fotografía puede bajar un 5%.
También tiene una opción de ancho máximo, que redimensiona mientras comprime. Eso suele ser la mejora mayor que la compresión en sí: una imagen de 4000 píxeles de ancho en una página que se muestra a 800 es cuatro veces los datos que necesita, y redimensionar lo arregla sea cual sea el formato.
El intercambio honesto, dicho claro
| Tu imagen | El mejor movimiento | Por qué |
|---|---|---|
| Una foto guardada como PNG | Conviértela a JPG o WebP | El problema es el formato, no la compresión |
| Una captura o una interfaz | Comprime sin pérdidas | Entre un 10% y un 30% más pequeña, sin perder nada |
| Un logotipo o un icono | Reduce los colores, luego comprime | Pocos colores son pocos bytes |
| Un diagrama o un gráfico | Comprime sin pérdidas | Los colores planos se comprimen bien |
| Un PNG que vas a mandar por correo | Conviértelo a JPG | El destinatario puede abrirlo; los PNG en correo suelen ser enormes |
| Cualquier cosa para una web | Conviértelo a WebP | Más pequeño que los dos con el mismo aspecto |
Una lista corta
- ¿Es una fotografía? No la comprimas como PNG: conviértela primero a WebP o JPG.
- ¿Es un gráfico? La compresión sin pérdidas merece la pena; entre un 10% y un 30% es realista.
- ¿Tiene menos de 256 colores? Reduce primero la paleta: ahí está la mejora grande.
- ¿Es más ancha de lo que necesita? Redimensiónala al mismo tiempo: ahorra más que la compresión.
- Comprueba el tamaño antes y después. La ganancia varía según la imagen y la herramienta te la muestra.
- Guarda el original. La copia comprimida es un archivo nuevo, y puedes necesitar la fuente.
- Mira el resultado a tamaño completo antes de publicarlo.
- Funciona en tu navegador y no guarda ninguna copia de tu imagen.