O documento aborda o design responsivo na web, enfatizando a importância de adaptar sites para diversos dispositivos, especialmente após a ascensão dos smartphones a partir de 2007. Destaca três componentes principais para o design responsivo: media queries, layout fluído e imagens flexíveis, além de promover uma abordagem mobile first centrada no usuário. Inclui referências e links para mais informações sobre o desenvolvimento de design responsivo.

1. Responsive Web Design
Um site, um conteúdo e muitos dispositivos

2. Tudo começou em 2007. Com a vinda
do iphone o mundo mudou, desde
então temos um browser completo e
usável sempre à mão.

3. Mobile cresce como nunca
vende-se mais smartphones e
tablets que computadores

6. em outras palavras...
Smartphones, tablets, televisões,
celulares, TVs, video games,
netbooks, notebooks e desktops!

7. Como, então, atacar o mundo
móvel de hoje e de amanhã?

8. Responsive Web Design

9. Como faz então?

10. São três ingredientes principais

11. Media Queries

12. Layout fluído

13. Imagens Flexíveis
Desktop
iPad
iPhone

14. Responsivo, mas...
situações reais, soluções baseadas em necessidades

15. Responsive no
javascript? como?

16. https://github.com/globocom/responsive-hub

17. O conteúdo que importa

18. Mobile First

19. Por Fim
do conceito ao desenvolvimento, o foco é o usuário

20. Dúvidas

21. Referências
Sergio Lopes - Design Responsivo por uma Web Única
http://sergiolopes.org/responsive-web-design/
Dicas de Web Mobile com viewport
http://blog.caelum.com.br/pixels-pixels-ou-pixels-dicas-de-web-mobile-com-viewport/
Fabricio Teixeira - 5 coisas que aprendi em um projeto Mobile-
First Responsive Design para o Google
http://arquiteturadeinformacao.com/category/responsive-design/page/2/
Exemplos de Layout responsivo
http://mediaqueri.es/

22. Obrigado :)
@danielacfilho
daniel.acfilho@corp.globo.com