A Internet móvel não para de crescer e conquistar novos mercados. No âmbito global, um em cada cinco acessos a sites acontecem a partir de um dispositivo móvel e a estimativa é de que até o final deste ano eles passem a responder por um quarto de todos os acessos.
Quem não tem um site responsivo hoje em dia ou focado diretamente para este público está se arriscando a negligenciar 25% do seu tráfego potencial. Adaptar um site para este outro tipo de realidade não é complicado. E felizmente, existem boas opções de plugins de jQuery que podem facilitar esta tarefa ou dar aquela turbinada que sua página precisa para aproveitar tudo que estas plataformas tem a oferecer.
Selecionamos aqui dez opções que valem a pena dar uma olhada:
1) jQuery Navobile
Este plugin para jQuery facilita o processo de criação de um menu que se adapte à tela do dispositivo. Se o menu for longo demais, ele gera uma barra com um botão de acesso que esconde o menu principal. A própria página do plugin funciona como demonstração, basta redimensionar seu navegador.
2) Photoswipe
Combinando o poder do Javascript, do CSS e do HTML, este plugin de jQuery consegue criar galerias interativas de imagens que funcionam com perfeição em dispositivos móveis, movendo as imagens com o passar dos dedos. Ele também oferece os controles manuais de avançar, parar e retroceder. Além disso, o plugin se adapta à orientação do navegador e redimensiona as imagens automaticamente para preencher toda a tela. Confira o demo.
3) jQuery Finger
4) Tocca.js
Esse plugin de jQuery de apenas 1KB é uma alternativa para a detecção por Javascript de eventos típicos de interfaces por toque, como ‘tap’ ‘dbltap’ ‘swipeup’ ‘swipedown’ ‘swipeleft’ ‘swiperight’. Sua demonstração dispara mensagens de acordo com o gesto utilizado pelo visitante. Perceba que eventos como “drag” ou “pinch”, cobertos pelo plugin de cima, não são suportados aqui. Mas nada impede que você combine os dois em seus projetos.
5) Slip.js
Este é um plugin de jQuery difícil de descrever, mas vamos tentar: ele permite que você reordene listas de elementos em dispositivos de toque apenas arrastando os elementos e trocando sua posição. A página oficial também funciona como demo (experimente arrastar os retângulos, funciona mesmo com o mouse).
6) Leader.js
Mais uma prova de conceito do que um plugin jQuery concluído, mas é interessante o bastante para ser mencionado. A ideia é reduzir ao máximo o impacto negativo de formulários web na experiência do usuário, exibindo apenas um campo de cada vez, na medida em que eles forem preenchidos. Experimente o demo minimalista para entender o conceito.
7) jQuery Mobile Date Navigation
Um plugin jQuery essencial para navegação por datas focado especificamente em dispositivos móveis. É possível definir o escopo das datas e trabalha bem com chamadas via AJAX. Confira o demo na própria página do plugin.
8) rFrame
Este plugin de jQuery provavelmente nem será visto pelos seus visitantes, mas será muito útil nos bastidores do desenvolvimento. rFrame emula a área de trabalho dos principais dispositivos móveis dentro da janela do navegador, funcionando como um iframe que pode dar uma visão bruta de como sua página ficará em uma tela móvel. A demonstração funciona apenas no Chrome e no Safari.
9) Responsive Mobile Menu
Uma boa alternativa para implementar um menu de navegação clássica para dispositivos móveis: em telas largas, todas as opções do menu aparecem; em telas mais estreitas, a navegação é substituída por um botão. Este plugin de jQuery oferece também muitas opções de customização. Confira a versão de demonstração.
10) iosscripts
A última sugestão de nossa lista não é gratuita, mas uma solução comercial para dispositivos ativados por toque. São dois plugins jQuery de deslizamento de conteúdo na horizontal e na vertical, com versões demo disponíveis para quem quiser experimentar antes de comprar.
