Imagenes SEO : Desactivar la carga diferida (lazy load) de imagenes de WordPress

Otra de las novedades que nos trajo WordPress 5.5 fue la carga diferida nativa de imágenes, el famoso lazy loading, una técnica de optimización que hace que las imágenes solo se carguen a medida que se navega por la página, evitando así consumos y retrasos de carga innecesarios en el navegador.

Otra de las novedades que nos trajo WordPress 5.5 fue la carga diferida nativa de imágenes, el famoso lazy loading, una técnica de optimización que hace que las imágenes solo se carguen a medida que se navega por la página, evitando así consumos y retrasos de carga innecesarios en el navegador.

Desactivar la carga diferida (lazy load) de imágenes nativa de WordPress completamente

Desactivar Con código

Agregar en tu archivo functions.php el siguiete codigo:

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Desactivar carga diferida (lazy load) de imagenes con una funcion personalizada 

Mediante una función personalizada, para que de este modo puedas añadirlo a un plugin, o crear un plugin solo para eso. Entonces el código sería así:

function ayudawp_desactivar_carga_diferida_imagenes( $default, $tag_name, $context ) {
return false;
}
add_filter('wp_lazy_loading_enabled', 'ayudawp_desactivar_carga_diferida_imagenes', 10, 3);

Desactivar carga diferida (lazy load) de imagenes con Plugins

Disable Lazy Load

Con Disable Lazy Load, una vez activo, tienes ajustes para decidir si desactivas la carga diferida en todas las imágenes o solo en las miniaturas.

Disable WP Lazy Load

Con Disable WP Lazy Load ,  simplemente aplica el filtro que hemos visto antes, así que es activar y listo, sin opciones.

Desactivar la carga diferida nativa solo en ciertos tipos de adjunto

Si prefieres un poco más de control, puedes especificar en qué tipo de imágenes adjuntas desactivar la carga diferida, como en este código de ejemplo:

//Desactivar carga diferida por ID de adjunto y tamaño
function ayudawp_sin_carga_diferida_id( $value, $image, $context ) {
if ( 'the_content' === $context ) {
$image_url = wp_get_attachment_image_url( 100, 'large' ); // Cambia el ID y tamaño del adjunto
if ( false !== strpos( $image, ' src="' . $image_url . '"' )) {
return false;
}
}
return $value;
}
add_filter( 'wp_img_tag_add_loading_attr', 'ayudawp_sin_carga_diferida_id', 10, 3 );

Este código desactiva la carga diferida en el tamaño grande (large) de la imagen con ID 100.

Desactivar carga diferida de imágenes nativa de WordPress con plugins de optimización

La otra posibilidad es que, si ya usas algún plugin de optimización que contemple la carga diferida de imágenes, este realice previamente la desactivación de la funcionalidad nativa de WordPress de lazy loading.

De los más recomendables, y que suelo utilizar tanto en mis sitios como en los de mis clientes, los siguientes plugins ya se han actualizado para desactivar la carga diferida nativa de WordPress y priorizar la suya, normalmente más granular y personalizable:

• Lazy Load
• SG Optimizer
• WP-Rocket

¿Qué es lo más recomendable?

La carga diferida de medios (imágenes, vídeo, etc.), no solo de imágenes, es totalmente recomendable pues es una técnica de optimización y rendimiento muy eficaz para…

• Evitar retrasos en la carga de páginas.
• Consumir menos recursos del hosting.
• Ahorrar ancho de banda.
• Ahorrar batería en los dispositivos móviles.
• Una experiencia de navegación rápida.

Así que no es opcional, es bajo mi punto de vista una técnica de optimización WPO obligatoria.

Ahora bien ¿es mejor usar la carga diferida nativa de WordPress u otra?

Pues ahora mismo, mientras no se incorpore mayor control de la carga diferida y se incorpore la posibilidad de aplicarla a otros medios además de imágenes (vídeo, gravatares, shortcodes, widgets, etc.) no recomiendo el lazy loading nativo de WordPress porque es demasiado básico.

Es mucho mejor que lo desactives y uses algún sistema (código o plugin) que sí te permita aplazar la carga de otros medios.

Referencia : 

https://ayudawp.com/como-desactivar-la-carga-diferida-lazy-load-de-imagenes-de-wordpress/

Comentarios

Yo utilizo el plugin «a3 Lazy Load» que aplica Lazy Load a imágenes, vídeos e iframes… Y en los ajustes de «Carga diferida de imágenes», dice: «100% compatible con la carga diferida de imágenes de WordPress 5.5 y mejorará su cobertura en este sitio», por lo que supongo que no es necesario hacer nada… es decir, deduzco que no es necesario desactivar la carga diferida de WP porque no se molestan…

Comentario 2 

Eso ocurre porque la imagen tiene el atributo loading="lazy" y es la primera imagen visible que se carga, es decir, es el LCP (Largest Contenful Paint).

El LCP mide cuánto tarda en renderizarse el elemento más grande, en este caso, es esa imagen, y el atributo loading="lazy" lo que hace es que retrasa la carga de imágenes hasta que están próximas al viewport, lo cuál es útil para todas la imágenes que no están above the fold. Básicamente, ese atributo hace que se retrase la carga de ese elemento, y eso termina afectando al LCP.

Esto podrías resolverlo eliminando ese atributo de la imagen, pero parece que estas utilizando un plugin de optimización de imágenes o de caché. Revisa si tienen alguna opción para evitar aplicar lazyload a ciertas imágenes y añades la url de esa imágen.