Formatos de imagen: PNG

Hay algunos aspectos que diferencian a PNG (Portable Network Graphics) de otros formatos, aunque, como estaba destinado a reemplazar el GIF (debido a las disputas de patentes hace mucho tiempo), es similar a GIF en varios aspectos. PNG también usa una compresión sin pérdida, lo que significa que los datos de la imagen se comprimen sin perder la fidelidad visual. La paleta de colores de una imagen se puede cuantificar; es decir, un "color indexado", en el que PNG usa una paleta limitada a 256 colores, al igual que un GIF. Un PNG "truecolor" mucho más común puede contener muchos más colores, hasta 16 millones.

Tanto PNG como GIF son compatibles con la transparencia, aunque con una diferencia importante. GIF trata la transparencia como una propuesta binaria: un píxel es un color opaco o completamente transparente. Este formato admite transparencia de "canal alfa", lo que significa que cada píxel se puede establecer en un nivel de transparencia entre 0 (completamente transparente) y 255 (completamente opaco).

Dos flores rosas que muestran dos niveles de transparencia.

En términos prácticos, la falta de cuantización considerable y compresión sin pérdida implica que guardar una imagen como PNG nunca generará una disminución en la calidad visual. Sin embargo, esto casi siempre da como resultado tamaños de archivos excesivamente grandes en comparación con las codificaciones más modernas compatibles con la Web. El tamaño de transferencia de un archivo PNG significa que casi nunca son la opción correcta para el contenido fotográfico.

Comparación entre JPEG y PNG

PNG era más común en los años pasados en gran medida para un solo caso de uso, ya que la única codificación de trama que admitía la semitransparencia. Hoy en día, PNG solo debe considerarse para el material gráfico simple que requiere semitransparencia (por ejemplo, un logotipo de la empresa que contiene una sombra paralela) y debe compararse cuidadosamente con los formatos más modernos que admiten semitransparencia, como WebP.

De manera similar a los GIF, este formato se diseñó para resolver casos de uso, en términos de escalabilidad y tamaño de archivo, que los archivos SVG ofrecen con frecuencia. Por ese motivo, en ocasiones, verás que se usa PNG como versión de resguardo de los elementos de la IU en una cantidad cada vez más pequeña de navegadores que no admiten SVG, aunque estos formatos son cada vez más inusuales.

Comparación de PNG y SVG.

En términos prácticos, PNG es una buena opción para mantener una versión "canónica" de tamaño administrable de una imagen de origen, guardada en tu entorno de desarrollo local o confirmada en un repositorio de proyecto en caso de que debas editar o volver a guardar versiones futuras de esa imagen en formatos alternativos.

Sin embargo, vale la pena señalar que, a pesar de que las codificaciones están estandarizadas, las diferentes herramientas de edición tienen distintos métodos para realizar esa codificación; algunas son mucho más eficientes que otras. Antes de transferir un archivo PNG en cualquier contexto, asegúrate de ejecutar tus archivos con una herramienta como Squoosh o ImageOptim.