Cómo optimizar imágenes en WordPress: WebP, tamaño y lazy load

Reduce el peso de las imágenes en WordPress con el formato adecuado, tamaños correctos, carga diferida y sin retrasar la imagen principal de la página.

Las imágenes suelen ser lo más pesado de una página de WordPress. Optimizarlas implica tres decisiones: formato adecuado, dimensiones acordes al espacio donde se muestran y carga diferida para las que quedan fuera de la primera pantalla. La imagen principal visible no debe cargarse de forma diferida.

Elegir el formato

FormatoÚsalo para
WebPFotos e ilustraciones en general; lo admiten los navegadores actuales
AVIFFotos cuando tu herramienta lo soporte y haya alternativa
JPEGFotos si necesitas máxima compatibilidad
PNGCapturas con transparencia o texto nítido
SVGLogos e iconos vectoriales, de fuentes confiables

Sube la medida correcta

No subas una foto enorme para mostrarla pequeña. Define el ancho máximo que tu tema usa y redimensiona antes de subir. WordPress genera varios tamaños y entrega con el atributo srcset el más adecuado a cada pantalla, pero parte de la imagen original: si esa ya es excesiva, el desperdicio sigue en el servidor. Puedes ver cómo funcionan las imágenes responsivas en la documentación para desarrolladores de WordPress.

Carga diferida con criterio

  • WordPress añade loading="lazy" a las imágenes de forma nativa en la mayoría de los casos.
  • No difieras la imagen principal de la primera pantalla; es la que suele determinar el LCP.
  • Define ancho y alto en cada imagen para evitar saltos de diseño.
  • Carga con prioridad alta solo la imagen principal, no varias a la vez.

Un flujo de trabajo sostenible

  1. Define reglas: formato, ancho máximo y peso objetivo por tipo de imagen.
  2. Convierte y comprime antes de subir o con un plugin de optimización que lo haga al subir.
  3. Escribe texto alternativo descriptivo; ayuda a accesibilidad y SEO.
  4. Revisa la biblioteca y elimina archivos sin uso.
  5. Mide el efecto con una herramienta de rendimiento, comparando la misma página antes y después.

Si el problema principal es el LCP, sigue con LCP en WordPress.

Una regla útil para equipos es definir una plantilla de imagen por tipo de contenido: portada de entrada, imagen dentro del texto, miniatura de producto y banner. Con anchos y formatos fijos, quien sube material no tiene que decidir cada vez. Si ya tienes una biblioteca grande, optimízala por lotes con una herramienta de confianza, haz copia antes y verifica que las páginas más importantes se ven bien. Revisa también las imágenes de fondo en CSS, que no siempre reciben carga diferida.

Lista de comprobación final:

  • Define un ancho máximo para cada plantilla.
  • Comprueba las imágenes de portada en móvil.
  • Revisa mensualmente si hay archivos pesados nuevos en la biblioteca.

En resumen

  • Sube la medida correcta: No subas una foto enorme para mostrarla pequeña.
  • Carga diferida con criterio: WordPress añade loading="lazy" a las imágenes de forma nativa en la mayoría de los casos.; No difieras la imagen principal de la primera pantalla; es la que suele determinar el LCP.
  • Un flujo de trabajo sostenible: Define reglas: formato, ancho máximo y peso objetivo por tipo de imagen.; Convierte y comprime antes de subir o con un plugin de optimización que lo haga al subir.

Lo que suelen preguntar sobre optimizar imágenes en WordPress

¿Hace falta un plugin de optimización?

No siempre. Si preparas bien las imágenes antes de subirlas, un plugin es un complemento, no una obligación.

¿El formato WebP perjudica el SEO?

No. Google indexa imágenes WebP; lo importante es mantener el texto alternativo y la calidad visual.

¿Debo comprimir sin perder calidad?

Busca un equilibrio: una compresión moderada suele ser imperceptible, pero revisa visualmente las imágenes importantes.