Guía de tamaño de archivo de imagen: KB, MB y calidad

Última actualización: June 28, 2026

El tamaño del archivo de imagen es el número de bytes que una imagen utiliza en disco o a través de la red. Se muestra como KB, MB o, a veces, GB. Un archivo se vuelve grande cuando tiene demasiados píxeles, utiliza el formato incorrecto, conserva metadatos innecesarios o se exporta con un ajuste de calidad superior al necesario para su uso final.

Esta guía le proporciona las reglas prácticas para reducir imágenes antes de subirlas a un sitio web, un feed de productos, un correo electrónico o un CMS.

Respuesta rápida: ¿cómo reducir el tamaño del archivo de imagen sin perder calidad?

Utiliza el archivo fuente más limpio, redimensiónalo a las dimensiones más grandes que realmente muestres, y luego exporta un formato web moderno como WebP o AVIF. Para la mayoría de las fotos, comienza con una calidad WebP de 75-85. Para capturas de pantalla, logotipos y gráficos con texto pequeño, prueba PNG o WebP sin pérdidas antes de usar compresión con pérdida.

El error más grande es comprimir una foto de cámara de 4000 px y aun así subirla a 4000 px para un espacio de 800 px. Eso mantiene píxeles extra que los usuarios nunca ven. Redimensiona primero, luego ajusta el formato y la calidad.

Después de exportar, inspecciona el resultado en su tamaño de visualización final. Si la imagen sigue luciendo limpia y el archivo está por debajo del presupuesto de tu página o carga, detente. Si se ve borrosa, con bloques o manchada, aumenta la calidad o usa un formato más adecuado. Para un flujo de trabajo de medición más profundo, utiliza la guía de relación de compresión de imágenes.

Para esta actualización, medí los cuatro gráficos WebP generados de 1400 por 788 utilizados en el artículo: los archivos locales varían entre 28 KB y 52 KB. Es un recordatorio útil de que los gráficos instructivos planos pueden ser pequeños incluso con dimensiones generosas, mientras que las fotos detalladas suelen necesitar más bytes.

¿Qué afecta el tamaño del archivo de imagen?

Cuatro cosas determinan la mayoría de los problemas de tamaño de archivo de imagen: dimensiones de píxeles, contenido de la imagen, formato de archivo y ajustes del codificador. Los metadatos también pueden importar, especialmente cuando se dejan dentro de archivos públicos datos EXIF de la cámara, campos GPS, miniaturas e historial del editor.

Las dimensiones de píxeles establecen la carga de trabajo bruta. Una imagen de 1600 por 1200 tiene cuatro veces más píxeles que una imagen de 800 por 600. La compresión puede reducir los bytes finales, pero aún debe describir el lienzo más grande.

Para la entrega web, la guía de imágenes de Google recomienda elementos de imagen rastreables, texto alternativo descriptivo y formatos compatibles como JPEG, PNG, WebP, SVG y AVIF en Google Images best practices. El archivo aún debe ser útil para el lector; una imagen diminuta pero poco clara no es una buena optimización.

¿Por qué mi imagen tiene tantos MB?

Tu imagen probablemente es demasiado grande porque se exportó para captura o edición, no para entrega. Un original de teléfono o cámara puede tener 3000-6000 px de ancho. Esto es útil como archivo maestro. Generalmente es un desperdicio para una imagen de cuerpo de blog, miniatura de producto, banner de correo electrónico o foto de perfil.

Causas comunes:

• Se sube un archivo de cámara de resolución completa directamente a una página web.
• Se utiliza un PNG para una imagen fotográfica.
• Un JPEG se guarda al 100% de calidad con poco beneficio visible.
• Una captura de pantalla se exporta como un gran PNG de retina y nunca se redimensiona.
• Los metadatos EXIF y las vistas previas incrustadas permanecen en la copia pública.
• Un CMS crea miniaturas, pero aún sirve el original en la página.
• Una imagen transparente se guarda como PNG cuando WebP sin pérdidas sería más pequeño.
• La imagen fue editada y guardada varias veces, añadiendo artefactos sin resolver el tamaño.

Si el problema es un límite de carga estricto, comienza con el redimensionamiento y formato antes de reducir la calidad agresivamente. La guía comprimir imagen a 100KB es útil cuando un formulario o sitio de listado tiene un límite de bytes estricto.

¿Qué tamaño de archivo de imagen es bueno para páginas web?

No hay un tamaño perfecto universal, pero sí hay presupuestos de inicio útiles. Una imagen hero en la página principal puede ser más grande que una pequeña miniatura de tarjeta. Una foto de detalle de producto necesita más detalles que una textura de fondo. El objetivo es enviar suficientes píxeles para el trabajo y no más.

Trate estos como puntos de partida, no como leyes. Una foto de producto de joyería con bordes metálicos nítidos puede necesitar más bytes. Una infografía simple puede ser mucho más pequeña. Los gráficos planos se comprimen bien porque evitan el detalle de textura, grano y sombra que hacen que las fotos de cámara sean más pesadas.

Si necesita un paso de publicación completo que incluya dimensiones, variantes responsivas, carga perezosa (lazy loading) y comprobaciones CDN, use la lista de verificación completa de optimización de imágenes.

¿Qué formato hace que un archivo de imagen sea más pequeño?

El formato más pequeño aceptable depende de lo que contenga la imagen. Las fotos generalmente se reducen bien con WebP o AVIF. Las capturas de pantalla y los gráficos con texto pueden verse mal si la compresión con pérdidas suaviza los bordes. Los logotipos y los iconos pueden ser mejores como SVG si son arte vectorial.

La [guía de tipos y formatos de archivos de imagen] de MDN (https://developer.mozilla.org/en-US/docs/Web/Media/Guides/Formats/Image_types) describe las compensaciones entre JPEG, PNG, WebP, AVIF, GIF y SVG, incluido el soporte para comportamiento con pérdidas, sin pérdidas y transparencia. Utiliza esto como referencia cuando decidas si una imagen debe comprimirse, convertirse o mantenerse sin pérdidas.

Si estás eligiendo entre los dos formatos web modernos, lee la [comparación de AVIF vs WebP] (/blog/avif-vs-webp-comparison). AVIF a menudo comprime fotos muy bien, pero WebP es rápido, tiene un amplio soporte y es sencillo de añadir a pipelines existentes.

¿Cómo debes reducir el tamaño del archivo de imagen paso a paso?

Utiliza el mismo orden cada vez. Arrastrar aleatoriamente un control deslizante de calidad hasta el 40% crea imágenes suaves y resultados inconsistentes.

1. Mantén la fuente limpia más grande como tu archivo maestro.
2. Recorta para la composición final antes de crear copias de entrega.
3. Redimensiona al ancho más grande que realmente muestre la página, el correo electrónico o el feed.
4. Elige formato según el contenido: WebP o AVIF para fotos, sin pérdida (lossless) para gráficos con mucho texto.
5. Exporta dos o tres candidatos de calidad.
6. Elimina los metadatos que no son necesarios para la copia pública.
7. Compara los candidatos en el tamaño de visualización final en escritorio y móvil.
8. Verifica el tamaño en bytes después de todos los pasos de exportación, no antes.
9. Publica en una CDN o URL de medios estable.
10. Verifica que la URL final devuelva HTTP 200 y que la página muestre el activo previsto.

Para una carpeta de archivos, no ajustes cada imagen a mano primero. Elige una foto representativa, una foto difícil y una captura de pantalla. Encuentra configuraciones que funcionen para esas muestras, y luego procesa el resto por lotes (batch). La guía de redimensionamiento por lotes cubre el patrón de línea de comandos para redimensionar muchos archivos desde una carpeta fuente.

¿Qué ajuste de calidad debes usar?

Empieza en el medio y muévete solo cuando la imagen te lo indique. Para fotos WebP, q75-q85 es un rango de prueba sensato. Para JPEG, 80-85 a menudo funciona para fotos web ordinarias. Para AVIF, los números de calidad no son equivalentes a WebP o JPEG, por lo que compara el resultado visualmente en lugar de hacer coincidir los valores del control deslizante.

Usa esta tabla para las primeras pruebas:

La guía de web.dev sobre optimizar Largest Contentful Paint es un útil recordatorio de que los bytes de imagen son solo una parte del rendimiento. Una imagen principal también debe ser descubrible temprano, correctamente priorizada y dimensionada para el viewport.

¿Cómo verificar el tamaño del archivo de imagen antes de publicar?

Verifique tanto las dimensiones como los bytes. En macOS, "Obtener información" de Finder muestra el tamaño del archivo, y Preview o editores de imágenes pueden mostrar las dimensiones. En Windows, Propiedades muestra el tamaño del archivo y Detalles muestra las dimensiones. En un flujo de trabajo de línea de comandos, identify image.webp de ImageMagick informa el ancho, la altura y la información del archivo.

Para trabajos web, verifique también lo que el navegador descarga. Abra la página, inspeccione el panel Network, filtre por imágenes y observe los bytes transferidos. Esto detecta el error común en el que el archivo local es pequeño, pero la página sigue solicitando una URL más antigua y pesada.

Antes de publicar, confirme:

• La imagen no es más ancha que lo que requiere la ranura renderizada más grande.
• El archivo exportado es WebP, AVIF, JPEG, PNG o SVG por una razón clara.
• El tamaño en bytes se ajusta al caso de uso.
• La imagen sigue luciendo limpia en el tamaño de visualización.
• El texto alternativo describe la imagen visible.
• La URL del CDN devuelve HTTP 200.
• La página no carga un original oculto de resolución completa.

Si no está seguro de si la imagen es demasiado grande debido a las dimensiones o la compresión, utilice check image size and dimensions antes de cambiar el formato.

Errores de tamaño de archivo que evitar

La mayoría de los problemas de tamaño de archivo son problemas ordinarios del flujo de trabajo. Ocurren cuando la edición, carga y publicación se tratan como un mismo paso.

Evita estos errores:

• Subir el archivo maestro de la cámara como imagen web pública.
• Usar PNG para cada imagen porque parece más seguro.
• Exportar JPEG al 100% y asumir que es visualmente mejor.
• Comprimir antes de redimensionar.
• Recomprimir el mismo JPEG cada vez que se actualiza una página.
• Mantener metadatos GPS en archivos públicos.
• Juzgar la calidad con un zoom del 400% sin verificar el tamaño de visualización final.
• Enviar una imagen de escritorio enorme a usuarios móviles.
• Reemplazar una imagen clara con una más pequeña pero engañosa.
• Olvidar actualizar las imágenes de Open Graph y la portada del artículo después de cambiar los activos.

Para páginas con mucho contenido móvil, combina las decisiones de tamaño de archivo con la entrega responsiva. La guía de optimización de imágenes para móviles explica cómo los source sets, el ancho del viewport y la prioridad de carga afectan la imagen real que reciben los usuarios.

Lista de verificación del tamaño del archivo de imagen

Utiliza este paso final antes de subir una imagen a una página, tienda, correo electrónico o CMS.

La regla práctica es simple: redimensionar primero, elegir el formato segundo, ajustar la calidad tercero y verificar la URL final. El tamaño del archivo solo es exitoso cuando la imagen sigue siendo lo suficientemente clara para su propósito.