JavaScript

Corregir contenido de carga diferida

Diferir la carga de contenido no crítico o no visible, también conocido comúnmente como “carga diferida” (lazy-loading), es una práctica recomendada habitual para el rendimiento y la UX. Para obtener más información, consulta los recursos de web.dev sobre la carga diferida de imágenes y vídeos.
Sin embargo, si no se implementa correctamente, esta técnica puede ocultar inadvertidamente contenido a Google. Este documento explica cómo asegurarse de que Google pueda rastrear e indexar el contenido de carga diferida.

Cargar contenido cuando sea visible en el área de visualización

Para garantizar que Google vea todo el contenido de tu página, asegúrate de que tu implementación de carga diferida cargue todo el contenido relevante siempre que sea visible en el área de visualización (viewport). Aquí tienes algunos métodos para implementar la carga diferida:

Corregir contenido de carga diferida

Los métodos mencionados no dependen de acciones del usuario, como desplazarse o hacer clic, para cargar contenido, lo cual es importante ya que la Búsqueda de Google no interactúa con tu página.

No añadas la carga diferida a contenido que probablemente sea inmediatamente visible cuando un usuario abre una página. Eso podría hacer que el contenido tarde más en cargarse y mostrarse en el navegador, lo cual será muy notable para el usuario.

Asegúrate de probar tu implementación.

Corregir contenido de carga diferida — 2

Admitir la carga paginada para el desplazamiento infinito

A grandes rasgos, el desplazamiento infinito (infinite scroll) es una técnica que carga más contenido, más páginas distintas, a medida que el usuario se desplaza hacia abajo en una página larga. Podría ser un artículo largo dividido en varios fragmentos, o una colección de elementos dividida de manera similar en fragmentos. Para implementar el desplazamiento infinito de forma indexable, asegúrate de que tu sitio web admita la carga paginada de estos fragmentos haciendo lo siguiente:

  • Asigna a cada fragmento su propia URL persistente y única.
  • Asegúrate de que el contenido que se muestra en cada URL siga siendo el mismo cada vez que se cargue en un navegador. Una forma de hacerlo es utilizar números de página absolutos en la URL, por ejemplo, utilizando
    ?page=12 como parámetro de consulta.
  • Evita utilizar elementos relativos como ?date=yesterday en estas URL. Esto permite a los motores de búsqueda y a los usuarios encontrar sistemáticamente el mismo contenido bajo una URL determinada, lo que facilita que los motores de búsqueda indexen correctamente el contenido y permite a los usuarios compartir y volver a interactuar con esa parte de tu contenido.
  • Enlaza secuencialmente a las URL individuales para que los motores de búsqueda puedan descubrir las URL en un conjunto paginado. Obtén más información sobre
    las mejores prácticas al implementar la paginación.
  • Cuando se carga un nuevo fragmento de página en respuesta al desplazamiento del usuario y se convierte en el elemento visible principal para el usuario, actualiza la URL mostrada utilizando la
    API History.
    Esto permite al usuario actualizar, compartir y enlazar a la URL actual que se muestra en el navegador.

Probar

Una vez que hayas configurado tu implementación, asegúrate de que funcione correctamente.
Puedes utilizar la Herramienta de inspección de URLs en Search Console para ver si se ha cargado todo el contenido.
Comprueba el HTML procesado para asegurarte de que tu contenido está en el HTML procesado buscándolo en la Herramienta de inspección de URLs. Si las URL de tus imágenes o vídeos aparecen en el atributo src de los elementos <img> o <video> en el HTML procesado, tu configuración funciona correctamente.

Alien Road

Cómo lo aplicamos

Lazy loading breaks indexing when content only loads on scroll or interaction. We require that Googlebot can reach it without simulated user behaviour, which usually means intersection-observer loading rather than event-triggered.

Servicios relacionados

Compartir