Cómo comprimir imágenes para que tu sitio web sea más rápido

Por Thiago · Actualizado el 25 de septiembre de 2026 · 3 min de lectura

En la mayoría de los sitios web, las imágenes son la mayor parte de lo que descargan los visitantes. Las imágenes pesadas hacen las páginas lentas, y las páginas lentas pierden visitantes y posiciones en Google. Por suerte, el peso de las imágenes también es lo más fácil de corregir.

Por qué importa el tamaño de las imágenes

• Los visitantes abandonan las páginas lentas, sobre todo en el celular con datos móviles.
• Google mide la experiencia en la página. Las Core Web Vitals incluyen el "Largest Contentful Paint", el tiempo que tarda en aparecer el contenido principal (muchas veces una imagen).
• El hosting y el ancho de banda cuestan más con cada megabyte que sirves.

Paso 1: usa las dimensiones correctas

Es el paso más olvidado y a menudo el que más ahorra. Una foto directa del celular puede medir 4000 píxeles de ancho, pero la columna de tu blog quizá mide 800. El navegador descarga los 4000 píxeles y luego desecha la mayoría.

Como regla práctica, exporta las imágenes con aproximadamente el doble del ancho con el que se muestran, para que se vean nítidas en pantallas de alta resolución. Para una imagen principal a todo lo ancho, eso suele ser entre 2000 y 2400 píxeles. Para una imagen dentro de un artículo, entre 1200 y 1600 píxeles. Para miniaturas, unos pocos cientos de píxeles. Usa nuestra herramienta Cambiar tamaño de imagen (o cualquier editor de fotos) antes de comprimir.

Paso 2: usa el formato correcto

Todos los navegadores actuales admiten WEBP, así que para un sitio web suele ser la mejor opción por defecto. Usa JPG a WEBP y PNG a WEBP. Para más detalle, consulta WEBP, PNG o JPG.

Paso 3: comprime

La compresión elimina datos que no vas a echar de menos. El compresor de imágenes mantiene cada imagen en su formato y resolución originales y aplica ajustes más fuertes e inteligentes:

• JPG: se vuelve a codificar con MozJPEG a calidad 72, un codificador creado específicamente para producir JPG más pequeños con la misma calidad visual.
• PNG: se reduce a una paleta optimizada de hasta 256 colores (la técnica que usan herramientas como pngquant) con compresión máxima. Las capturas y los gráficos suelen reducirse muchísimo.
• WEBP: se vuelve a codificar a calidad 70, y los WEBP animados conservan su animación.
• Sin sorpresas: si una imagen ya está bien optimizada y el resultado no sería más pequeño, recibes el original.

La imagen también se gira tal como aparece en el celular, y el resultado sale en el mismo formato que subiste, listo para ponerlo en tu sitio.

Revisar el resultado

Compara siempre el antes y el después al tamaño en que la imagen se muestra realmente. Mira las zonas con detalles finos (pelo, texto, hojas) y los degradados suaves (cielos). Si ves bloques o franjas, usa un ajuste más ligero o el original para esa imagen en concreto. La compresión fuerte casi nunca se nota en miniaturas e imágenes de fondo, así que ahí puedes ser más agresivo.

Más allá de la compresión

• Carga diferida: agrega loading="lazy" a las imágenes que están más abajo en la página para que carguen solo cuando el visitante llegue a ellas.
• Atributos de ancho y alto: defínelos en cada imagen para que la página no salte mientras carga.
• Texto alternativo descriptivo: ayuda a quienes usan lectores de pantalla y a los buscadores a entender la imagen.
• Nombres de archivo descriptivos: "zapatillas-running-rojas.webp" dice más que "IMG_4821.webp".