Responsive Web Design, while still a hot topic, is not near the buzz that it was a year ago. Even so, I thought I would lay out how I, through implementation and experience, have come to view its place in the world of web development. According to the author of the book on this subject,[foot]Ethan Marcotte, Responsive Web Design[/foot] responsive web design is comprised of three things:

• Flexible Grid
• Flexible Images
• Media Queries

A Declaration of Terms

For the sake of clarity, I call a variation of this which doesn't use the flexible grid[foot]and, subsequently, flexible images[/foot] "Adaptive Web Design." It really doesn't matter, they both serve the same goal. A design that uses a flexible grid, but doesn't use media queries is a fluid width design. All of these would be viewed in contrast with fixed width design. Responsive web design is a fluid width design that employs media queries to make key adjustments at awkward widths. When the screen width is too narrow for two columns, the design moves to a one column layout. Adaptive web design is a series of fixed width designs that shift at specific breakpoints.

What Responsive Web Design Is, and What It is Not

And the goal of responsive web design?[foot]Or adaptive. Just assume that these are interchangeable for the article, even if the exact implementation differs.[/foot] Device agnosticism. Or, more accurately, viewport[foot]The viewport being the screen size and resolution.[/foot] agnosticism. The misrepresentation that results in detractors is that the method is a mobile device solution. It is not. It may be part of a mobile device solution, but it, in itself, is not. The reality of today's web environment is that people are accessing sites from a multitude of viewports. Responsive web design is a means to design in a way that does not discriminate against that variety. It is a flexible approach to a flexible medium. Responsive web design does not provide solutions for resource limitations, such as low bandwidth, limited memory, or javascript functionality. We should be designing and developing websites that address those issues already. Nor does responsive web design address a user's context, information relevance while walking down a sidewalk versus sitting in an office. It's tempting to assume context by screen size, but we don't have enough information to make that call.

The Role of Responsive Web Design

So where does responsive web design fit into a web strategy? All general purpose websites should be responsive. The content should all be available regardless of screen size or device. Don't assume the users intentions for your main website. If the main website is too resource heavy[foot]See one previous paragraph.[/foot] or you deem that your users have specific mobile needs that should be addressed differently from your website, by all means develop a mobile-specific site or a mobile app, but let the user choose to interact in that context. And never deny them the full information on your main site. Play to the strengths of each implementation: responsive web design, mobile-specific sites, and native apps. Use responsive web design to remain agnostic to a users device and context, use mobile sites to address a mobile context, and use native apps to achieve a more device-integrated experience than possible online.