Responsive: Au delà du buzzword

Comment conceptualiser et incorporer le « responsive workflow » dans une charge de travail quotidienne. Autant pour le développeur que le designer sans oublier le gestionnaire. Une conférence non pas sur la technique — ou très peu —, mais sur la philosophie du responsive et sur ce que cela implique pour une entreprise et un client.

Transcript

1. Responsive Au-delà du buzzword
2. 2010 Responsive Web Design (RWD) — Ethan Marcotte pour A List Apart
3. 2010 Responsive Web Design (RWD) — Ethan Marcotte pour A List Apart 2012 #2 Top Web Design Trends — .net magazine
4. 2013 Le Responsive est mort! — Etienne Lemay
5. Mort?
6. Mort!
7. Mort! (ou omniprésent)
8. Etienne Lemay @EtienneLem
9. Pourquoi R e spons i v e
10. Top 14 Mobile Screen Resolutions From Jan 2012 to Jan 2013 — gs.statcounter.com
11. 46.77% Des gens ont une résolution inconnue.
13. .
15. %
16. Une Personne Sur Deux
17. Une Personne Sur Deux Presque
18. { Ptit boute technique }
19. @media (max-width: 760px){ body { background-color: hotpink } }
20. @media (max-width: 760px){ body { background-color: hotpink } }
21. @media (max-width: 760px){ body { background-color: hotpink } }
22. Par où commencer?
23. Content First
24. Content First Very
25. Lorem ipsum dolor sit amet
26. Lorem ipsum dolor sit amet Lorizzle fizzle dolizzle sit shut the shizzle up, yo mamma adipiscing the bizzle
27. Lorem ipsum dolor sit amet Lorizzle fizzle dolizzle sit shut the shizzle up, yo mamma adipiscing the bizzle Bacon ipsum dolor sit amet salami shank pork belly, kielbasa fatback ball
28. Lorem ipsum dolor sit amet Lorizzle fizzle dolizzle sit shut the shizzle up, yo mamma adipiscing the bizzle Bacon ipsum dolor sit amet salami shank pork belly, kielbasa fatback ball Letterpress squid twee biodiesel tempor placeat
29. Lorem ipsum dolor sit amet Lorizzle fizzle dolizzle sit shut the shizzle up, yo mamma adipiscing the bizzle Bacon ipsum dolor sit amet salami shank pork belly, kielbasa fatback ball Letterpress squid twee biodiesel tempor placeat Now that we know who you are, I know who I am. I'm not a mistake! It all makes sense!
30. Lorem ipsum dolor sit amet Lorizzle fizzle dolizzle sit shut the shizzle up, yo mamma adipiscing the bizzle Bacon ipsum dolor sit amet salami shank pork belly, kielbasa fatback ball Letterpress squid twee biodiesel tempor placeat Now that we know who you are, I know who I am. I'm not a mistake! It all makes sense! X
31. Variation TYPOGRAPHIQUE
32. Lorem ipsum dolar sit amet
33. Impossible sans le vrai contenu
34. Create content for people not search engines. Content that makes them laugh. Content that makes them cry. Content that makes their lives a little better. “ ” — Brad Colbow
35. En GROS
36. En GROS SEO Friendly
37. En GROS SEO Friendly PAS Surprise
38. Stu compatible avec Photoshop ça?
39. ?
45. Est-ce applicable en tout temps?
46. Responsive vs. m.foozledoo.com
47. Responsive vs. m.foozledoo.com
48. Contenu Contenu Contenu Contenu Contenu Contenu
49. Contenu Contenu Contenu Contenu Contenu Contenu foozledoo.com m.foozledoo.com
50. Contenu Contenu Contenu Contenu Contenu Contenu Contenu Contenu? foozledoo.com m.foozledoo.com
51. Contenu Contenu Contenu Contenu
56. WORST
57. WORST EXPERIENCE
58. WORST EXPERIENCE EVER
60. Click!
63. Click!
65. rly?
66. Des outils? Framework CSS?
67. Yeeeeeesssh.
68. Bootstrap
69. Bootstrap Foundation
70. Bootstrap Foundation Base
71. Bootstrap Foundation Base Skeleton
72. Bootstrap Foundation Base SkeletonKube
73. ATTENTION! Le message qui suit est purement subjectif. Il diverge de la pensée commune. Pour un auditoire averti.
74. Dans la section commentaire personnel Le responsive c’est: de la conception.
75. Dans la section commentaire personnel Un framework c’est: règles préétablies.
76. Ça coûte des bidous le responsive?
77. Charge de travail
78. 30% 50% à
79. Ça vaut la peine?
80. oui parce que le RESPONSIVE
81. est Mort!
82. -_-
83. Web Représenté par Git
84. Web Représenté par Git master
85. Web Représenté par Git master responsive
86. Web Représenté par Git master responsive
87. Web Représenté par Git master responsive
88. Web Représenté par Git master responsive
89. Adopter le RESPONSIVE
90. C’est adopter les nouveaux STANDARDS WEB
91. Mucho thanks! *nosekisses*
92. Etienne Lemay @EtienneLem heliom.ca Questions, Commentaires? Suggestions, Comptines?