Responsive Web Development: Real World Applications

I came across an educational article at Smashing Magazine today that I’d like to share. It’s called “A Foot On The Bottom Rung: First Forays Into Responsive Web Development.” It was written by Gavyn McKenzie, a front-end web developer from the UK.

Responsive Web DevelopmentI’ve been designing and developing responsively (and responsibly) for a while now, and have recently written about responsive web design and how you can make your site usable on any device. My article covered the basics, but there is so much more to talk about concerning responsive design and development.

In the Smashing article, Gavyn details his experience of working on a team to revamp their mobile presence. The team proposed doing away with device-specific apps and developing a single responsive website that could be served to both desktop and mobile users. For this to work, they had to make an existing website responsive while retaining the standard layout for desktop users. He covers various methods of achieving success, best practices, fall-backs, bugs, and problem areas.

Gavyn does a great job of explaining the entire process. He offers various insights into frameworks, media queries, Modernizr, mobile first, CSS columns, CSS gradients, forms, user interface, lightboxes, hovers, date-pickers, and playing nice with older versions of Internet Explorer.

There are often multiple solutions to a problem, and I think he explains the reason for using certain solutions well. Keep in mind that not all solutions will work for everybody because we all have different requirements and expectations.

The challenges Gavyn faced are the same challenges currently being faced by all responsive developers. This real-world perspective on responsive web development really shows how much extra work goes into creating a site that is meant to function and look good on any and all devices.

I’ll sum up with a quote from the article.

You can’t be perfect the first time round, and you don’t have to be. The point is that this technology is ready now, and the sooner you start using it, the better prepared you’ll be for the mobile market as it comes running at you.

– Gavyn McKenzie

2 thoughts on “Responsive Web Development: Real World Applications

    • This site ( is a great example of a real world application of responsive web development. If you don’t have a mobile device to view it on, just click and drag the corner of your browser to resize it. You’ll see how things change as your browser gets smaller.

Leave a Reply

Your email address will not be published. Required fields are marked *