3 ways to roll out a responsive redesign

Making an existing site responsive is a tough challenge; these tips will help you tackle it.

Arguably, it is easier in the long run to create a brand new responsive web design than to make an existing, unresponsive site responsive. However, it is not impossible – far from it – but there are better ways to go about it than others.

The following case studies outline the different methods that organisations have used when rolling out a responsive redesign, to give you some RWD web design inspiration.

01. Responsive retrofit

responsive redesign: retrofit

If retrofit works for your site, it's a good option for a quick turnaround

No magic wand automagically makes a site responsive, but Capital One found that with a componentised backend already in place, it could quickly retrofit its existing desktop site.

Head here for a full account of how Capital One pulled off a responsive redesign in just two months.

02. Parallel beta

responsive redesign:beta

Make sure you get things right by testing it out on your users with a beta

Some companies want users to be able to test out a responsive design and then return to the 'classic' version of the site. Fidelity says its beta approach brought in lots of user feedback.

Listen to this podcast to hear how using a beta enabled financial services site Fidelity to test multiple iterations and learn from user feedback.

03. Mobile-only responsive

responsive redesign: mobile-only

Similarly, using the existing m-dot site to experiment is a good plan

An existing m-dot site can be used as a sandbox for rolling out a responsive design in stages. The Guardian and the BBC delivered their responsive sites to smartphone and tablet users first, before the desktop site.

Go here to hear how the Guardian did it, and here for the BBC's story.

Words: Karen McGrane

Karen McGrane is the author of Going Responsive, a book on responsive web design. This is an edited excerpt from an article that appeared in issue 275 of net magazine.

Liked this? Read these!