KheperlabKheperlab
Tutoriales

Cómo reducir el peso de las imágenes de tu sitio web sin perder calidad

Subir la imagen original de la cámara sin redimensionar es uno de los errores más comunes y más costosos en velocidad de carga de un sitio web.

Por qué esto importa más de lo que parece

Las imágenes suelen representar más de la mitad del peso total de una página web. Un sitio lento por imágenes pesadas no solo frustra al visitante, también afecta directamente el posicionamiento en buscadores, que consideran la velocidad de carga como un factor real de ranking.

Los tres factores que definen el peso de una imagen

FactorQué controla
Resolución (dimensiones en píxeles)Una foto de cámara suele venir en un tamaño mucho mayor al que se muestra en pantalla
FormatoJPG, PNG y WebP comprimen de forma muy distinta según el tipo de imagen
Nivel de compresiónCuánto se sacrifica de calidad visual a cambio de reducir el tamaño del archivo

Qué formato usar según el tipo de imagen

Fotografías

  • WebP como primera opción, JPG como respaldo
  • Compresión con pérdida es aceptable, el ojo casi no nota la diferencia

Logos e íconos

  • PNG o SVG para mantener bordes nítidos
  • SVG es ideal cuando el diseño es vectorial

Cómo servir el tamaño correcto según el dispositivo

<picture>
  <source srcset="producto-400.webp" media="(max-width: 600px)">
  <source srcset="producto-1200.webp">
  <img src="producto-1200.jpg" alt="Producto" loading="lazy">
</picture>

El atributo loading="lazy" evita cargar imágenes que están fuera de la vista inicial del visitante, hasta que este realmente llega a esa parte de la página.

Redimensiona antes de subir
Nunca subas una foto de cámara de 4000px si en pantalla se va a mostrar a 800px.
Comprime con una herramienta dedicada
La diferencia visual suele ser imperceptible incluso con compresión considerable.
Convierte a WebP cuando sea posible
Suele pesar entre 25% y 35% menos que un JPG equivalente en calidad visual.
Usa carga diferida (lazy loading)
Prioriza lo que el visitante ve primero, retrasa lo que está más abajo en la página.
Nota: comprimir demasiado agresivamente sí se nota, sobre todo en fotos con detalles finos o degradados suaves; conviene revisar visualmente el resultado antes de publicar, no solo confiar en el número de reducción de peso.

Hazlo directamente desde el navegador

Con Konvert puedes comprimir y convertir imágenes a WebP sin instalar software adicional, procesando todo localmente antes de subir el resultado final a tu sitio.

¿Tu sitio carga lento por las imágenes?

Comprimir imágenes ahora →