Comprimir PNG para web

En un sitio moderno, PNG debería llevar una carga específica y bastante limitada: logotipos, iconos, capturas de pantalla de interfaz, diagramas, y cualquier cosa que necesite un fondo transparente. Todo lo fotográfico pertenece a JPEG o WebP. Los sitios que fallan su presupuesto de rendimiento en imágenes suelen estar sirviendo fotografías como PNG, y ningún ajuste de compresión rescata eso — el arreglo es un cambio de formato, no un cambio de paleta.

Para los recursos que genuinamente deberían ser PNG, 128 colores con dithering es casi una respuesta universal. Los elementos de interfaz y las marcas de identidad están construidos con una paleta pequeña y deliberada, así que reducir a la mitad los colores disponibles elimina redundancia en lugar de información, y el resultado es idéntico al ojo con aproximadamente la mitad de bytes.

Para un logotipo o icono que existe como arte vectorial, SVG supera a cualquier formato rasterizado sin excepción: unos pocos cientos de bytes de marcado, nítido en cualquier nivel de zoom y en cualquier densidad de pantalla, y personalizable con CSS. Si tienes el archivo vectorial original, úsalo. PNG es el respaldo para cuando no lo tienes, o para arte con efectos que no sobreviven a la vectorización.

WebP también admite transparencia y suele ser más pequeño que PNG para el mismo contenido, con soporte en todos los navegadores actuales. La razón para seguir sirviendo PNG es la compatibilidad con software fuera del navegador — clientes de correo, herramientas de diseño más antiguas, y cualquier cosa que un colega pueda abrir con el archivo. Para recursos que solo se renderizan en tus propias páginas, WebP es la mejor opción por defecto y esta herramienta tiene un conversor para ello.