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.

Responsive Design Heaven & Hell


Published on

Pros and cons of responsive design, choosing between responsive design and other options, things to consider when designing a responsive site.

Published in: Business, Technology
  • Hello there! Get Your Professional Job-Winning Resume Here!
    Are you sure you want to  Yes  No
    Your message goes here
  • Insanely great!
    Are you sure you want to  Yes  No
    Your message goes here

Responsive Design Heaven & Hell

  1. Responsive Design Heaven & Hell* Clarissa Peterson @clarissa*Someone else chose the title, not me.... I’m not quite so dramatic.
  2. UX & Mobile Creatives Meetup September 25, 2012
  3. "So you’re going to make websiteswork better on mobile phones?Because right now they mostly all suck." - my friend whos not a web designer
  4. Mobile
  5. It’s Not About MobileIt’s About the Web
  6. Responsive Web Design
  7. Responsive Web Design
  8. Responsive Web Design A collection of techniques that allowyour website to respond to the device that it is being viewed on.This allows all users to have an optimal experiencewithout creating separate sites for different devices.
  9. Options
  10. 1. Design for the Desktop2. Separate Mobile Site 3. Native Mobile App 4. Responsive Design
  11. Advantages ofResponsive Design
  12. Consistent experience
  13. Content parity
  14. No zooming
  15. Single code base
  16. Device agnostic
  17. URL management
  18. Disadvantages ofResponsive Design
  19. Context of use
  20. Speed/bandwidth
  21. Advertising
  22. Workflow
  23. We aren’t good at it yet.
  24. "Its not like our industry nailed webdesign before we started doingresponsive design. Its still a work inprogress." - Dan Willis @uxcrank
  25. How do you choose?
  26. Content sites vs. transactional sites
  27. Context of use
  28. Resources
  29. Your CMS might decide for you
  30. Don’t do a native app justbecause your boss wants one.
  31. Things to Consider when Doing Responsive Design
  32. Device/browser support
  33. Test on real devices
  34. Brief promo: Device Lab @devicelabdc
  35. Speed/bandwidth
  36. Small-screen first
  37. Let content determine design
  38. Let design determine breakpoints
  39. Consider user experience & business goals first
  40. Communicate with your clients
  41. Responsive workflow
  42. Questions
  43. Resources
  44. A Few Examples of Responsive Design Boston Globe Smashing Magazine People (mobile site) United Pixelworkers World Wildlife Fund Stuff & Nonsense Emeril’s Restaurants Andersson-Wise Architects (HHS) http://aids.govWordPress Theme: Twenty Twelve
  45. BooksEthan Marcotte - Responsive Web Design (2011) Luke Wroblewski - Mobile First (2011) Websites @RWD (Ethan Marcotte) Future Friendly Brad Frost
  46. Articles Responsive Web Design - Ethan Marcotte (May 2010) to Approach a Responsive Design (Boston Globe) - Tito Bottitta (Jan. 2012) Design Process In The Responsive Age - Drew Clemens (May 2012) Making of: People Magazines Responsive Mobile Website (July 2012) Presidential Smackdown Edition: Separate Mobile Website Vs. Responsive Website - Brad Frost (Aug. 2012) separate-mobile-responsive-website-presidential-smackdown/