Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
Think                            Mobile                            First                            Then                  ...
@karlpro   Karl Dubost           Opera Software           Developer Relations             Think Mobile First, Then Enhance...
Toys?Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Mobile?      Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Mobile?      Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
How faris thescreen?    Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Screens…           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
WAP, C-HTML, …Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Do Nothing             Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Liquid orSemi-LiquidLayout     Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
www.                                                 m.   Think Mobile First, Then Enhance - Karl Dubost - http://my.opera...
User Agent Sniffing?            Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
User Agent Sniffing! Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
User Agents…          Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Cookies… if not then     Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
HTML       Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
viewport           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
viewport  <meta name="viewport" content="wi                                   See @goetter                                ...
mediaqueries    Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
mediaqueriesSee @ppkhttp://www.quirksmode.org/blog/archives/2010/09/combining_meta.htmlbody {// basic styles}@media all an...
Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
user experience            Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Mobile strategy… mess.           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Logs & Market Share            Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Ouch!        Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
User agent… againThink Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Meh…       Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Time To ThinkThink Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Simplicity, Basics, Users         Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
mediaqueriesSee @ppkhttp://www.quirksmode.org/blog/archives/2010/09/combining_meta.htmlbody {// basic styles}@media all an...
Tools & Techniques            Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Co-hosted files           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Sprites          Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
gzip       Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
remote debugging           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Opera Dragonfly           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
love hate            Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Understand Users           Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
Think mobile firsthow come thismore usableon desktop too           Think Mobile First, Then Enhance - Karl Dubost - http://...
Karl Dubost@karlpromy.opera.com/karlcowquestions?                Think Mobile First, Then Enhance - Karl Dubost - http://m...
Upcoming SlideShare
Loading in …5
×

Think Mobile First, Then Enhance

1,317 views

Published on

Published in: Technology
  • Be the first to comment

  • Be the first to like this

Think Mobile First, Then Enhance

  1. 1. Think Mobile First Then EnhanceThink Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  2. 2. @karlpro Karl Dubost Opera Software Developer Relations Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  3. 3. Toys?Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  4. 4. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  5. 5. Mobile? Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  6. 6. Mobile? Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  7. 7. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  8. 8. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  9. 9. How faris thescreen? Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  10. 10. Screens… Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  11. 11. WAP, C-HTML, …Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  12. 12. Do Nothing Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  13. 13. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  14. 14. Liquid orSemi-LiquidLayout Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  15. 15. www. m. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  16. 16. User Agent Sniffing? Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  17. 17. User Agent Sniffing! Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  18. 18. User Agents… Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  19. 19. Cookies… if not then Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  20. 20. HTML Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  21. 21. viewport Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  22. 22. viewport <meta name="viewport" content="wi See @goetter http://slidesha.re/ew4LVM Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  23. 23. mediaqueries Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  24. 24. mediaqueriesSee @ppkhttp://www.quirksmode.org/blog/archives/2010/09/combining_meta.htmlbody {// basic styles}@media all and (max-width: 600px) { body {// extra styles for mobile}} Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  25. 25. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  26. 26. user experience Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  27. 27. Mobile strategy… mess. Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  28. 28. Logs & Market Share Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  29. 29. Ouch! Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  30. 30. User agent… againThink Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  31. 31. Meh… Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  32. 32. Time To ThinkThink Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  33. 33. Simplicity, Basics, Users Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  34. 34. mediaqueriesSee @ppkhttp://www.quirksmode.org/blog/archives/2010/09/combining_meta.htmlbody {// basic styles}@media all and (max-width: 600px) { body {// extra styles for mobile}}@media all and (min-width: 600px) { body {// extra styles for desktop}} Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  35. 35. Tools & Techniques Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  36. 36. Co-hosted files Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  37. 37. Sprites Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  38. 38. gzip Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  39. 39. remote debugging Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  40. 40. Opera Dragonfly Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  41. 41. love hate Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  42. 42. Understand Users Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  43. 43. Think mobile firsthow come thismore usableon desktop too Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow
  44. 44. Karl Dubost@karlpromy.opera.com/karlcowquestions? Think Mobile First, Then Enhance - Karl Dubost - http://my.opera.com/karlcow

×