What Is
Responsive
Web Design?
Responsive websites
respond
to their environment
Adaptive
(Multiple Fixed Width Layouts)
or
Responsive
(Multiple Fluid Grid Layouts)
...or
Combo
Fluid Width
Small Screens
+
Fixed Width
Medium & Large
Why?
“On average, Americans spend 2.7 hours per day socializing on their mobile device. That is twice the amount of time they spend eating, and over 1/3 of the time they spend sleeping each day.”
Small + Medium + Large
One Site
For Every Screen
Who?
Not just demos, design shops and vanity pages
Real Client Work
Barack Obama
The Obama campaign continues to be at the leading edge of web technology
barackobama.com
...and plenty more
http://mediaqueri.es
When?
The TIME is NOW
Things to Consider
Time & Money
Browser Support
Performance & Content
How?
Mobile traffic makes up 20% of all Internet traffic,
but 90% of all websites aren't mobile optimized..
Smartphones
iPhones
or
Tablets
iPads
Best Practices
Content Check
Start Small
Mobile First
Exit Photoshop
Enter Browser
Think Modular
Always Be Optimizing
*Best practices still emerging
Where?
Credits
an impress.js presentation by Dustin Gzym
Responsive Web Design Graphic by Bakken & Baeck
Responsive Web Design Book published by A Book Apart
Open Sans Font by Steve Matteson
impress.js created by Bartek Szopka