8. Anlise: Funciona bem com algumas telas maiores ou iguais tamanho definido (960px, 1000px) No se importa com mobile No se importa com acessibilidade
9. m ponto tcnica
10. www.globo.com m.globo.com VS
11. Anlise: Funciona bem com algumas telas se tem layout fluido Resolve problema do mobile com verso exclusiva Ruim para tcnicas SEO (Search Engine Optimization) Usurio fica confuso com os dois endereos Redirecionamentos de mobile/desktop e inverso
12. Responsivos
13. Anlise: Funciona bem em todos dispositivos Bom para SEO (Search Engine Optimization) Tratamento de imagens caminhando
14. O que torna possvel design responsivo?
15. Imagens & Recursos flexveis img { max-width: 100%; } Representa 100% de largura no espao em que esto contidas.
18. @media queries @media screen and (min-width: 768px) and (max-width: 992px){ ul, p{ line-height: 1.72em; font-size: 1.0em; } }
19. Developer tools
20. www.browserstack.com/responsive
21. Twitter Bootstrap
22. Suporte Nos diversos tipos de navegadores
23. Hoje, no precisamos se preocupar tanto com IE porque at minha me sabe o que navegador
24. www.caniuse.com
25. possvel dar suporte a navegadores sem suporte?
26. Porque Nem todos os sites so responsivos hoje?
27. Estrutura muito grande O custo no vale o esforo Falta de profissionais qualificados Padres ainda inconsistentes
28. Porque Responsive design to importante?
29. US$ 10 milhes de pagamentos mobile via Paypal Vendas no Ebay mobile = US$ 2 bilhes Vendas de aparelhos mveis ultrapassam a taxa de natalidade no mundo Aplicativos hbridos (HTML5 + CSS3) Webviews