rolagem infinita... o que muda realmente na experiência do usuário e no front-end?
TRANSCRIPT
ROLAGEM INFINITA…O que muda realmente na experiência do usuário e no front-end?
GUSTAVO DAS NEVES
• @gustavodasneves
• fb.com/gustavo.nevesgn
• gustavoneves.com
• gustavo.masterstudioweb.com.br
• about.me/gustavodasneves
O QUE É?Rolagem infinita oferece uma maneira eficiente de navegar em grandes quantidades de informações, sem ter que esperar pois os itens são carregados sob demanda.
Em vez disso, o usuário desfruta de uma experiência ágil em qualquer dispositivo que estiver usando.
QUEM SE BENEFICIA DIRETAMENTE DA ROLAGEM INFINITA?
Aplicações onde não há conteúdo com diferença de relevância. Ex.: Twitter
Portais de conteúdo que “diminuíram" a taxa de rejeição principalmente das páginas iniciais. Ex.: Terra, G1 e outros
PAGINAÇÃO X ROLAGEM INFINITA
CONTRAS DA ROLAGEM INFINITA• TENTAÇÃO
• OTIMISMO
• EXAUSTÃO
• POGOSTICKING
• PERDA DO CONTROLE
• MUDANÇAS PARA OBTER ESTATÍSTICAS PADRÃO (ANALYTICS)
• ADICIONAR CONTEÚDO DINAMICAMENTE AUMENTA O CONSUMO DE MEMÓRIA DO BROWSER, DEPENDENDO DO BROWSER PODE ELEVAR ATÉ 50MB DE CONSUMO DE MEMÓRIA RAM.
• SEO MAIS COMPLEXO
• É UM COMPORTAMENTO IRREVERSÍVEL, VOCÊ NÃO PODE VOLTAR AO ESTADO ANTERIOR.
QUANDO USAR ROLAGEM INFINITA?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.
QUANDO PENSAR DUAS VEZES EM ROLAGEM INFINITA?
Quando houverem dados específicos ou características para filtragem e ordenação nos resultados. Ex.: E-commerce
QUANDO PENSAR DUAS VEZES EM ROLAGEM INFINITA?
BIBLIOTECAS E TECNOLOGIAS PARA IMPLEMENTAR INFINITE SCROLL
JAVASCRIPT, JAVASCRIPT E + JAVASCRIPT
REACT - facebook.github.io/react
INFINITE-SCROLL - github.com/infinite-scroll ou infinite-scroll.com (WP / JQuery)
SLY - DARSA.IN/SLY
AJAX??
ALGUMAS RECOMENDAÇÕES DE IMPLEMENTAÇÃO
O usuário precisa saber quando não há mais conteúdo disponível.
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.
4 DICAS PARA FINALIZAR
Produtividade, bem-estar e estilo de vida
MOMENTO JABÁ ABSURDO
TEM DÚVIDAS?
FALE AGORA OU CALE-SE PARA SEMPRE… ME MANDA UM TWEET OU E-MAIL :)
@gustavodasneves