La versión corta
- PNG es un formato sin pérdida, así que conserva cada píxel exactamente, mientras que JPG es con pérdida y descarta el detalle que el ojo tiene menos probabilidades de notar.
- Usa PNG para texto, logotipos, capturas de pantalla, color plano y todo lo que necesite un fondo transparente.
- Usa JPG para fotografías, donde su compresión cuesta de ver y el archivo es varias veces más pequeño.
- JPG no admite transparencia y tiende a mostrar bloques y bandas en los degradados suaves y alrededor de las letras nítidas.
- Las redes sociales recomprimen todo lo que subes, así que partir de un PNG limpio o un JPG de alta calidad le deja a su compresión menos que estropear.
En esta página
La respuesta corta a PNG o JPG: usa PNG para todo lo que tenga texto, logotipos, color plano, bordes nítidos o fondo transparente, y JPG para fotografías. PNG es sin pérdida, así que cada píxel que exportas es el píxel que llega. JPG es con pérdida: descarta detalle para que el archivo sea pequeño, y el detalle que descarta es justo el que hace nítidas las letras y suaves los degradados. Una foto disimula bien esa pérdida. Un titular sobre un degradado, no.
La diferencia entre PNG y JPG
Los dos formatos guardan una cuadrícula de píxeles, así que ninguno se amplía sin perder nitidez. Lo que los separa es cómo comprimen esa cuadrícula en un archivo.
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
PNG
JPG (JPEG)
JPG (JPEG)
JPG funciona dividiendo la imagen en cuadraditos de 8×8 píxeles y simplificando después el color y el detalle fino dentro de cada uno. En una foto llena de textura esa simplificación desaparece entre el ruido. En un degradado suave o en el borde de una letra, aparece como bloques tenues, halos emborronados y bandas de color escalonadas.
Cuándo usar PNG
- Gráficos con mucho texto: tarjetas de citas, anuncios, carruseles, diapositivas.
- Logotipos e iconos, sobre todo sobre un fondo transparente.
- Capturas de pantalla de interfaces, donde JPG emborrona la letra pequeña.
- Degradados y color plano, que muestran bandas y bloques con la compresión JPG.
- Archivos maestros que volverás a editar, para no perder calidad en cada guardado.
Una publicación de texto sobre un degradado exportada como PNG: letras nítidas, sin bandas.
Guardada como un JPG muy comprimido, aquí es donde aparecen primero los artefactos: halos alrededor de las letras y escalones en las esquinas oscuras.
Cuándo usar JPG
Usa JPG para fotografías: fotos de producto, retratos, viajes, comida. Las fotos reales están llenas de grano y textura, que enmascaran la compresión, y un JPG con una calidad de entre 80 y 85 suele verse idéntico al original con una fracción del tamaño. Una foto grande en PNG puede pesar fácilmente varias veces más sin ninguna ganancia visible.
JPG también encaja con diseños que son casi todo foto con un poco de texto, siempre que el texto sea grande. Si el texto es pequeño o fino, o va sobre un cielo liso, exporta en PNG, o prueba los dos y compáralos al 100% de zoom.
PNG o JPG para redes sociales
Instagram, Facebook, X y LinkedIn recomprimen todo lo que subes, normalmente a JPG. Parece un motivo para despreocuparse, pero es justo lo contrario: la compresión se acumula. Un JPG que ya estaba comprimido se comprime otra vez, y los artefactos se duplican. Dale a la plataforma el archivo más limpio que puedas, al tamaño exacto que espera, para que no tenga nada que redimensionar. Los tamaños están en tamaños de imagen para redes sociales.
Publicación de Instagram 1080×1350
1080 × 1350
Historia 1080×1920
1080 × 1920
Publicación de X 1600×900
1600 × 900
Publicación de LinkedIn 1200×1200
1200 × 1200
Exportar como
Por qué
Exportar como
Por qué
Exportar como
Por qué
Exportar como
Por qué
Exportar como
Por qué
PNG o JPG para un logotipo
PNG, siempre, si necesitas un archivo de píxeles. Un logotipo son formas planas y bordes duros, que PNG comprime bien y JPG estropea, y un logotipo casi siempre necesita fondo transparente para ir sobre fotos, colores y el modo oscuro. Mejor aún, guarda el original en SVG, que se mantiene nítido a cualquier tamaño. SVG o PNG explica cuándo usar cada uno, y tamaños de logotipo enumera los archivos que necesitas.
Por qué los degradados muestran bandas en JPG
Los degradados suaves son la prueba más dura para cualquier formato. Una transición oscura de casi negro a violeta profundo solo tiene unas pocas decenas de valores de color distintos con los que trabajar, y la compresión JPG funde los vecinos en franjas visibles. Eso es el banding en degradados, y es peor en fondos oscuros y de poco contraste.
linear-gradient(180deg, #0b0a14 0%, #1a1233 45%, #2e1a5c 100%)Provoca banding
- JPG con calidad 60 o inferior
- Guardar un JPG, editarlo y volver a guardarlo
- Una transición digital perfectamente limpia sin textura
- Subir un tamaño que la plataforma tiene que reescalar
Lo evita
- PNG para todo lo que tenga un degradado
- JPG a 90 o más si tienes que usar JPG
- Una capa de grano ligera, que rompe los escalones
- Exportar al tamaño exacto en píxeles de la plataforma
El grano ayuda más que cualquier ajuste, porque le da al compresor una textura con la que trabajar en lugar de una tirada plana de colores casi idénticos. Degradados con grano muestra cuánto es suficiente. Los Marks de Gradiently llevan su propio grano y su propia luz, que es justo la textura que ayuda a un diseño con degradado a sobrevivir a la recompresión de una plataforma.
¿Y WebP y AVIF?
En tu propia web, los formatos más nuevos ganan a los dos: WebP y AVIF pueden ser con o sin pérdida, admiten transparencia y ocupan menos con la misma calidad. Todos los navegadores actuales admiten WebP. Reserva PNG y JPG para subir a plataformas y compartir archivos, y lee WebP frente a PNG y JPG antes de rehacer las imágenes de tu web. Para los ajustes en sí, consulta comprimir imágenes sin estropear los degradados.
Preguntas frecuentes
¿PNG tiene mejor calidad que JPG?
PNG es sin pérdida, así que nunca pierde calidad por mucho que lo guardes. En fotografías, un JPG de alta calidad se ve igual a simple vista y ocupa mucho menos, así que lo mejor depende del contenido.
¿Subo a Instagram en PNG o en JPG?
PNG para texto, gráficos y degradados; JPG con calidad 85 o más para fotos. Instagram recomprime los dos, así que exporta al tamaño exacto que espera, como 1080×1350 para una publicación vertical.
¿JPG admite fondos transparentes?
No. JPG no tiene canal alfa, así que las zonas transparentes se rellenan con un color sólido, normalmente blanco. Usa PNG, WebP o SVG para la transparencia.
¿Por qué mi degradado se ve a franjas después de guardarlo como JPG?
La compresión JPG funde los colores parecidos de las transiciones suaves en bandas visibles. Exporta el diseño en PNG, sube la calidad del JPG a 90 o más, o añade una capa de grano ligera.
¿JPEG es lo mismo que JPG?
Sí. Son el mismo formato; JPG es simplemente la versión de tres letras de la extensión.
Escrito por Gradiently
El equipo detrás de Gradiently, una herramienta de diseño creada en torno a los Marks: degradados vivos que hacen que todo lo que diseñas parezca tuyo.
Ver nuestro perfil