Las imágenes son la principal razón por la que los sitios web cargan lentamente.
En una página web promedio, las imágenes representan más de la mitad del tamaño total del archivo. Una sola foto principal (hero) sin comprimir puede pesar más que cada línea de código, cada fuente y cada script de la página combinados. Cuando esa foto pesa 4 MB, tus visitantes esperan. Y los visitantes que esperan, se van.
Google lo sabe. La velocidad de la página es un factor de clasificación y el peso de las imágenes es lo primero que miden sus Core Web Vitals. Las imágenes lentas perjudican tus clasificaciones, tu tasa de rebote y tus conversiones al mismo tiempo.
La buena noticia: por lo general, puedes reducir el tamaño de los archivos de imagen en un 60-80% sin pérdida de calidad visible. El truco es saber qué comprimir, hasta dónde llevarlo y qué formato usar. Esta guía cubre los tres.
Por qué la compresión de imágenes importa más que casi cualquier otra cosa
La velocidad de la página no es una métrica de vanidad. Se conecta directamente con el dinero y las clasificaciones.
La velocidad afecta las clasificaciones
Google utiliza los Core Web Vitals como una señal de clasificación. El mayor de ellos, Largest Contentful Paint (LCP), mide cuánto tiempo tarda en cargarse el elemento más grande en pantalla. Ese elemento más grande es casi siempre una imagen. Comprímela y tu puntuación LCP mejorará, lo que ayuda a tu clasificación de búsqueda.
La velocidad afecta la tasa de rebote
Los estudios muestran consistentemente que las tasas de rebote aumentan drásticamente a medida que suben los tiempos de carga. Cuando una página tarda de 1 a 3 segundos en cargarse, la probabilidad de rebote aumenta en un 32%. De 1 a 5 segundos, salta en un 90%. Las imágenes pesadas son la causa más común de esas cargas lentas.
La velocidad afecta las conversiones
Los sitios más rápidos convierten mejor. Todos los estudios importantes de comercio electrónico han encontrado el mismo patrón: recorta un segundo del tiempo de carga y las conversiones aumentan. Para una tienda en línea, la compresión de imágenes puede aumentar directamente los ingresos.
Cómo funciona realmente la compresión de imágenes
La compresión reduce el tamaño del archivo almacenando la imagen de manera más eficiente. Hay dos enfoques fundamentalmente diferentes y conocer la diferencia es la clave para mantener la calidad.
Compresión con pérdida (Lossy)
La compresión con pérdida descarta algunos datos de la imagen permanentemente para hacer que el archivo sea más pequeño. JPEG es el ejemplo clásico. El truco es que descarta primero los datos que tu ojo tiene menos probabilidades de notar. Con una calidad del 85%, un JPEG con pérdida se ve idéntico al original para el ojo humano y ocupa una fracción del tamaño.
Si llevas la compresión con pérdida demasiado lejos (por debajo del 70% de calidad), comenzarás a ver artefactos: parches en bloque, bordes borrosos, bandas en los cielos. El arte es encontrar el punto donde el archivo es pequeño pero el daño es invisible.
Compresión sin pérdida (Lossless)
La compresión sin pérdida hace que el archivo sea más pequeño sin descartar ningún dato. La imagen se reconstruye perfectamente. PNG utiliza compresión sin pérdida. La desventaja es que los archivos sin pérdida son más grandes que los archivos con pérdida, porque mantienen todo.
Usa formatos sin pérdida para gráficos, logotipos e imágenes con texto nítido donde cada píxel importa. Usa formatos con pérdida para fotografías donde el ojo no notará pequeñas pérdidas.
Qué compresión usar: la guía de decisión
Elige el formato incorrecto y terminarás inflando tu archivo o arruinando tu imagen. Aquí te explicamos cómo elegir.
Para los sitios web modernos, WebP es la respuesta predeterminada. Se comprime mejor que JPEG y PNG mientras soporta tanto fotos como transparencia. La única razón para usar otra cosa es el soporte de alternativa para navegadores muy antiguos.
Formatos de imagen para la web, clasificados por caso de uso
WebP (el valor predeterminado moderno)
Desarrollado por Google, WebP ofrece archivos entre un 25 y un 35% más pequeños que JPEG con la misma calidad y soporta transparencia como PNG. Es compatible con todos los navegadores modernos. Para la mayoría de los sitios web en 2026, WebP debería ser tu primera opción para casi todas las imágenes.
AVIF (la vanguardia)
AVIF se comprime aún mejor que WebP, a menudo un 50% más pequeño que JPEG. El soporte del navegador ahora es fuerte pero no universal, por lo que funciona mejor con una alternativa WebP o JPEG. Usa AVIF cuando desees la máxima compresión y puedas configurar alternativas.
JPEG (la alternativa confiable)
Sigue siendo el formato más universalmente compatible para fotografías. Usa JPEG con una calidad del 80-85% como alternativa para los navegadores que no soportan WebP, o cuando necesites compatibilidad garantizada en todas partes.
PNG (para gráficos y transparencia)
Sin pérdida e ideal para logotipos, capturas de pantalla, gráficos con texto y cualquier cosa que necesite transparencia. La desventaja es el gran tamaño de los archivos para las fotos. Nunca uses PNG para fotografías en la web a menos que tengas una razón específica.
SVG (para logotipos e íconos)
No es un formato de compresión, pero vale la pena mencionarlo. SVG es un formato vectorial, por lo que los logotipos y los íconos se mantienen nítidos a cualquier tamaño con archivos diminutos. Úsalo para cualquier cosa que sea un gráfico simple en lugar de una foto.
¿Listo para comprimir las imágenes de tu sitio web ahora mismo? Usa el compresor de imágenes gratuito → para una compresión rápida con un solo clic, o prueba el compresor personalizado → si deseas controlar el nivel de calidad exacto y el tamaño del archivo objetivo. Ambos se ejecutan en tu navegador sin subidas a ningún servidor.
El flujo de trabajo de compresión de imágenes paso a paso
Este es el proceso para preparar cualquier imagen para la web, desde el archivo sin procesar hasta la carga optimizada.
Paso 1: Redimensiona antes de comprimir
Este es el paso que todos omiten y es el más importante. Si tu imagen tiene 4000 píxeles de ancho pero se mostrará a 800 píxeles en tu sitio, estás sirviendo 5 veces más píxeles de los que cualquiera puede ver. Redimensiona la imagen al tamaño máximo en el que realmente se mostrará y luego comprímela.
Redimensionar y comprimir son operaciones diferentes que funcionan en conjunto. Si no tienes clara la diferencia entre redimensionar, recortar y escalar, aquí tienes un desglose claro de redimensionar vs recortar vs escalar antes de comenzar a optimizar.
Paso 2: Elige el formato correcto
Usa la guía de decisión anterior. Las fotos van en WebP (con alternativa en JPEG). Los gráficos y logotipos van en PNG o SVG. Cualquier cosa que necesite transparencia va en WebP o PNG.
Paso 3: Comprime a la calidad adecuada
Para los formatos con pérdida, la calidad del 80-85% es el punto ideal. Elimina la mayor parte del peso del archivo mientras mantiene la imagen visualmente idéntica. Haz una prueba comparando la versión comprimida con la original al 100% de zoom. Si no puedes notar la diferencia, la compresión es buena.
Paso 4: Verifica el tamaño del archivo objetivo
Como guía general, apunta a estos máximos en la web: imágenes principales (hero) por debajo de 200 KB, imágenes de contenido regular por debajo de 100 KB, miniaturas por debajo de 30 KB. Si te pasas, comprime más o reduce aún más las dimensiones.
Paso 5: Sirve tamaños responsivos
Avanzado pero poderoso. En lugar de una sola imagen para todos los dispositivos, sirve versiones más pequeñas a los teléfonos y versiones más grandes a las computadoras de escritorio utilizando el atributo srcset. Un teléfono no necesita una imagen de 1920px. Esto por sí solo puede reducir el peso de la imagen móvil a la mitad.
Paso 6: Habilita la carga diferida (lazy loading)
Agrega loading="lazy" a las imágenes que están debajo del primer pantallazo (below the fold). El navegador solo las carga a medida que el usuario se desplaza hacia abajo, lo que acelera drásticamente la carga inicial de la página. Es un cambio de un solo atributo con una gran recompensa.
6 errores de compresión de imágenes que ralentizan los sitios web
1. Comprimir sin redimensionar primero
Servir una imagen de 4000px que se muestra a 800px desperdicia enormes cantidades de ancho de banda. Redimensiona a las dimensiones de visualización antes de comprimir. Esta es la mayor victoria para la mayoría de los sitios.
2. Usar PNG para fotografías
Una foto guardada como PNG puede ser 5 veces más grande que la misma foto como un JPEG o WebP bien comprimido. PNG es para gráficos y transparencia, no para fotos.
3. Sobrecomprimir hasta generar artefactos visibles
Llevar la calidad JPEG por debajo del 70% para ahorrar unos pocos KB introduce artefactos en bloque y bordes borrosos. Los pocos kilobytes que ahorras no valen una imagen visiblemente degradada. Mantente en un 80-85% de calidad.
4. Olvidarse de los usuarios móviles
Servir imágenes de tamaño de escritorio a teléfonos desperdicia datos móviles y ralentiza los tiempos de carga en el teléfono. Usa imágenes responsivas con srcset para que cada dispositivo obtenga un archivo del tamaño adecuado.
5. No usar formatos de próxima generación
Quedarse con JPEG y PNG en 2026 deja ahorros del 25-50% en el tamaño del archivo sobre la mesa. WebP y AVIF se comprimen drásticamente mejor y son ampliamente compatibles. Úsalos con alternativas.
6. Omitir la carga diferida
Cargar todas las imágenes en una página larga de inmediato obliga al navegador a descargar imágenes que el usuario tal vez nunca llegue a ver. La carga diferida de las imágenes que no están visibles inicialmente acelera la carga crítica.
Herramientas y automatización para la compresión continua
La compresión manual funciona para un puñado de imágenes. Para un sitio web real con cientos o miles de imágenes, querrás algo de automatización.
Para imágenes individuales
Un compresor basado en el navegador es lo más rápido. Arrastra la imagen, comprime, descarga. Sin software, sin carga en un servidor si la herramienta procesa localmente.
Para lotes de imágenes
Si estás optimizando una carpeta de imágenes a la vez, el procesamiento por lotes ahorra horas. La misma lógica que se aplica a comprimir imágenes en tu teléfono se aplica al trabajo de escritorio por lotes: establece tus reglas una vez, aplícalas a todos los archivos.
Para uso continuo en el sitio web
Los complementos de WordPress (como ShortPixel, Imagify o Smush) comprimen imágenes automáticamente al subirlas. Los CDN de imágenes (Cloudinary, ImageKit, Cloudflare Images) comprimen y convierten a WebP o AVIF sobre la marcha. Para un sitio con mucho contenido, la automatización se paga sola rápidamente.
Una nota sobre imágenes para impresión
Todo en esta guía trata sobre la compresión web, donde más pequeño es mejor. Si estás preparando imágenes para impresión, las reglas se invierten por completo y deseas la máxima calidad. Aquí tienes la guía separada para redimensionar fotos para imprimir donde la compresión es el enemigo en lugar del objetivo.
Resumiendo
La compresión de imágenes es lo de mayor impacto y menor esfuerzo que puedes hacer por la velocidad de un sitio web. La mayoría de los sitios están sirviendo imágenes de 3 a 5 veces más grandes de lo que necesitan, por lo que solucionar eso no cuesta nada más que unos minutos por imagen.
Primero redimensiona al tamaño de visualización. Elige WebP para casi todo. Comprime al 80-85% de calidad. Sirve tamaños responsivos para móviles. Usa carga diferida. Haz esas cinco cosas y tus páginas cargarán más rápido, se clasificarán mejor y convertirán más.
Tus imágenes pueden tener una fracción de su tamaño actual con una calidad en la que tus visitantes nunca notarán que se redujo.