WordCamp Detroit 2012: Getting Started with Responsive Design
At his Getting Started with Responsive Design talk at WordCamp Detroit, Brad Parbs discussed how to get started in responsive design, highlighted main components, discussed layouts, and shared WordPress plugins to use with your responsive design.
Responsive Web Design
- 1. Fluid/flexible grid system
2. Responsive/adaptive media
3. Media queries
- Fluid/flexible grid system
Pixtoem.com - converts pixels to ems for you
Responsive Video Embeds
WP Fluid Videos
* Use to reformat and move things around
* Most of the time you'll change your floats, font-sizes, navigation
* Before you write media queries, think about where you want to place content blocks.
How Do You Test for Devices?
- No way to test for all rendering devices.
* Go visit an ATT or Verizon store, and try your site out on all their devices.
* Actually, learn who your audience is.
* Look at your stats. Test out on those devices.
* Think about what's actually important.
Always strive to make your site beautiful. Take great care with your mobile site, because people will spend a lot of time with it. Spend actual time, do a mockup for each viewport you want to support.
- * Responsive web design is the way to go.
* Media queries rock. They can do anything.
* Don't invent the wheel. There's lots of WordPress plugins out there.
Did you find this story interesting? Be the first to like or comment.