Soluciona el problema de carga diferida de contenido

El proceso de retrasar la carga de contenido no fundamental o no visible, también conocido como carga diferida, es una práctica recomendada común para UX y rendimiento. Para obtener más información, consulta los recursos de web.dev sobre la carga diferida de imágenes y videos. Sin embargo, si no se implementa correctamente esta técnica, es posible que se oculte inadvertidamente el contenido y Google no pueda verlo. Este documento explica cómo asegurarse de que Google pueda rastrear y también indexar contenido de carga diferida.

Cómo cargar contenido cuando esté visible en el viewport

Para que Google vea todo el contenido de la página, asegúrate de que tu implementación de carga diferida cargue todo el contenido relevante siempre que sea visible en el viewport. Estos son algunos métodos para implementar la carga diferida:

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

No agregues la carga diferida al contenido que probablemente sea visible de inmediato cuando un usuario abra una página. Esto podría hacer que el contenido tarde más en cargarse y mostrarse en el navegador, lo que el usuario notará mucho.

Asegúrate de probar la implementación.

Cómo admitir la carga con paginación para el desplazamiento infinito

En un nivel alto, el desplazamiento infinito es una técnica que carga más contenido y más páginas distintas a medida que el usuario se desplaza hacia abajo en una página larga. Puede ser un artículo largo dividido en varios fragmentos o una colección de elementos divididos de manera similar en fragmentos. Para implementar el desplazamiento infinito de una manera indexable, asegúrate de que tu sitio web admita la carga paginada de estos fragmentos. Para ello, haz lo siguiente:

  • Asigna a cada fragmento su propia URL única y persistente.
  • Asegúrate de que el contenido que se muestra en cada URL sea el mismo cada vez que se cargue en un navegador. Una forma de hacerlo es usar números de página absolutos en la URL, por ejemplo, con ?page=12 como parámetro de consulta.
  • Evita usar elementos relativos, como ?date=yesterday, en estas URLs. Esto permite que los motores de búsqueda y los usuarios encuentren de forma coherente el mismo contenido en una URL determinada, lo que facilita que los motores de búsqueda indexen el contenido correctamente y permite que los usuarios compartan y vuelvan a interactuar con esa parte de tu contenido.
  • Vincula de forma secuencial a las URLs individuales para que los motores de búsqueda puedan descubrirlas en un conjunto paginado. Obtén más información sobre las prácticas recomendadas para 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 que se muestra con la API del Historial. Esto permite al usuario actualizar, compartir y vincular la URL actual que se muestra en el navegador.

Prueba

Después de configurar la implementación, asegúrate de que funcione correctamente. Puedes usar la Herramienta de inspección de URLs en Search Console para ver si se cargó todo el contenido. Busca el código HTML renderizado en la Herramienta de inspección de URLs para asegurarte de que tu contenido esté en él. Si las URLs de tus imágenes o videos aparecen en el atributo src en los elementos <img> o <video> en el HTML renderizado, la configuración funciona correctamente.