This is a brief overview of what’s involved in retrofitting responsive design to your existing site, and I’ll try to hold back the geek talk and technical details as much as I can.
In a previous post I explained what exactly responsive design is, you can read that article here if you like.
If you haven’t read it, all you really need to know is that responsive design is a relatively new practice of building a website that responds to the variable screen sizes of devices today. In the past many sites were fixed width, but with the advent of smart phones and retina displays it has become an ongoing challenge to cater to these devices.
I believe that responsive design is the most logical way to serve up the same site to different devices without building a separate theme or new site altogether. Of course a retrofit will not perform as well as a responsive site built from scratch but it can meet the standards needed to be rendered properly on various devices.
If you’re pretty happy with your current website and just want it to work on mobiles & tablets, a retrofit is for you. If you want a responsive website but don’t have the budget for it then you might have to look at making your current website responsive.
Not all sites are created equal, and a retrofit might not work in some cases:
- Some older websites built with tables will not be eligible for a retrofit; they would need to be built again from the ground up. Most sites today are not made in tables, but if you have content within a table we might have to look into setting those up differently.
- If your website has messy or unintelligible markup it might make it a lot harder to make responsive. We would need to look at your site briefly and let you know.
What’s involved in a retrofit?
I have seen some places offering 5 minute website fixes. These places seem to be looking to make quick buck, and they don’t take into account all the various aspects that need to be altered and styled accordingly. For example, you could make your website responsive in 5 minutes if you knew what you were doing, but then you would probably end up with a website that looked horrible and was unusable, fonts too large, elements hidden underneath others, buttons too tiny for your fingers etc. A retrofit is more than just changing px to %; it’s finding these issues along the way and making sure they work well from mobile to tablet, laptop to high res desktop monitors.
Content and typographic elements needs to be changed for smaller screen sizes. Having a desktop font size at mobile resolution can really make or break a reading experience – try scrolling 4 times just to read a long title – no thanks. These elements need to be styled to sit well in their respective resolutions, to be legible and easily read at all sizes.
Navigational menus are important, if not the most important aspect of a website. If done well they can make your site a joy to use on a mobile! Or alternatively if it’s done badly or not given any attention, a user will find it too hard to navigate and close that little page – never to visit your site again. The frustration of not being able to find the information you want quickly can result in a bad experience and can reflect badly on your brand. Whether you have 3 pages or 30 multi-tiered levels of navigation, it’s possible to make mobile navigation easy, intuitive and even a joy to use.
A fully responsive site built from the ground up will always trump a retrofit at the end of the day, but if you’re low on coin and need to cater to mobile devices, a retrofit could be just what you need.
Whatever your budget or situation, if your interested in future proofing your site and making it work well for multiple device sizes then get in touch!
