An Introduction to Responsive Design in WordPress By Tom Carney Philadelphia ‘Burbs Meetup, August 14th, 2012
What is Responsive Web Design? Is a concept where the website responds to the device that accesses it and delivers the appropriate output for it uses responsive design. Rather than designing multiple sites for different-sized devices, this concept designs one site but specifies how it should appear on varied devices.
Core Elements of Responsive Web Design1. @media-queries are the breakpoints within the style.css file2. Fluid media assets: Making sure the guts of the website fit into each break point.3. Fluid layout/grid: Using percentages or fluid measurements (em) instead of static units (px) so that the site doesn’t need bottom horizontal scrollbars
Good Responsive WordPress Themes 2011 Theme Responsive and very well coded with current HTML5 and CSS3 standards http://wordpress.org/extend/themes/twentyeleven Skeleton Very simple to use and has a minimal style. Easy to build on or create child themes off of. http://demos.simplethemes.com/skeleton/ Twitter Bootstrap Very flexible, has lots of options to customize it. http://rachelbaker.me/bootstrapwp-theme-twitter-bootstrap-for-wordpress/
Responsive WordPress Plugins WP Touch Pro http://www.bravenewcode.com/product/wptouch-pro/ WordPress Mobile Pack http://wordpress.org/extend/plugins/wordpress-mobile- pack/screenshots/
Great Responsive WordPress Sites http://css-tricks.com/ http://smashingmagazine.com http://createdm.com/ http://www.gosphero.com/