4. Now we have to deal with
this
http://bradfrostweb.com
5. The post PC era
http://www.flickr.com/photos/adactio/6152947625/
6. Here’s what we want
http://jboye.com/blogpost/how-jyske-bank-pulled-off-responsive-web-design/
7. How?
Not an app, not a mobile site
RESPONSIVE
WEB DESIGN
(RWD)
AKA somewhat interchangeable (NOT REALLY) = Adaptive, Future Friendly,
Responsible, Progressive enhancement, Mobile First
8. What is RWD?
Websites and apps that are sustainable and future
friendly
We can’t design a new site for each new device,
we should build a flexible adaptive site that can
work on each new device
1.Flexible grid layout
2.Flexible images and media
3.Media Queries
9. How do we do RWD?
Start with the main layouts (Desktop, tablet, mobile -
breakpoints)
Be more flexible about your design, it’s about
proportions not pixels
Design, code, repeat... your plans may not work out in
the browser
13. Content for RWD
Rethink (headers, navigation, search bar, call to action)
Eliminate unnecessary things
Make structured content, not a big dumb WYSIWYG
think XML
Content should be fluid
Content should be consistent across all devices
Create once, publish everywhere