Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Responsive Design - Future Insights Live

Responsive Design - Future Insights Live

Websites are all about content. People can access your content many different ways and formats with mobile devices, iPads, phones, etc. The questions are: how can we maintain control over the display of our content and keep our brand consistent? How can we try to provide the best user experience on any platform? Enter Responsive Web Design. Many experts are not leaning on one static design but on structured content that adapts to its given environment. In this talk, we are going to take a look at responsive web design techniques out there including: progressive enhancement, flexible grids, media queries, flexible images & video, & other methods of implementation.

Sara Cannon

May 07, 2012
Tweet

More Decks by Sara Cannon

Other Decks in Design

Transcript

  1. SARA CANNON Artist, Designer, & WordPress Developer In Birmingham, AL

    Co-founder / Creative Director Range sara-cannon.com @saracannon
  2. Rather than tailoring disconnected designs to each of an ever-increasing

    number of web devices, we can treat them as facets of the same experience. “ - ETHAN MARCOTTE alistapart.com/articles/responsive-web-design
  3. 1. ADAPTIVE GRIDS, IMAGES, & MEDIA 2. MEDIA QUERIES 3.

    TESTING / CRYING TWEAKING 4. ????? 5. PROFIT!
  4. %

  5. CSS3-MEDIAQUERIES.JS code.google.com/p/css3-mediaqueries-js css3-mediaqueries.js is a JavaScript library to make IE

    5+, Firefox 1+ and Safari 2 transparently parse, test and apply CSS3 Media Queries