Paginación vs. scroll infinito vs. cargar más: cuál elegir y por qué
Paginación, scroll infinito y cargar más resuelven el mismo problema de listas largas de formas distintas. Cómo elegir según la tarea, el footer y el teclado.
¿Qué es cada patrón?
- Paginación. Los resultados se reparten en páginas numeradas, cada una con su propia URL. Es el patrón más antiguo y el que da más control sobre dónde está la persona.
- Scroll infinito. Al llegar al final, se carga contenido nuevo sin que la persona haga nada más. No hay final visible ni números.
- Cargar más. Un botón al final de la lista añade el siguiente bloque. La página no cambia, pero la persona decide cuándo seguir.
Nielsen Norman Group separa estos patrones por la tarea: el scroll infinito funciona cuando las personas quieren recorrer elementos homogéneos, y no es buena elección cuando necesitan buscar, comparar o revisar los primeros resultados (NN/g, “Infinite Scrolling: When to Use It, When to Avoid It”).
¿Por qué le importa a un diseñador?
Porque la elección decide cosas que el mockup no muestra: si la gente puede volver a donde estaba, si puede llegar al footer, si el enlace se puede compartir y si un lector de pantalla entiende lo que pasó.
Smashing Magazine recoge la revisión de Baymard de 2016 sobre sitios de comercio electrónico: los participantes percibieron la paginación como lenta y exploraron menos de la lista; el scroll infinito genera mucha exploración pero escaneo superficial, y puede impedir que se llegue al footer; cargar más permite comparar la lista completa porque los productos se acumulan en una sola lista, y mantiene el footer accesible. El mismo artículo señala que más del 90 % de los sitios analizados gestionaba mal el botón Atrás y recomienda history.pushState() para corregirlo (Smashing Magazine, “Infinite Scrolling, Pagination Or Load More Buttons?”).
Comparativa rápida
| Criterio | Paginación | Scroll infinito | Cargar más |
|---|---|---|---|
| Volver a la misma posición | Fácil con la URL de la página | Difícil; el botón Atrás suele llevar al inicio | Posible con gestión de URL e historial |
| Llegar al footer | Sí | No, mientras cargue contenido | Sí |
| Compartir una página concreta | Sí | No, salvo que se gestione la URL | Depende de la implementación |
| Explorar sin objetivo | Menos | Más | Intermedio |
| Comparar o buscar | Mejor | Peor | Intermedio |
| Accesibilidad con teclado | Predecible | Compleja | Predecible si el foco se gestiona |
Esta tabla es una guía orientativa basada en las fuentes del artículo. No es una regla. Un catálogo de moda con tarjetas visuales y un buscador de vuelos no tienen la misma tarea.
¿Qué debe cumplir una buena implementación?
Smashing Magazine (2022) propone combinar el scroll infinito con un footer accesible, una separación visual entre elementos nuevos y viejos, una URL que cambie al cargar y un selector de página (Smashing Magazine, “Infinite Scroll UX Done Right”). Esos complementos existen porque el patrón puro tiene problemas.
En accesibilidad hay tres puntos que revisar:
- Teclado. Si el contenido nuevo aparece sin control, quien navega con teclado tiene que recorrer enlace por enlace y puede no llegar nunca al footer. Smashing Magazine pide que el footer sea accesible también con teclado.
- Anuncio. Los lectores de pantalla no siempre se enteran de que hay contenido nuevo. Smashing Magazine pide anunciar los elementos nuevos.
- Foco. Con cargar más, el foco debería ir al primer elemento nuevo. Con paginación, suele ir al inicio de la página o a un encabezado.
Nielsen Norman Group señala el rol ARIA feed del W3C para listas que se extienden, porque ayuda a navegar el flujo y permite saltar al siguiente elemento enfocable. Las pruebas con lectores de pantalla son la forma de comprobar que funciona de verdad.
Ejemplo
Ejemplo ilustrativo: una tienda en línea usa scroll infinito en su listado de zapatillas. Al revisar las sesiones, el equipo ve que casi nadie llega al enlace a atención al cliente del footer, y que quienes vuelven desde un producto tienen que buscar otra vez el punto donde estaban. Cambian a cargar más con un botón visible, actualizan la URL en cada carga y dejan el footer accesible. El equipo mide si la gente encuentra un producto concreto más rápido, y si los clics en el footer suben.
¿Cuándo NO conviene cada uno?
- Paginación: cuando la lista es muy homogénea y la gente quiere explorar por impulso. Entonces se siente lenta y fragmentada.
- Scroll infinito: cuando hay que buscar, comparar, revisar un historial o llegar a un pie con información legal o de contacto.
- Cargar más: cuando el contenido es muy largo y se espera que el usuario llegue al final con frecuencia. Acumula botones y puede volverse igual de incómodo.
Si la lista forma parte de un flujo de compra o de un formulario largo, revisa también el tiempo de validación de formularios y el análisis de embudos del paso.
Errores comunes
- Usar scroll infinito en resultados de búsqueda.
- No actualizar la URL, así que nadie puede compartir ni volver a una página.
- Cargar contenido sin anunciarlo ni mover el foco.
- Ocultar el footer detrás de carga continua.
- Elegir el patrón por moda y no por la tarea.
Cómo empezar mañana
Abre la lista larga más importante de tu producto y escribe la tarea principal de quien la usa: explorar, buscar o comparar. Revisa si el footer es alcanzable, si la URL cambia y si un usuario de teclado puede volver a su punto. Si alguna respuesta es “no”, prueba cargar más con URL actualizada y revisa el resultado con un guion de test de usabilidad que incluya volver desde un detalle.
Fuentes
- NN/g: Infinite Scrolling: When to Use It, When to Avoid It
- Smashing Magazine: Infinite Scrolling, Pagination Or “Load More” Buttons? Usability Findings In eCommerce
- Smashing Magazine: Infinite Scroll UX Done Right: Guidelines and Best Practices
- Google Search Central: Pagination and incremental page loading