Rolagem infinita incorpora um dos atributos ideais de qualquer bom design: as pessoas podem usá-lo sem pensar nisso.
Depois de encontrá-lo algumas vezes, você se esquece disso. Eu diria que a maioria de nós espera que certos aplicativos, ou talvez certos tipos de aplicativos, simplesmente carreguem mais conteúdo quando chegamos ao final de uma página. E porque não? É eficaz e muitas vezes conveniente.
Em alguns contextos, clicar constantemente para ver as páginas sucessivas pode rapidamente se tornar um empecilho. Nesses casos, a paginação não é uma ferramenta de navegação útil, mas uma interrupção na experiência de navegação. Rolagem infinita - enquanto vem com problemas próprios - vai um longo caminho no sentido de criar experiências mais suaves.
Isso é especialmente verdadeiro quando você precisa procurar grandes quantidades de informações divididas em pequenas partes. Exemplos comuns incluem: Twitter, sites de notícias, tumblogs, galerias de imagens e assim por diante.
Claro, não é para todos ou para todos os projetos. Para aqueles de vocês que decidiram adicionar um pouco de amor infinito aos seus sites, há várias maneiras eficazes de aplicá-lo facilmente ao seu site:
Na maioria dos casos, você provavelmente estará adicionando esse tipo de comportamento a sites / aplicativos que tenham conteúdo dinâmico armazenado em um banco de dados. Decidi incluir um link que gira em torno de sites estáticos por dois motivos:
Este tutorial de Hongkiat.com apresenta dois plugins jQuery diferentes para sua consideração, incluindo Rolagem infinita por Paul Irish.
Não tenho certeza se existe algum recurso ou funcionalidade sob o sol que não tenha sido disponibilizado para o WordPress na forma de um plugin. A rolagem infinita, obviamente, não é exceção.
Primeiro, nós temos mais uma vez Rolagem infinita . Sim. Este plugin jQuery vem com uma implementação oficial do WordPress também feita por Paul Irish. O link está bem ali no site principal do plugin, visível e visível, bem no topo. Também incluído na página é um tutorial para ajudá-lo a configurar o plugin para trabalhar com o seu tema específico do WordPress, por isso não deixe de conferir a documentação.
Em seguida, temos a prova de que a Automattic, a empresa por trás do WordPress, nos ama e quer que sejamos felizes. Eles criaram um Módulo Jetpack que também adicionará rolagem infinita ao seu tema. Novamente, você pode precisar personalizar o plug-in para trabalhar com seu tema específico.
Mas e se você quiser mergulhar fundo no código e aprender como fazê-lo do zero? WPTuts + você tem coberto com isso em vez tutorial detalhado . Recomendado para pessoas com um entendimento intermediário de código front-end, o tutorial vem com tudo que você precisa para codificar infinitamente a rolagem em seu tema. Alguns até argumentam que esse é o “caminho certo” para fazê-lo.
Muitos designers e alguns desenvolvedores usam o tumblr para compartilhar seus pensamentos e / ou trabalhos. És um deles? Você quer que o seu tema Tumblr rola infinitamente, assim como o seu painel? Não procure mais do que O tutorial de Cody Sherman . Desde que foi escrito para o usuário médio e não-codificador do Tumblr, este tutorial é muito simples. Isso tem um custo, embora possa não funcionar com todos os temas do Tumblr.
O jQuery Masonry é o plugin clássico para criar layouts de estilo de alvenaria na web. (Pessoalmente, eu acho que o nome dá isso.) Desde layouts de alvenaria são todos sobre exibir os pequenos pedaços de informação que muitas vezes são bem servidos por rolagem infinita, não é surpresa que muitos sites combinam os dois comportamentos. (Vejo: Pinterest Para sites estáticos, você deve verificar a documentação oficial Aqui.
O isótopo é semelhante em função da Maçonaria, na medida em que foi criado para ajudar as pessoas a implementar os layouts de alvenaria. Eu incluo aqui porque, na minha opinião, é realmente melhor. Isto é principalmente porque, através de tentativa e erro, eu era capaz de fazer um layout de alvenaria verdadeiramente responsivo com este plugin jQuery. Eu tive menos sorte com os outros. Suas experiências podem variar. Confira a documentação Aqui.
Imagem em destaque / miniatura, imagem de rolagem infinita via Shutterstock.