How to Do a Mobile Friendly Web Redesign

Like SEO, web design itself has undergone a series of sea-changes since the first crude sites appeared 25 years ago including tables, images, Flash and more. But, until recently, perhaps the biggest change to affect the way we think of, interact with and design for the web was the introduction of broadband. Once bandwidth issues were largely a thing of the past, it was thought, web design could finally relax into a type of settled maturity.

But a funny thing happened on the way to the web design vacation home: mobile Internet. Suddenly all those people who never had any real reason to own a PC in the first place abandoned them for the convenience and mobility of their portable devices. The problem is, the world’s billion or so websites weren’t built to be viewed on smartphones. So what to do?

Life is Full of Rude Awakenings

office-desk-laptop-mobile-phone-plan-app

If you’re a business owner with a viable website chances are the folks from IT, have found their way into a high-level meeting or two lately and not simply to warn about ongoing security issues, but instead to inform you that you need to consider redesigning your site for mobile users.

Business owner: “But didn’t we just paid someone beaucoup bucks a couple of years ago to build us a state-of-the-art website?”
IT Geek: “Sure. But the landscape has shifted. Google released a report stating that, for the first time mobile searches outnumber desktop searches. We either embrace RWD or build a dedicated mobile site or say goodbye to online conversions.”
Business owner: “RWD?”
IT Geek: “Responsive Web Design”. That means devising some really clever code that detects the platform the visitor is using and resizes/reformats our content to fit it. It’s sort of like what we used to do for different browsers, just a lot more involved.”
Business Owner: “sigh…”

We feel the business owner’s pain here, but it doesn’t have to become chronic. By approaching the issue methodically you can ensure the process is as trouble-free as possible. Here’s how.

First Things First:

According to Chris Rowan from www.wsidigitalweb.co.uk,

“The first thing you’ll want to consider is whether to overhaul your existing site to make it platform-responsive or simply build a separate website for mobile users.”

In the simplest terms, a responsive site relies heavily on the creative use of CSS Media Queries to determine platform specifics and then reformats content to fit the platform, while a dedicated mobile site serves up a separate, mobile-ready version of your site. But how do you know which path to choose?

Experiment with some Tweaks:

To begin with try accessing your current website on a mobile device. Make a list of what works well and what doesn’t. Next, take the list and use it to physically tweak those things that were problematic. Try removing superfluous images and see what effect that has on the way the site looks. Simplify any contact forms, perhaps removing Captcha features, phone number queries or other things that tend to inhibit completion. If the thrust of your value proposition is getting lost when visitors pinch in to see your site try reformatting the different elements and see which works best.

code-programming-language

Remember: It’s all about the End User:

Even if a few simple tests indicate RWD may be the answer to your mobile issues, though, that might not be the case. This is mostly because responsive design can significantly slow downloading of your website. This is because you’re adding a step into the loading process by forcing the device to resize everything it downloads before displaying it. And since a large percentage of visitors will bail on a site if it doesn’t load within 3 seconds you could actually lose more visitors by using responsive design than by just keeping your existing, somewhat clumsy (for smartphones anyway) site.

The Bottom Line

Mobile Friendly Web Redesign - conclusion

For text-heavy sites like blogs responsive design may indeed be the way to go. But for websites that are more media intensive a separate dedicated website with mobile-ready content may be the right choice. If you need examples of this in action, YouTube and Amazon are two of the most visible. Both eschew responsive design in favor of serving up separate content specially formatted for the mobile user.

Disclosure: Some of our articles may contain affiliate links; this means each time you make a purchase, we get a small commission. However, the input we produce is reliable; we always handpick and review all information before publishing it on our website. We can ensure you will always get genuine as well as valuable knowledge and resources.
Share the Love

Related Articles

Published By: Souvik Banerjee

Souvik BanerjeeWeb Developer & SEO Specialist with 15+ years of experience in Open Source Web Development specialized in Joomla & WordPress development. He is also the moderator of this blog "RS Web Solutions".