Lo scrolling infinito incarna uno degli attributi ideali di ogni buon design: le persone possono usarlo senza pensarci.

Una volta che l'hai incontrato un paio di volte, te ne dimentichi. Direi che molti di noi si aspettano che determinate applicazioni, o forse determinati tipi di applicazioni, semplicemente caricino più contenuti quando arriviamo alla fine di una pagina. E perchè no? È efficace e spesso conveniente.

In alcuni contesti, fare continuamente clic per visualizzare le pagine successive può rapidamente trasformarsi in un trascinamento. In questi casi, l'impaginazione non è uno strumento di navigazione utile, ma un'interruzione dell'esperienza di navigazione. Lo scrolling infinito - anche se ha dei problemi a sé stanti - fa molto per creare esperienze più fluide.

Questo è particolarmente vero quando devi sfogliare grandi quantità di informazioni che sono suddivise in piccoli blocchi. Esempi comuni includono: Twitter, siti di notizie, tumblog, gallerie di immagini e così via.

Certo, non è per tutti, o per ogni progetto. Per quelli di voi che hanno deciso di aggiungere un po 'di amore infinito ai vostri siti, ci sono diversi modi efficaci per applicarlo facilmente al vostro sito:

Scorrimento infinito per siti statici

Nella maggior parte dei casi, probabilmente aggiungerai questo tipo di comportamento a siti / app che hanno contenuto dinamico memorizzato in un database. Ho deciso di includere un collegamento che ruota attorno ai siti statici per due motivi:

  1. Potrebbe essere necessario sapere come farlo in modo specifico. Non si sa mai.
  2. Una volta che sai come aggiungere lo scrolling infinito a un sito statico, probabilmente sarai in grado di adattare le stesse tecniche a qualsiasi tema CMS o CMS con cui hai familiarità.

Questo tutorial da Hongkiat.com offre due diversi plugin jQuery per la tua considerazione, inclusi Scroll infinito di Paul Irish.

Scorrimento infinito per siti WordPress

Non sono sicuro che ci sia un qualche tipo di funzionalità o funzionalità sotto il sole che non è stato reso disponibile per WordPress sotto forma di plug-in. Lo scrolling infinito, ovviamente, non fa eccezione.

Innanzitutto, abbiamo ancora una volta Scroll infinito . Sì. Questo plugin jQuery viene fornito con un'implementazione ufficiale di WordPress fatta anche da Paul Irish. Il link è proprio lì sul sito principale del plugin, in evidenza e visibile, proprio in alto. Inoltre, nella pagina è incluso un tutorial per aiutarti a configurare il plug-in in modo che funzioni con lo specifico tema WordPress, quindi assicurati di consultare la documentazione.

Successivamente, abbiamo la prova che Automattic, la società dietro a WordPress, ci ama e vuole che siamo felici. Hanno creato a Modulo Jetpack che aggiungerà anche lo scrolling infinito al tuo tema. Anche in questo caso, potrebbe essere necessario personalizzare il plug-in per lavorare con il tema specifico.

Ma cosa succede se vuoi approfondire il codice e imparare come farlo da zero? WPTuts + ti ha coperto piuttosto di questo tutorial approfondito . Consigliato per le persone con una conoscenza intermedia del codice di front-end, il tutorial viene fornito con tutto ciò che è necessario per hardcode scrolling infinito nel tema. Alcuni potrebbero anche sostenere che questa è la "maniera giusta" per farlo.

Scorrimento infinito per temi Tumblr

Molti designer e alcuni sviluppatori utilizzano tumblr per condividere i propri pensieri e / o lavoro. Sei uno di loro? Vuoi che il tuo tema Tumblr scorra all'infinito, proprio come il tuo cruscotto? Non guardare oltre Il tutorial di Cody Sherman . Poiché è stato scritto per l'utente di Tumblr non codificante medio, questo tutorial è davvero semplice. Questo ha un costo, però, poiché potrebbe non funzionare con tutti i temi di Tumblr.

Mescolando lo scrolling infinito con altri plugin

jQuery Masonry è il classico plug-in per la creazione di layout in stile muratura sul web. (Personalmente, penso che il nome dia via.) Dal momento che i layout in muratura riguardano solo la visualizzazione di piccole parti di informazioni che sono spesso ben servite da scrolling infinito, non sorprende che molti siti Web combinino i due comportamenti. (Vedere: Pinterest ) Per i siti statici, è necessario consultare la documentazione ufficiale Qui.

L'isotopo è simile in funzione alla massoneria, in quanto è stato creato per aiutare le persone ad implementare i layout in muratura. Lo includo qui perché, a mio parere, in realtà è meglio. Questo è principalmente dovuto al fatto che, grazie a tentativi ed errori, sono riuscito a creare un layout muratura veramente reattivo con questo plugin jQuery. Ho avuto meno fortuna con gli altri. Le tue esperienze possono variare. Controlla la documentazione Qui.

Immagine in primo piano / miniatura, immagine di scorrimento infinita via Shutterstock.