Tornando indietro perdi filtri e posizione nella pagina: cosa correggere sul sito

Registrare il percorso prima di cercare la causa

Parti dall’indirizzo dell’elenco. Digita una ricerca, applica due filtri, scegli un ordinamento e raggiungi un risultato abbastanza lontano dall’inizio. Apri la scheda e torna con il comando del browser. Segna quali elementi cambiano: campo, selezioni, numero di risultati, prodotti già caricati e posizione. Un video breve mostra meglio il problema di due screenshot isolati.

Ripeti la stessa sequenza senza filtri e confronta il collegamento interno “Torna al catalogo”. Quest’ultimo potrebbe puntare correttamente a un elenco generico, mentre il pulsante Indietro dovrebbe seguire la cronologia della visita. Distinguere i due casi evita di correggere il comando sbagliato. Annota anche eventuali redirect e l’apertura della scheda in una nuova finestra.

Definire che cosa significa riprendere la ricerca

Prepara un elenco delle informazioni necessarie a continuare: query, categoria, filtri, ordinamento, pagina o quantità di risultati e riferimento al prodotto aperto. Se il catalogo offre più viste, includi quella scelta. Per una ricerca che non produce risultati, il ritorno dovrebbe conservare anche il messaggio e permettere di modificare i criteri.

Non tutto deve essere conservato indefinitamente. Decidi che cosa appartiene alla singola visita e che cosa dovrebbe poter essere condiviso tramite un indirizzo. Evita di inserire dati riservati nei parametri dell’URL. Per le scelte generali sul funzionamento della ricerca, usa la guida alla ricerca interna; qui la verifica riguarda specificamente il ritorno dopo l’apertura di un risultato.

Distinguere cronologia del browser e navigazione interna

Nei siti che aggiornano la pagina tramite codice, la gestione della cronologia è una responsabilità esplicita. La documentazione MDN sulla History API (si apre in una nuova scheda) descrive come associare stato e navigazione. Il tecnico deve verificare che Indietro e Avanti ricostruiscano una situazione coerente, invece di lasciare l’interfaccia scollegata dall’indirizzo.

Non è sempre opportuno creare una nuova voce di cronologia per ogni lettera digitata o per ogni piccolo cambiamento. Concorda un comportamento prevedibile: tornare alla ricerca precedente non dovrebbe richiedere decine di pressioni. Prova anche l’ingresso diretto a un URL copiato, perché può mancare lo stato accumulato durante la navigazione dalla homepage.

Verificare il ripristino rapido della pagina

La back/forward cache descritta da web.dev (si apre in una nuova scheda) può conservare una pagina in memoria e ripristinarla rapidamente quando si torna indietro. È diversa dalla cache dei file scaricati. La sua disponibilità dipende dal browser e dalle caratteristiche della pagina: non conviene assumere che ogni ritorno avvenga sempre nello stesso modo.

Chiedi una prova sia con il ripristino rapido sia con una nuova ricostruzione della pagina. Il sito dovrebbe offrire un comportamento coerente in entrambi i casi. Se uno script reinizializza sempre filtri e campi all’apertura, può cancellare informazioni utili. Il tecnico deve individuare quale passaggio sovrascrive lo stato, invece di aggiungere salvataggi che entrano in conflitto fra loro.

Ripristinare contenuti e posizione nell’ordine corretto

Il browser dispone di un comportamento di ripristino dello scorrimento (si apre in una nuova scheda), che un’applicazione può gestire automaticamente o manualmente. Riportare la pagina a una coordinata prima che l’elenco sia stato ricostruito può però non restituire il contesto desiderato. Il controllo deve includere l’arrivo dei risultati e delle immagini.

Verifica anche la navigazione da tastiera: dopo il ritorno, la persona deve poter riconoscere dove si trova e continuare senza ripercorrere inutilmente tutto il menu. Se è previsto un ripristino del focus, non deve contrastare un’azione già iniziata dall’utente. Per layout che saltano durante il caricamento, approfondisci gli spostamenti inattesi della pagina.

Conservare la scelta senza congelare prezzi e disponibilità

Un catalogo può cambiare mentre il cliente guarda una scheda. Il ritorno deve mantenere il contesto, ma un prezzo precedente o un articolo esaurito richiedono una verifica aggiornata. Definisci quali informazioni ricaricare e come comunicarne il cambiamento, evitando di azzerare automaticamente tutti i filtri per aggiornare un solo dato.

Esempio ipotetico: una persona confronta cinque prodotti dopo aver scelto marca e fascia di prezzo. Uno viene ritirato mentre consulta una scheda. Al ritorno, il sito conserva i criteri e segnala l’aggiornamento dell’elenco; se il risultato precedente non esiste più, offre un riferimento vicino e comprensibile. La prova va eseguita in un ambiente controllato, senza modificare scorte reali per simulare il caso.

Preparare una matrice di prove sostenibile

Verifica almeno una ricerca semplice, filtri combinati, nessun risultato, più pagine caricate e un ritorno dopo un errore di rete. Aggiungi Indietro e Avanti ripetuti, ricaricamento, apertura diretta dell’indirizzo e due schede del browser con ricerche differenti. Gli stati non dovrebbero contaminarsi: cambiare un filtro in una scheda non deve modificare silenziosamente l’altra.

Ripeti i percorsi su smartphone e tablet, anche dopo una rotazione, senza limitarti al computer usato per lo sviluppo. Registra situazione attesa ed effettiva con un risultato chiaro per ogni prova. Inserisci il percorso di ritorno nei controlli dopo gli aggiornamenti del catalogo: una ricerca efficace comprende anche il confronto fra prodotti, non soltanto la prima lista visualizzata.

Domande frequenti

Basta aprire tutte le schede in una nuova finestra?

Non risolve il comportamento del ritorno e può creare altri ostacoli. Il percorso deve restare utilizzabile anche quando la persona naviga nella stessa scheda.

Il filtro deve sempre apparire nell’URL?

Dipende dalla funzione e dalla possibilità di condividere la selezione. La scelta va coordinata con cronologia, privacy e gestione SEO degli indirizzi generati.