¿Qué es lazy loading en WordPress?

Lazy loading es una técnica que retrasa la carga de algunas imágenes y otros elementos hasta que están cerca de aparecer en la pantalla del usuario.

En lugar de descargar todas las imágenes de una página desde el principio, el navegador puede esperar para cargar las que se encuentran más abajo y que el visitante todavía no puede ver.

Por ejemplo, si una entrada contiene diez imágenes pero al abrirla solo aparecen las dos primeras en pantalla, las demás pueden cargarse a medida que el visitante se acerca a ellas.

Esto permite reducir la cantidad de información que necesita descargarse durante la carga inicial de la página.

¿Cómo funciona el lazy loading?

Cuando una imagen utiliza lazy loading, el navegador no necesita descargarla inmediatamente si todavía está lejos de la parte visible de la página.

A medida que el visitante se desplaza por el contenido y se acerca a la imagen, el navegador puede comenzar a cargarla.

En muchas imágenes, WordPress puede utilizar el atributo loading="lazy" para indicar al navegador que su carga puede retrasarse.

Esto no significa que la imagen deje de cargarse. Simplemente cambia el momento en que el navegador empieza a descargarla.

¿Qué imágenes deberían utilizar lazy loading?

Lazy loading es especialmente útil para imágenes que aparecen más abajo en una página y que el visitante no necesita ver inmediatamente.

Por ejemplo:

• Imágenes dentro de un artículo largo
• Fotografías de una galería que aparecen más abajo
• Imágenes de productos que todavía no están visibles
• Otros elementos gráficos alejados del contenido inicial

Retrasar estas imágenes puede evitar descargas innecesarias durante los primeros momentos de la visita.

¿Qué imágenes no deberían utilizar lazy loading?

No todas las imágenes deben cargarse de forma diferida.

Las imágenes que aparecen inmediatamente al abrir una página normalmente necesitan empezar a cargarse cuanto antes.

Esto es especialmente importante cuando una imagen es el elemento principal de la página. Si esa imagen utiliza lazy loading, el navegador puede retrasar su descarga y hacer que tarde más en aparecer.

Por ejemplo, una imagen destacada o un banner situado al comienzo de una página puede ser el elemento que mide el LCP. Aplicar lazy loading a esa imagen puede empeorar esta métrica en lugar de mejorarla.

Por eso, aplicar lazy loading a todas las imágenes de un sitio no siempre es una buena optimización.

¿WordPress utiliza lazy loading automáticamente?

WordPress incluye soporte para lazy loading y puede añadir el atributo loading="lazy" a determinadas imágenes.

Sin embargo, WordPress también tiene en cuenta que algunas imágenes visibles al comienzo de la página pueden necesitar cargarse inmediatamente.

Los temas, plugins y herramientas de optimización también pueden modificar la forma en que se aplica lazy loading.

Por esta razón, si una imagen importante tarda en aparecer, puede ser útil comprobar cómo se está cargando antes de añadir otra herramienta de lazy loading.

Lazy loading y rendimiento de WordPress

Lazy loading puede mejorar la carga inicial de páginas que contienen muchas imágenes porque evita descargar inmediatamente archivos que el visitante todavía no necesita ver.

Sin embargo, no reduce por sí mismo el peso de las imágenes. Una imagen demasiado pesada seguirá teniendo el mismo tamaño cuando llegue el momento de descargarla.

Por eso, lazy loading es solo una parte de la optimización de imágenes en WordPress. También es importante revisar el peso, las dimensiones, el formato y el tamaño de las imágenes que recibe cada dispositivo.

Consulta nuestra guía sobre Rendimiento de WordPress para conocer otros factores que pueden influir en la velocidad del sitio.

Términos relacionados

• Optimización de imágenes
• LCP (Largest Contentful Paint)
• Imágenes responsive

Preguntas frecuentes sobre lazy loading en WordPress

¿Lazy loading reduce el peso de las imágenes?

No. Lazy loading cambia el momento en que una imagen se descarga, pero no reduce el tamaño de su archivo. Para reducir su peso es necesario utilizar otras técnicas de optimización.

¿Debo utilizar lazy loading en todas las imágenes?

No. Las imágenes que aparecen al comienzo de una página normalmente deben cargarse cuanto antes. Retrasar una imagen importante puede hacer que el contenido principal tarde más en aparecer.

¿Lazy loading puede empeorar el LCP?

Sí. Si el elemento LCP es una imagen y su descarga se retrasa mediante lazy loading, puede tardar más en aparecer y aumentar el LCP.

¿Necesito un plugin para utilizar lazy loading en WordPress?

No necesariamente. WordPress y los navegadores actuales permiten aplicar lazy loading a muchas imágenes sin necesitar un plugin específico. Algunos plugins pueden añadir controles o modificar este comportamiento.