Responsive web design, a term and technique developed by Ethan Marcotte, is an approach that ensures a web page looks good on any screen size or orientation. This approach is becoming especially important considering the wide variety of devices that might display your web page today and in the future. Today, a user may be viewing your site on everything from a 320 x 480px smart phone all the way up to a 1680 x 1280px wide-screen monitor. Throw in all the upcoming tablet sizes (4.5 in, 10.1 in, etc.) that can be used in either portrait or landscape, and you can begin understand the diversity of visual platforms that you must now consider when serving up a site.
Responsive web design is primarily enabled through the use of a new feature in CSS3 called media queries. Media queries allow you to detect various parameters associated with the browser's view-port. Based on these parameters, different layouts, navigation and/or images can be served to the user from a single code-base. For instance if a user is using an iPhone in the common portrait orientation, media queries can detect the size and orientation of the device and serve up custom CSS to optimize the layout.
Example: Sasquatch Fesitival
The site styles for an iPhone sized screen emphasize branding and primary navigation links while teasing content to scroll to below.
This layout comes from the same code-base as the example above. The site styles for a wide screen view (1440 x 900 px) reveals additional primary navigation links along with more imagery and content.
The concept of responsive web design is not without its pitfalls. For instance, mobile browsers tend to load all of the content for the full size site while only displaying the mobile optimized content. Also, responsive web design requires more code to serve up an optimized page for a mobile browser, thus requiring more bandwidth and more CPU usage than would be necessary for a site coded for mobile only. Finally, there are browser support issues, as in it doesn't work in Microsoft Internet Explorer 6,7,or 8 and some non-WebKit mobile browsers.
I liken responsive web design to CSS table-less layouts back in 2005. It wasn't always the easiest to do back then due to various issues including difficult browser support. Today, few would even consider using tables for layout in a modern website. I believe the issues keeping responsive web design in the world of boutique web designs will begin to fall away as mobile bandwidth, CPU and browser support issues begin to disappear. The future of web design will be responsive, and this approach will likely be business as usual in the near future.