Notas del equipo sobre el oficio, los formatos y las pequeñas decisiones detrás de un buen resultado.
Cómo logra WebP tamaños menores que PNG
WebP usa dos modos de compresión distintos. El modo sin pérdida combina la predicción espacial y de color con una etapa de codificación entrópica más sofisticada que el DEFLATE de PNG. Alcanza ratios de compresión alrededor de un 26 por ciento mejores en imágenes habituales, según el punto de referencia publicado por Google. El modo con pérdida aplica una transformada por bloques similar a la compresión de vídeo, diseñada para descartar información perceptualmente irrelevante mientras conserva lo que el ojo realmente ve. Para imágenes con capa de transparencia, WebP usa una sub-compresión sin pérdida separada para los datos de transparencia. Aplica compresión con pérdida a los datos RGB, y por eso el WebP con pérdida y transparencia puede ser unas tres veces más pequeño que un PNG con calidad visual equivalente. El DEFLATE de PNG es solo sin pérdida y no puede aprovechar la compensación perceptual que explora el modo con pérdida. Esa diferencia de formato explica la distancia de tamaño.
El capa de transparencia en detalle
Tanto PNG como WebP admiten transparencia de 8 bits, lo que significa que cada punto puede guardar un valor de opacidad de 0 (totalmente transparente) a 255 (totalmente opaco). Cuando el motor de imágenes de la plataforma reescribe un PNG a WebP, lee los valores RGBA de cada punto. Los valores de transparencia se pasan directamente a la fase de compresión de WebP, donde se conservan con compresión sin pérdida. Esto ocurre independientemente de cómo se traten los datos RGB. El resultado es que cada zona transparente del PNG con opacidad cero, cada punto semitransparente entre 1 y 254 y cada punto opaco en 255 se mapea al mismo estado exacto en WebP. Para un logotipo con sombras suaves o texto con suavizado de bordes sobre un fondo transparente, la suavidad de los bordes sobrevive intacta. Eso contrasta con JPG, que no tiene soporte de transparencia en su especificación y debe componer la imagen sobre un color de fondo antes de guardarla.
Core Web Vitals y elección del formato de imagen
El Largest Contentful Paint mide cuánto tarda en aparecer en el viewport el elemento visible más grande de la página. Para la mayoría de las páginas de contenido, ese elemento es la imagen principal. Google usa el LCP como factor de posicionamiento en su evaluación de Core Web Vitals. Las imágenes PNG son una causa constante de fallos del LCP por su tamaño. Un PNG fotográfico en resolución 4K puede fácilmente pesar varios megabytes, mientras que una salida WebP con calidad equivalente se queda por debajo de un megabyte. La elección del formato de imagen tiene un impacto directo en ese número. Cambiar de PNG a WebP en imágenes por encima del pliegue es una forma probada de reducir el LCP sin cambiar el diseño, el contenido ni la calidad visual percibida. PageSpeed Insights y las herramientas de desarrollo del navegador marcan PNG como formato de nueva generación cuando se detecta como candidato al LCP.
Salida con pérdida y el ajuste casi sin pérdida
La escritura de WebP ofrece un parámetro de calidad de 0 a 100, donde los valores más altos conservan más detalle a costa de archivos más grandes. Esta herramienta escribe en un ajuste fijo casi sin pérdida, afinado para equilibrar la fidelidad visual frente al peso del archivo. Ese ajuste está calibrado para las categorías habituales de recursos web: fotografías, gráficos de interfaz e iconos. En este ajuste, la salida es perceptualmente indistinguible del PNG de origen a tamaños de visualización normales. La diferencia existe solo en la precisión de bits, no en el resultado visual. Si comparas ambas imágenes en una pantalla normal, parecerán idénticas. La principal evidencia de que la diferencia es real, no teórica, es el tamaño del archivo: típicamente entre un 40 y un 70 por ciento menor en fotografías. Para uso en web, eso es lo que importa.
Comportamiento de los metadatos
La canalización usada para la conversión de PNG a WebP elimina los metadatos EXIF, IPTC y XMP de la salida. Esto coincide con el comportamiento observado en los tres principales motores de navegador. Los perfiles de color ICC se gestionan de forma incoherente. Chrome y Safari conservan la etiqueta del perfil ICC sRGB en la salida WebP. Firefox elimina todos los metadatos, incluido el perfil ICC. El resultado neto es que la salida WebP de este convertidor no lleva EXIF, IPTC ni XMP. Si necesitas conservar metadatos de ubicación, copyright o cámara, guarda el PNG original junto al WebP. Para uso en web, donde los metadatos no se renderizan y solo añaden peso al archivo, eliminarlos es el comportamiento correcto. Los metadatos de cámara como ISO y apertura importan a los fotógrafos, pero no a los visitantes de una página web, y el convertidor elimina ese peso extra de forma automática.
Cuándo conservar PNG y cuándo basta con WebP
El árbol de decisión práctico es corto. Si el destino final de la imagen es una página o una aplicación web, y el entorno de renderizado es un navegador moderno de 2020 en adelante, WebP es el formato de exportación correcto. Si la imagen tiene que abrirse en una aplicación de diseño como Figma, Sketch o Affinity Designer, verifica la compatibilidad con WebP en la versión concreta que usas, ya que varía. Si la imagen se usará en un flujo de impresión, son preferibles PNG o TIFF, ya que la mayoría de los RIP de impresión no manejan WebP. Si la imagen se enviará por correo, el PNG es más seguro porque los clientes de correo son notoriamente incoherentes con los formatos modernos. Si la imagen se usará como archivo de trabajo que se edita y reguarda varias veces, conserva el PNG como máster. WebP en calidad casi sin pérdida es un formato de entrega excelente, y PNG es el mejor formato para archivar y editar. El flujo ideal conserva el PNG como original y exporta a WebP para la entrega web.