Responsive Web Design

21
Aug 12
Responsive websites. You've probably heard the term gaining popularity lately, it seems to be the buzz word of the moment. And I have to confess, I'm over the moon about it.
 

So for those that don't know, what is responsive design? Well the easiest way to explain it is to show you.

If you're reading this on your computer right now simply resize your browser window - squash it down to half the width of your screen, and then again to an eighth. If you're on a browser other than the dreaded Internet Explorer 6, you should see the content of your page rearrange to best suit your screen size.

So what does this mean? It means that whether you're on a iPad, iPhone, desktop or android you're always going to be served the best viewing experience for your device. It makes it easier for users to browse your site, without having to zoom or scroll to read your content on smaller devices. And it does it all without having to maintain multiple versions of your site. All it does is detect the pixel width of the browser you're using and serves up a different stylesheet dependent on width.

Of course it sounds so simple, why aren't all websites responsive?
Here's the tricky part. Although I love responsive design and think every website should have it (to the point that I resize every website I visit just to check), I also understand the difficulty. If you have an existing site, patching it so that it's responsive is quite time consuming, and while it is possible, the effort involved may not be worth it.

However, if you're thinking your site needs a bit of a makeover, then now is the time to consider it.
There is more to think about when you are designing, you need to work out what/where/how elements are going to flow between screens, but I really do think it's worth the effort. More and more people are viewing sites on their phones and tablets, and it's only natural that this is going to move on to mobile ecommerce as well. So why not make that process as easy as possible for your users.

Want to see some great responsive websites? Media Queries showcases some of the best.

 
Tags: Design, Mobile