O scroll infinito é um recurso que vem sendo bastante utilizado nos sites para tentar melhorar a usabilidade na paginação de elementos.
Como funciona
Basicamente funciona da seguinte forma: a medida que você usa o scroll do browser em uma coleção de elementos ele carrega sob demanda novos itens, dispensando o clique para realizar a paginação e todo o controle passa a ser feito no scroll do navegador. Com isto ele otimiza a visualização de uma grande coleção de elementos.
Apesar de parecer uma solução ótima para a maioria dos casos, ele também tem suas restrições e deve ser usado no contexto correto.
Quando usá-lo?
Abaixo alguns casos de uso em contextos em que ele deve ser usado:
- Onde a paginação é importante e clicar em novas páginas se torna uma barreira na usabilidade.
- O conteúdo completo é muito grande para ser todo carregado inicialmente.
- O conteúdo está disponível em pedaços como resultados de busca, posts de blog e listagem de produtos
Vantagens
- É melhor carregar o conteúdo sob demanda ao invés de realizar cliques repentinos para avançar para as próximas páginas. Com o Scroll Infinito ele consegue ver o conteúdo subsequente mais rápido.
- Não requer ajuste na habitual forma de leitura do usuário.
- Não precisa de instrução para o usuário sobre como paginar, é mais intuitivo.
- Pode funcionar de forma gradativa se o usuário não possuir Javascript e nem deve afetar o SEO.
Desvantagens:
- O rodapé da página fica praticamente impossível de alcançar.
- É um comportamento irreversível, você não pode voltar ao estado anterior.
- Não há links para um estado definido da página.
- Adicionar conteúdo dinamicamente aumenta a mémoria do Browser, dependendo do Browser, pode levar até 50MB de consumo de memória RAM.
- O Analytics não captura o evento, então é necessário que haja uma configuração especial.
Para todos os casos, é muito importante que a opção de voltar esteja disponível caso o dispositivo não suporte Javascript.
Algumas recomendações:
- O usuário precisa saber quando não há mais conteúdo disponível.
- Ele deve ser implementando com progressive enhancement. A navegação padrão deve estar presente sempre que o browser não suportar Javascript, mas a experiência será mais rica na funcionalidade de leitura.
Algumas referências:
