Can I Make My Existing Web Design Responsive?

Can I Make My Existing Web Design Responsive?

The value of responsive web design is undisputed. If you’re looking to design and build a website in a way that helps viewers on every device to access and enjoy your content, then a responsive website design is normally the best way to go about this. In the last decade responsive web designs has become the industry standard.

Unfortunately, this can leave some people in a quandary.

Whilst it’s all very well talking about the importance of responsive web design when you’re commissioning a new website, what about companies who don’t have the budget for a brand new website? What about businesses who invested heavily in their website and are otherwise very happy with their site? In these situations, it can very easily seem as though you’ve been left behind, particularly if your competitors have optimised their websites for mobile viewers. You might feel as though something has to be done, but that ultimately nothing can be done to improve your user experience.

The good news is that something can be done. It’s certainly not impossible for responsive web design principles to be applied to an existing website.

Web designers call this responsive retrofitting, and the principle is very simple. Just as you might employ a web designer to redesign or update your existing site, we’re often able to adapt the functionality of the website to make it more accessible to mobile users. We can use CSS to adapt the way that a page is presented according to the device that is being used.

Breakpoints and Stacking

A key ingredient in a successful responsive web design is identifying how the site should adapt to a device. It’s one thing saying that mobile users should have a great user experience; it can be rather less straightforward to determine how your content should stack in a mobile browser.

We use breakpoints to determine the maximum width that a given layout will apply to. If the device or viewport is functioning at a lower resolution then this triggers a redistribution of the content. As the image below shows, this doesn’t necessarily solve the problem in and of itself because we need to think carefully about what a mobile user needs to see. 

You might be surprised to hear that some of the responsive website design principles that we use can be applied to any website. You’ll have noticed that smaller devices require larger text and buttons in order to be readable and functional. This is often a mentality shift as much as a technical adaptation. Even if your website is not yet fully responsive, thinking about the way that it handles for mobile users helps to equip you for these changes.  You can check your website for mobile friendliness using this free Google tool here 

As a UK website design company, we’re equally comfortable designing from scratch and helping clients improve their existing user experience. If you’d like to speak to us about responsive web design you can contact us here or check our our portfolio to see some of our more recent projects.