Blog

Recomendaciones compatibles con motores de búsqueda para desplazamiento infinito (infinite scroll)

jueves, 13 de febrero de 2014

El feed de noticias o el tablero de tu sitio web puede utilizar
infinite scroll—¡para deleite de tus usuarios! Sin embargo, cuando se trata de deleitar a Googlebot, puede ser otra historia. Con el desplazamiento infinito, los crawlers no siempre pueden emular el comportamiento manual del usuario —como desplazarse o hacer clic en un botón para cargar más elementos—, por lo que no siempre acceden a todos los elementos individuales del feed o la galería. Si los crawlers no pueden acceder a tu contenido, es poco probable que aparezca en los resultados de búsqueda.

Para asegurarte de que los motores de búsqueda puedan rastrear los elementos individuales enlazados desde una página de desplazamiento infinito, asegúrate de que tú o tu sistema de gestión de contenidos produzcáis una serie paginada (páginas de componentes) que acompañe a tu desplazamiento infinito.

Infinite scroll page is made search-friendly when converted to a paginated series
Una página de desplazamiento infinito se vuelve “compatible con la búsqueda” cuando se convierte en una serie paginada; cada página de componentes tiene un <title> similar declarado en la etiqueta
<head> de la página.

Puedes ver este tipo de comportamiento en acción en la
demostración de desplazamiento infinito con paginación
creada por el analista de tendencias de webmasters,
John Mueller. La demostración ilustra algunos puntos clave compatibles con los motores de búsqueda:

  • Cobertura: Todos los elementos individuales son accesibles. Con el desplazamiento infinito tradicional, los elementos individuales que se muestran después de la carga inicial de la página no son descubribles para los crawlers.
  • Sin superposición: Cada elemento se lista solo una vez en la serie paginada (por ejemplo, sin duplicación de elementos).

Recomendaciones compatibles con motores de búsqueda para el desplazamiento infinito

1. Antes de empezar

  1. Divide el contenido de tu página de desplazamiento infinito en páginas de componentes a las que se pueda acceder cuando JavaScript esté desactivado.
  2. Determina cuánto contenido incluir en cada página.
    1. Asegúrate de que si un buscador llegara directamente a esta página, pudiera encontrar fácilmente el artículo exacto que deseaba (por ejemplo, sin mucho desplazamiento antes de localizar el contenido deseado).
    2. Mantén un tiempo de carga de página razonable.
  3. Divide el contenido para que no haya superposición entre las páginas de componentes de la serie (con la excepción del almacenamiento en búfer).

    the example on the left is search-friendly, the right example isn't
    El ejemplo de la izquierda es compatible con la búsqueda, el ejemplo de la derecha no; el ejemplo de la derecha provocaría el rastreo y la indexación de contenido duplicado.

2. Estructura las URLs para el procesamiento de los motores de búsqueda del desplazamiento infinito

  1. Cada página de componentes contiene una URL completa. Recomendamos URLs completas en esta situación para minimizar la posibilidad de errores de configuración.

    • Bueno:
      example.com/category?name=fun-items&page=1
    • Bueno:
      example.com/fun-items?lastid=567
    • Menos óptimo:
      example.com/fun-items#1
  2. Prueba que cada página de componentes (la URL) funcione para llevar a cualquiera directamente al contenido y sea accesible y referenciable en un navegador sin la misma cookie o historial de usuarios.
  3. Cualquier parámetro de URL de clave y valor debe seguir estas recomendaciones:

    • Asegúrate de que la URL muestre conceptualmente el mismo contenido dentro de dos semanas. Evita los parámetros de URL basados en tiempo relativo:
      example.com/category/page.php?name=fun-items&days-ago=3
    • Crea parámetros que puedan mostrar contenido valioso a los buscadores. Evita los parámetros que no sean valiosos para los buscadores como método principal para acceder al contenido:
      example.com/fun-places?radius=5&lat=40.71&long=-73.40

3. Implementa replaceState y pushState

Implementa
replaceState y pushState
en la página de desplazamiento infinito. La decisión de usar uno o ambos depende de ti y del comportamiento del usuario de tu sitio. Dicho esto, recomendamos incluir pushState
(por sí solo, o junto con replaceState) para los siguientes casos:

  • Cualquier acción del usuario que se asemeje a un clic o a pasar de página activamente.
  • Para proporcionar a los usuarios la capacidad de retroceder en serie a través del contenido paginado más recientemente.

4. Prueba

  1. Comprueba que los valores de la página se ajustan a medida que el usuario se desplaza hacia arriba o hacia abajo.
  2. Verifica que las páginas que están fuera de los límites de la serie devuelven una 404 respuesta (por ejemplo, example.com/category?name=fun-items&page=999 debería devolver una
    404 respuesta si solo hay 998 páginas de contenido).
  3. Investiga las posibles
    implicaciones de usabilidad introducidas por tu implementación de desplazamiento infinito.
Alien Road

Cómo lo aplicamos

We archive Search Central announcements because client questions often trace back to a change that was announced years ago. Reading the original is faster than reconstructing it from second-hand summaries.

Servicios relacionados

Compartir