Responsive Web Design (RWD)

Responsive Web Design (RWD) for all Devices

If you're an owner or stakeholder in a website you have a decision to make about your mobile strategy.

It's no longer a question of if you need a mobile site, but How Soon?

Your website should be optimised for all devices, no matter what the screen size, as new phones & handheld devices appear. Creating separate website templates and code for phones & tablets is completely unnecessary. Responsive Web Design (RWD) allows your website to respond and display nicely on the device that it is being displayed on.

We do this by coding the website in a way so that certain elements, such as navigation, is displayed more appropriately for smaller or larger screens. You'll end up with a site that look great on the iPhone, BlackBerry, iPad, desktop computer and everything in between including TV's.

The main features of Responsive Web Design (RWD) are:

Optimised Display on All Phones
Optimised Display on Tablet Devices
Optimised User Experience
Optimized Loading Speed for Smaller Devices
Search Engine Optimised for Smaller Devices
Manage the Same Code, Files and Administration for all Devices

Responsive Web Design

If you want the same content to be viewable on smaller device screens, then responsive design is the way to go. If you're looking for a mobile version that is extremely limited or a stripped version of your full website, this can still be done by hiding portions of the site on smaller screens.

The huge benefits to responsive web design is that it allows the website to use the same code base and the same files for all displays.

Don't forget... there are 6 billion mobile users out there & smaller screen devices are going to be the browsing 'norm' within the next 2-3 years! I sit in the evening with my iPhone and/or iPad... do you?

Examples of Good Responsive Web Design

You can test how the following sites would look on a smaller device (i.e. iPhone or iPad) by grabbing the outside of your desktop browser and making it narrow.

Fastnet Web Design (http://www.fastnetnetwebdesign.co.uk)

Earth Hour (http://earthhour.fr)

The Art of the Brick (http://brickartist.com)

The Sweet Hat Club (http://sweethatclub.org)

Food Sense (http://foodsense.is)

Clean Air Works (http://clearairchallenge.com)

St Pauls School (http://www.stpaulsschool.org.uk)

Remodelista (http://remodelista.com)

The video below shows how to test for a 'truly' responsive web design on a desktop browser.