Transferir como PDF, PPTX
Carregado porDiego Eis
Os cuidados e os limites do Responsive Web Design
O documento discute os cuidados e limites do responsive web design, destacando a diversidade de dispositivos e conexões utilizadas pelos usuários. Embora o responsive ofereça vantagens como a manutenção de um único código, ele não resolve todos os problemas, como performance e adequação de conteúdo. Outras abordagens, como o adaptive web design e técnicas de otimização, são necessárias para aprimorar a experiência do usuário em diferentes plataformas.
Mais conteúdo relacionado
Semelhante a Os cuidados e os limites do Responsive Web Design
Os cuidados e os limites do Responsive Web Design
- 1. Os cuidados eos limites do Responsive Web Design ou: O blá blá blá do Responsive Web Design
- 2.
- 4. O que vocêsabe sobre o usuário?
- 5. Você tem umaideia das resoluções que o usuário usa. Não existe uma resolução matadora. Qual a resolução?
- 7.
- 8. Não pense nobrowser, pense no motor de renderização. Qual browser?
- 9. O que vocêsabe é que o mouse existe. Todos usam mouse?
- 10. O cara podeestar em um feature phone ou um computador velho. Nunca existirão apenas computadores rápidos. Computadores rápidos?
- 11. 3G? Banda largacom upload de 2Mb? A Conexão nunca será rápida o bastante. Conexão rápida?
- 12. De qual maioriavocê está falando? Mito: a maioria define os padrões. Será?
- 13.
- 14. usam vários dispositivospara terminar uma tarefa 90% http://bit.ly/google-multi-screen-2012
- 15. iniciam a comprano smartphone e depois terminam em outro dispositivo 65% http://bit.ly/google-multi-screen-2012
- 16. usam a TVe o celular simultaneamente todos os dias 81% http://bit.ly/google-multi-screen-2012
- 17. das interações demedia são feitas em telas. 90% http://bit.ly/google-multi-screen-2012
- 18.
- 19. o que é? Éuma forma de apresentar bem seu layout para um grande número de dispositivos meios de acesso, usando, principalmente, o mesmo código HTML.
- 20.
- 21.
- 22. Nenhum redirecionamento. NenhumaURL nova para o usuário aprender Uma url
- 23. Você mantém umcódigo. Um código
- 24. Você faz apenasUM deploy. Um deploy
- 25. Você não temvários lugares para atualizar seu conteúdo. Um conteúdo para gerenciar
- 26. Mas o Responsive nãoresolve tudo Ele não é a solução para todos os problemas dos sites mobiles. Aliás, o termo "site mobile" está bem fora de moda.
- 27. Manter um códigoé uma faca de dois gumes Como fica a performance para manter um código grande que se adapta?
- 28. Fluxo de navegação Usuáriosusando dispositivos móveis sofrem mais com fluxos complexos e longos.
- 29. Conteúdo O Responsive nãoresolve seu problema de conteúdo. Isso NÃO significa que você precisa servir conteúdos diferentes para mobile e desktop.
- 30. Elementos adaptados Nem todosos elementos usados no desktop são funcionam bem em outros meios de acesso. Nesse caso, você precisa de uma alternativa.
- 31.
- 35.
- 36. o que éRESS? Para começar é um acrônimo que ninguém entende: REsponsive Web Design + Server Side Components ! É combinar a força do RWD servindo pedaços do site (componentes) otimizados de acordo com o contexto que o usuário se encontra.
- 37. É bom para Sevocê quiser ajustes finos de layout. Otimização de performance a nível de componente.
- 38.
- 41. TELAS GRANDES 136 requests- 3.00MB TELAS PEQUENAS 23 requests - 291.94KB
- 42. Cases ruins Eles mudamo site inteiro em vez de mudar apenas algunas componentes.
- 43.
- 44.
- 45.
- 46.
- 47. Ainda está começando Ninguémusa de verdade, por isso, ninguém tem ideia da melhor forma de se fazer.
- 48. Detectar dispositivos ée sempre será um problema Tanto que empresas como a DeviceAtlas, WURFL e Handset Detection tem ganhado algum dinheiro tentando resolver esse problema.
- 49.
- 50. Adaptive Web Designsão várias soluções e metodologias usadas, ao contrário do que vejo por aí, ele não é concorrente do Responsive. Na verdade o Responsive está contido no AWD. AWD é um pacote de soluções
- 51. HONDA ukRWD Adaptive WebDesign RESS Adaptive Delivery ETC… GRIDS Design atômico
- 52. Você escreve códigonivelando por baixo e assim adiciona camadas de funcionalidades, tendo certeza de que tudo funciona em todos os meios de acesso, mesmo quando eles não tem suporte. Progressive enhancement
- 53.
- 54. É a habilidadedo sistema continuar em operação mesmo quando erros acontecem. A natureza inteira trabalha dessa forma. Os browsers trabalham dessa forma. É por isso que você consegue fazer coisas maravilhosas com CSS3 e HTML5 Fault tolerance
- 58.
- 59. Se o fluxoé longo, diminua Por que precisamos ter um fluxo longo complexo no desktop? Só por causa do espaço, por causa do conforto? Não seria mais confortável dar menos cliques e ter um fluxo menor?
- 60. Comportamentos similares Unifique ocomportamento. Minimize comportamentos diferentes entre os dispositivos.
- 61. Não perca tempocom as imagens Continue usando imagens do jeito que você sempre usou. Claro, tente otimizar o máximo possível, mas não fique louco tentando usar versões diferentes para vários dispositivos.
- 62. Não abuse daadaptação Tanto no back-end quanto no front-end. Você vai ter problemas em manter dois códigos e isso pode sair do controle.
- 63. Trabalhe com designe estruturas similares Criar um layout parecido entre as plataformas diminui o aprendizado do usuário, diminuir código e você mantém melhor o controle.
- 65.
- 66. Você começa apreencher um formulário no desktop, mas precisa terminá-lo no smartphone, como sincronizar essa tarefa? Como controlar a sincronização de conteúdo?
- 67. Touch, Mouse, Gesturesetc… Como garantir que todas a execução de tarefas em qualquer dispositivo? Como padronizar as interações de eventos?
- 68. Como seu produtopode interagir com diversos dispositivos ao mesmo tempo? ! Exemplo: http://g.co/racer Como melhorar a interação entre dispositivos
- 70. Pense no usuário nãona tecnologia
- 71. "There is noMobile Web. There is only the Web, which we view in different ways. There is also no Desktop Web. Or Tablet Web." http://bit.ly/no-mobile-web
- 72.