Responsive Web Design - CSS for mobile devices

Responsive Web Design is, simply explained, a design that adapts it's layout related to the screen space available. For example, we wouldn't want a web page on a mobile device to display the same way as on a laptop computer.  This we want to do accomplish without having to write excessive amounts of code. Enter: Responsive Web Design and CSS Media Queries.

This article will, when finished, give some examples and best practices concernig CSS Media Queries. For the moment I have to first learn it myself. I have done my best to make this site accesible on mobile devices, just view the source of this page for example. :-)

In the meantime, here are some good articles about Responsive Web Design and web design for mobile devices.

• Responsive Design in 3 Steps, Web Designer Wall, Dec 8th 2011
• Responsive Images: How they Almost Worked and What We Need, Mat Marquis, A List Apart, January 31th 2012
• Responsive Design with CSS3 Media Queries, Web Designer Wall, May 11th 2011
• Working with media queries and min-width, Unmatchedstyle
• Responsive Web Design, Ethan Marcotte, A List Apart, May 25th 2010
• Return of the Mobile Stylesheet, Dominique Hazaël-Massieux, A List Apart, January 6th 2009