Un visitante recorre una categoría, baja hasta el cuadragésimo producto, abre una ficha, vuelve atrás y se encuentra arriba de la página 1. Tiene que rehacerlo todo. Es una de las fricciones más señaladas en los catálogos grandes, y también una de las menos costosas de corregir.
Por qué no funciona la vuelta atrás
Tres causas distintas, con soluciones diferentes.
La página se recarga desde el servidor. Al volver atrás, el navegador puede servir la página desde su caché o volver a pedirla. En el segundo caso se pierde todo el estado visual, incluida la posición de desplazamiento.
El contenido se carga después del renderizado inicial. En una categoría con desplazamiento infinito o filtros asíncronos, la página vuelve a su estado de partida: los productos cargados al desplazarse ya no existen a la vuelta.
El estado de navegación no está en la URL. Si la paginación, los filtros y la ordenación no se reflejan en la dirección, el navegador no tiene forma de restituirlos.
Esta última causa es la más estructurante: sin estado en la URL no es posible ninguna restauración fiable.
Qué hay que memorizar
Cuatro elementos, de los cuales solo dos son evidentes.
La posición de desplazamiento. La más visible y, paradójicamente, la menos importante: si se muestran los productos correctos, el visitante recupera rápido su referencia.
La página actual o el número de lotes cargados. Este es el punto decisivo. Un visitante que llegó al sexagésimo producto debe reencontrar esos sesenta productos, no los veinte primeros.
Los filtros y la ordenación activos. Deben estar en la URL, lo que resuelve el problema con independencia de cualquier mecanismo de memorización.
El producto consultado. Restaurar la posición está bien; devolver al visitante exactamente a la miniatura del producto que acaba de ver, con un ligero resaltado, es netamente mejor. Recupera su hilo de inmediato.
Scroll Infinito PrestaShop — Paginación SEO y Restauración de PosiciónScroll infinito en páginas de categoría con paginación que preserva el SEO y restauración de la posición exacta tras visitar una ficha de producto.€69,00
Los dos enfoques técnicos
El estado en la URL. Cada cambio de filtro, de ordenación o de página actualiza la dirección sin recargar. La vuelta atrás restituye el estado de forma natural porque la dirección lo describe.
Es el enfoque más robusto: funciona también para compartir un enlace, abrir en una pestaña nueva e indexar. A cambio exige una gestión limpia del historial de navegación, distinguiendo los cambios que crean una entrada de historial de los que sustituyen la entrada actual.
La regla útil: un cambio de filtro crea una entrada, un simple desplazamiento sustituye la entrada actual. Sin esa distinción, el botón atrás obliga al visitante a atravesar diez estados intermedios para salir de la categoría.
El almacenamiento de sesión. El estado se guarda en el lado del navegador al salir de la página y se restaura a la vuelta. Más sencillo de implementar y limitado: no funciona con un enlace compartido ni en una pestaña nueva.
La combinación que funciona: la URL lleva los filtros, la ordenación y la paginación; el almacenamiento de sesión lleva la posición de desplazamiento y el identificador del último producto consultado.
El caso de la pestaña nueva
Comportamiento muy extendido y raramente tratado: el visitante abre las fichas de producto en pestañas nuevas, mantiene cinco abiertas y vuelve a la pestaña de la categoría.
Buena noticia: en ese caso la pestaña de la categoría no se ha recargado y su estado está intacto. No hace falta ningún mecanismo.
Dos puntos de vigilancia aun así. Si su página recarga automáticamente su contenido al recuperar el foco, para refrescar el stock por ejemplo, destruye ese estado. Y el resaltado del último producto consultado no funciona en este escenario, ya que se han abierto varios productos.
La buena práctica consiste en marcar visualmente todos los productos ya consultados en la cuadrícula, no solo el último. Es útil en los dos escenarios y ayuda al visitante a orientarse en una lista larga.
Desplazamiento infinito o paginación
La vuelta a la posición es más difícil con desplazamiento infinito, y eso pesa en el arbitraje entre ambos.
Con paginación clásica, la URL contiene el número de página, la vuelta funciona de forma natural y la indexación es sencilla. El inconveniente es el clic adicional en cada página.
Con desplazamiento infinito, la experiencia de recorrido es más fluida pero aparecen tres problemas: la vuelta a la posición, el acceso al pie de página vuelto inalcanzable, y la indexación de los productos cargados dinámicamente.
La solución intermedia resuelve la mayor parte de esos puntos: un desplazamiento que carga automáticamente dos o tres lotes y luego un botón «ver más» explícito, con actualización de la URL en cada lote. Conserva la fluidez del inicio del recorrido, la dirección sigue siendo compartible y el pie de página vuelve a ser alcanzable.
Lo que rompe la restauración
Cuatro situaciones que hay que verificar tras la implementación.
La caché del servidor. Una página en caché puede servirse en un estado distinto del esperado. Compruebe el comportamiento en condiciones reales, no solo en el entorno de desarrollo.
El cambio de stock. Si un producto queda no disponible entre la salida y la vuelta, la cuadrícula cambia y la posición memorizada ya no corresponde. Restaure sobre el identificador del producto y no sobre una posición en píxeles.
La visualización responsive. Una posición en píxeles calculada en escritorio no tiene sentido si el visitante ha girado el teléfono mientras tanto. Una razón más para razonar en productos y no en distancia.
Los bloques de altura variable. Una banda promocional o un bloque cargado tarde desplazan la cuadrícula. Espere a que terminen de cargarse los elementos situados por encima de la cuadrícula antes de restaurar.
Medir
Bastan dos indicadores, y el segundo es el que cuenta.
El número de productos vistos por sesión en las categorías afectadas. Un visitante que ya no pierde su posición consulta mecánicamente más.
La tasa de vuelta a la categoría desde las fichas de producto. Si aumenta tras la implantación, su recorrido de comparación funciona. Si se mantiene baja, el problema está en otra parte, probablemente en la propia ficha.
El módulo Scroll Infinito para PrestaShop trata este comportamiento en PrestaShop 8 y 9: carga progresiva con actualización de la dirección en cada lote, restauración de la página y de la posición al volver desde una ficha, marcado de los productos ya consultados y botón explícito tras los primeros lotes para conservar el acceso al pie de página.