Ir al contenido
OneKitly

WebP vs JPG vs PNG: ¿qué formato de imagen usar?

Publicado el 11/12/2025 · 3 min de lectura · Herramientas de imagen y diseño

Daniel Okonkwo

Daniel OkonkwoDesarrollador front-end y redactor de Tecnología en OneKitly

Rendimiento web · Formatos de archivo

Verificado con 2 fuentes

Ver perfil
En resumen

Usa WebP por defecto en la web: suele ser un 25–35% más pequeño que JPG o PNG con la misma calidad, admite transparencia y funciona en todos los navegadores modernos. Reserva JPG para la máxima compatibilidad en fotos, y PNG o WebP sin pérdida cuando necesites bordes nítidos o transparencia.

JPG, PNG y WebP ganan en casos distintos. Aquí tienes cuándo usar cada uno para el mejor equilibrio entre calidad, tamaño y compatibilidad.

JPG — fotos y archivos pequeños

JPG usa compresión con pérdida que reduce mucho las fotografías con poca pérdida visible. Es ideal para fotos e imágenes complejas, pero no admite transparencia y se degrada un poco cada vez que se vuelve a guardar.

PNG — transparencia y bordes nítidos

PNG es sin pérdida y admite transparencia, por lo que es la opción para logos, iconos, capturas y gráficos con texto o bordes nítidos. A cambio, los archivos son mucho más grandes que JPG para fotos.

WebP — el todoterreno moderno

WebP admite compresión con y sin pérdida, más transparencia, y suele ser un 25–35% más pequeño que JPG o PNG con la misma calidad. Todos los navegadores modernos lo soportan; guarda un respaldo JPG o PNG solo para clientes muy antiguos. Usa WebP por defecto en la web, JPG para máxima compatibilidad en fotos y PNG cuando necesites transparencia sin pérdida.

¿Cuánto más pequeño es WebP en realidad?

Las propias pruebas de Google sitúan el WebP sin pérdida en torno a un 26% más pequeño que PNG, y el WebP con pérdida un 25–34% más pequeño que JPEG con la misma calidad. El ahorro es mayor en fotos e imágenes detalladas, donde cada kilobyte cuenta para la velocidad de carga y los Core Web Vitals. En gráficos pequeños y planos el ahorro absoluto es menor — un icono de 2 KB tiene poco que recortar.

Compatibilidad de navegadores y alternativas

WebP funciona en todos los navegadores actuales — Chrome, Firefox, Edge, Safari y sus versiones móviles. Si aún das soporte a clientes muy antiguos, sírvelo con el elemento HTML picture y un JPG o PNG como alternativa en un source: los navegadores modernos reciben WebP y el resto el formato clásico. En la práctica, para la mayoría de sitios hoy un WebP simple es seguro.

Cuándo no usar WebP

WebP está hecho para la web, no para todo. Para impresión, los formatos CMYK como TIFF o un PDF de calidad siguen mandando, y algunos clientes de correo y herramientas de diseño antiguas pueden atascarse con él. Si un gráfico ya pesa solo un par de kilobytes en PNG optimizado, convertirlo a WebP aporta poco y añade un paso a tu flujo. La regla: usa WebP en fotos reales e imágenes de interfaz detalladas servidas a navegadores, y conserva los formatos clásicos donde la compatibilidad o la calidad de impresión importen más que los bytes.

JPG, PNG y WebP de un vistazo
FormatoCompresiónTransparenciaIdeal paraTamaño
JPGCon pérdidaNoFotosPequeño
PNGSin pérdidaLogos, iconos, capturasGrande
WebPCon y sin pérdidaCasi todo en la webEl más pequeño (25–35% < JPG/PNG)
Conversor de imagenConvierte tus imágenes a PNG, JPG, WebP, AVIF, BMP, GIF, TIFF o ICO, por lotes y sin subir nada.Probar la herramienta

Preguntas frecuentes

¿Es WebP mejor que JPG?
Para la web, normalmente sí: WebP genera archivos más pequeños con la misma calidad visual y añade transparencia. JPG sigue ganando cuando lo más importante es la compatibilidad universal.
¿Convertir JPG a WebP pierde calidad?
El WebP con pérdida recomprime, así que hay algo de pérdida, pero con ajustes de calidad equivalentes WebP conserva más detalle por kilobyte que JPG. Usa WebP sin pérdida para evitar cualquier pérdida.
¿Qué formato es mejor para logos?
PNG o WebP sin pérdida. Ambos mantienen bordes nítidos y transparencia, a diferencia de JPG, que difumina los bordes y no puede ser transparente.

Artículos que podrían interesarte

Todas las guías
TutorialCómo comprimir una imagen sin perder calidadLas imágenes más pequeñas cargan más rápido y posicionan mejor. Aquí tienes cómo reducir una imagen con criterio — formato, resolución y nivel de compresión — sin pérdida visible.TutorialQué revelan los datos EXIF y cómo eliminarlos correctamenteUn archivo de foto lleva coordenadas, una marca de tiempo exacta, el dispositivo y el objetivo, y en algunas cámaras un número de serie. Esto es lo que contiene realmente el bloque, qué arregla y qué no arregla borrarlo, y cómo verificar que funcionó.GuíaFavicons: qué tamaños necesitas realmente en 2026Cinco archivos cubren todos los consumidores que existen: la pestaña, el marcador, el mosaico anclado, la pantalla de inicio de Android y la de iOS. Las listas de veinte archivos son una matriz de navegadores muerta — con medidas de lo que un icono de 16 píxeles puede y no puede contener.ComparativaJPEG, PNG, WebP o AVIF: qué formato y por quéDos propiedades deciden el formato — fotográfica o de tintas planas, y si necesita alfa o animación. Todo lo demás se deriva de ahí. Con los tamaños medidos de las mismas dos imágenes en los cuatro formatos.TutorialConvertir entre PNG y JPG sin perder lo que importaLos dos sentidos fallan de forma opuesta. PNG a JPG aplana en silencio la transparencia sobre un color de fondo que elige el conversor — obtuvimos blanco con una herramienta y negro con otra sobre el mismo archivo. JPG a PNG no recupera nada y costó hasta 11,4 veces los bytes.TutorialRedimensionar una imagen para cada red sin deformarlaMedido en el propio redimensionador: «Rellenar» es un recorte centrado sin punto de interés, y una foto vertical pierde el 38,9 % por arriba para un banner del tamaño de X. Además, las dimensiones publicadas actuales, cada una con la fecha en que se comprobó.

Herramientas relacionadas

Fuentes

¿Has detectado un error en este artículo?