GoToolsOnline Blog Herramientas

Optimizar Imágenes para Web: Guía Completa 2026

Cómo comprimir, redimensionar y elegir el formato correcto para mejorar la velocidad y los Core Web Vitals de tu sitio

Por Ben Praveen J · Actualizado abril 2026

Respuesta rápida: para optimizar imágenes para web, (1) redimensiona al ancho real de visualización, (2) conviértelas a WebP con calidad 75-85, y (3) comprímelas hasta dejarlas por debajo de 150 KB. Puedes hacerlo gratis y sin instalar nada con el Compresor de Imágenes, el Redimensionador y el Conversor de Formato.

Las imágenes son el elemento más pesado de la mayoría de páginas web. Según datos de HTTP Archive, representan entre el 50% y el 70% del peso total de una página web promedio. Si tu sitio carga lento, las imágenes sin optimizar son casi siempre la causa principal. Y un sitio lento no solo frustra a los visitantes: Google lo penaliza directamente en los resultados de búsqueda a través de los Core Web Vitals.

Esta guía te enseña exactamente cómo optimizar imágenes para web — comprimirlas, redimensionarlas y elegir el formato correcto — para que carguen rápido sin sacrificar calidad visual.

¿Cómo optimizar una imagen para web paso a paso?

  1. Redimensiona al tamaño real. Si se muestra a 800 px de ancho, no subas 4000 px. Usa el redimensionador online.
  2. Convierte a WebP. Pesa un 25-35% menos que JPEG con la misma calidad visual. Usa el conversor de imágenes.
  3. Comprime con calidad 75-85. Es el punto dulce entre tamaño y calidad. Usa el compresor de imágenes.
  4. Añade loading="lazy" a las imágenes fuera del viewport inicial.

A continuación cubrimos cada paso en detalle, con tablas de tamaños recomendados, comparación de formatos (JPEG, PNG, WebP, AVIF), cómo optimizar imágenes para web afecta al SEO, y los errores más comunes que debes evitar.

¿Por qué importa la compresión de imágenes?

La velocidad de carga de un sitio web afecta directamente a tres áreas críticas de tu negocio:

  • Posicionamiento en Google (SEO). Desde 2021, Google utiliza los Core Web Vitals como factor de ranking. El LCP (Largest Contentful Paint) mide cuánto tarda en cargarse el elemento más grande visible de tu página, que casi siempre es una imagen. Si tu LCP supera los 2.5 segundos, Google considera que la experiencia es deficiente y puede afectar tu posición en los resultados de búsqueda.
  • Tasa de conversión. Estudios de Amazon, Google y Walmart han demostrado que cada segundo adicional de tiempo de carga reduce las conversiones entre un 7% y un 20%. Para una tienda online que factura 100.000 euros al mes, un segundo de retraso puede significar entre 7.000 y 20.000 euros menos al mes en ventas.
  • Experiencia de usuario en móviles. Más del 60% del tráfico web global proviene de dispositivos móviles, muchos de ellos con conexiones 3G o 4G limitadas. Una imagen de 5 MB que carga en 1 segundo con fibra óptica puede tardar 15 segundos en una conexión móvil lenta.

Formatos de imagen: cuándo usar cada uno

JPEG

El formato clásico para fotografías. JPEG usa compresión con pérdida, lo que significa que reduce el tamaño del archivo descartando información visual que el ojo humano difícilmente percibe. Es ideal para fotos de productos, imágenes de fondo, banners y cualquier imagen fotográfica.

Configuración recomendada: calidad entre 75 y 85 sobre 100. Por debajo de 70, los artefactos de compresión empiezan a ser visibles. Por encima de 85, la ganancia en calidad visual es mínima pero el tamaño del archivo aumenta significativamente.

PNG

PNG usa compresión sin pérdida, lo que significa que no descarta información visual. Es el formato adecuado para gráficos con bordes nítidos, logotipos, capturas de pantalla, iconos y cualquier imagen que necesite transparencia. No es recomendable para fotografías porque produce archivos mucho más grandes que JPEG para el mismo contenido fotográfico.

WebP

Desarrollado por Google, WebP ofrece lo mejor de ambos mundos: compresión con y sin pérdida, transparencia, y archivos un 25-35% más pequeños que JPEG para la misma calidad visual. Todos los navegadores modernos soportan WebP desde hace años. Es el formato recomendado para la mayoría de imágenes web en 2026.

AVIF

El formato más nuevo y eficiente. AVIF puede producir archivos hasta un 50% más pequeños que JPEG. Sin embargo, la compatibilidad con navegadores todavía no es universal y el tiempo de codificación es mayor. Es una buena opción si tu audiencia usa principalmente Chrome o Firefox actualizados.

Proceso de optimización paso a paso

  1. Redimensiona antes de comprimir. Este es el paso más importante y el que más impacto tiene. Si tu imagen se muestra a 800 píxeles de ancho en tu web, no subas una imagen de 4000 píxeles. Usa el redimensionador de imágenes para ajustar las dimensiones al tamaño real de visualización. Esto solo puede reducir el archivo un 90% o más.
  2. Elige el formato correcto. Foto: WebP o JPEG. Gráfico con transparencia: WebP o PNG. Logotipo simple: SVG. Usa el conversor de imágenes para cambiar entre formatos.
  3. Comprime la imagen. Abre el Compresor de Imágenes y sube tu archivo. La herramienta aplica compresión inteligente que mantiene la calidad visual mientras reduce el tamaño significativamente.
  4. Verifica el resultado. Compara la imagen original con la comprimida. Si la diferencia visual es imperceptible, el archivo está listo para subir a tu web.

Core Web Vitals y las imágenes

Los Core Web Vitals son las tres métricas que Google usa para evaluar la experiencia de usuario de tu sitio:

  • LCP (Largest Contentful Paint). Mide cuánto tarda en renderizarse el elemento más grande visible. Casi siempre es la imagen principal o hero image. Objetivo: menos de 2.5 segundos. Las imágenes grandes y sin optimizar son la causa más común de un LCP deficiente.
  • INP (Interaction to Next Paint). Mide la respuesta a interacciones del usuario. Las imágenes pesadas pueden bloquear el hilo principal del navegador durante la decodificación, afectando indirectamente la interactividad.
  • CLS (Cumulative Layout Shift). Mide la estabilidad visual. Cuando una imagen no tiene dimensiones definidas en el HTML (atributos width y height), el navegador no puede reservar espacio y el contenido salta cuando la imagen carga. Siempre define las dimensiones de tus imágenes.

Tamaños recomendados por tipo de imagen

Tipo de imagenAncho recomendadoTamaño objetivoFormato
Hero/banner1200-1600pxMenos de 200 KBWebP o JPEG
Foto de producto800-1000pxMenos de 150 KBWebP o JPEG
Miniatura/thumbnail300-400pxMenos de 30 KBWebP o JPEG
Icono/logotipoVariableMenos de 10 KBSVG o WebP
Imagen de blog720-1000pxMenos de 100 KBWebP o JPEG

Errores comunes que debes evitar

  • Subir imágenes directamente de la cámara. Una foto de un smartphone moderno pesa entre 3 y 12 MB. Subir eso directamente a tu web sin comprimir es uno de los errores más frecuentes.
  • Usar PNG para fotografías. Un retrato en PNG puede pesar 5 MB. El mismo retrato en JPEG a calidad 80 pesa menos de 200 KB con calidad visual idéntica.
  • No definir dimensiones en el HTML. Sin atributos width y height, las imágenes causan saltos de layout que penalizan tu CLS.
  • Ignorar la carga diferida (lazy loading). Las imágenes que están debajo del fold (fuera de la vista inicial) deberían cargarse cuando el usuario se desplaza hacia ellas, no al cargar la página. Añade loading="lazy" a tus etiquetas img.

Optimiza tus imágenes ahora: Compresor de Imágenes · Redimensionar · Convertir formato

Preguntas frecuentes

¿Cuál es el mejor formato de imagen para web en 2026?
WebP es el formato recomendado. Ofrece compresión 25-35% mejor que JPEG y soporta transparencia. Todos los navegadores modernos lo soportan. Para máxima compatibilidad, usa JPEG como respaldo.
¿Comprimir imágenes afecta al SEO?
Sí, positivamente. Google usa la velocidad de carga como factor de ranking. Las imágenes optimizadas mejoran directamente los Core Web Vitals que Google mide para posicionar tu sitio.
¿Cuánto se puede comprimir una imagen sin perder calidad?
Las fotografías JPEG se pueden comprimir un 60-80% sin pérdida visible. Los gráficos PNG se reducen un 40-70%. La clave es encontrar el punto óptimo entre tamaño y calidad para cada caso.
¿Debo redimensionar las imágenes además de comprimirlas?
Absolutamente. Es el factor más importante. Una imagen de 4000 píxeles mostrada a 800 desperdicia el 95% de sus píxeles. Redimensiona primero y luego comprime.
¿Qué son los Core Web Vitals y cómo afectan las imágenes?
Son métricas de Google que miden la experiencia del usuario: LCP (velocidad de carga), INP (interactividad) y CLS (estabilidad visual). Las imágenes grandes afectan al LCP y pueden causar CLS si no tienen dimensiones definidas.

← Blog  |  Compresor de Imágenes  |  Convertir Imagen  |  Todas las herramientas