Google

Why responsive web design beats mobile friendly web design every time

In the huge rush to mobile, it’s easy to get confused between terms. After all, surely if your website is “mobile-friendly” then you’re good to join the party, right?

Actually – no. There is more to this than just making sure your website is mobile-friendly. The variety of mobile devices that people are using to browse your website is growing every day. Not only does this mean a variety of browsers and operating systems, it also means a huge variety of screen sizes.

From the screens of iPads (of all sizes) and other tablet devices to the much smaller screens of iPhones and other smartphones like the Galaxy S4 Mini, your website has to not just look good and be legible, but most importantly, offer full functionality for all users. This means ensuring that full usability is retained and even enhanced when users switch from holding their device between the vertical and the horizontal orientation.

What Mobile-Friendly Website Design Will Do For Your Site

Mobile-friendly design is a little cheaper and easier to convert to from a website optimized for desktop viewing. It basically makes websites work better for mobile devices in a few ways:

  • Font is enlarged to enable easier viewing on smaller screens
  • Menu buttons are also enlarged to enable easier selection of desired sections – remember, mobile users lack the relative precision of a desktop user with a mouse that enables pinpoint selections to be made
  • Images are resized to display smaller on mobile devices
  • With a mobile-friendly site, the server on which the website is hosted is effectively instructing the website how to appear depending on the device used to access it

Some mobile-friendly websites further enable easier browsing by removing some menu options, again making it easier to select the remaining options with a thumb.   Mobile-friendly websites are generally treated favorably by search engine providers and are more likely to be well-ranked for keywords in their search market and geographical sector when users search using a mobile device.  All sounds pretty good so far.  And, no there’s no question it’s a big step forward compared with a website that is only optimized for desktop users.

However, the argument for mobile-friendly web design starts to look pretty shaky as soon as you try to do anything more than just read what is on it. Begin searching for items, adding to cart, and checking out on a mobile-friendly site, and you will find it often isn’t as straightforward as you would expect or wish for.   In addition, as a mobile-friendly website is essentially static, with content that is largely unchanged from the desktop version, you will notice how “clunky” and relatively inelegant a mobile-friendly website looks compared with its desktop equivalent.

Enter Responsive Web Design

Like a superhero sweeping onto your screen, a responsively designed web page is a delight to use, whatever device you are using. Responsive web designs generally appear very differently depending on the size and orientation of your screen.  Amazingly, even though it seems to elastically fit the screen size from a miniature smartphone right up to a widescreen monitor, it’s the same website – this is the magic of dynamic content – web elements that move gracefully to the most useful locations as elegantly as a ballet dancer. If you want to have some fun experimenting with this, try accessing a responsively designed website from a desktop computer, and resize the window from full-screen to miniature, and watch how the entire website transforms in appearance right before your eyes!

There’s much more to responsive web design than meets the eye,  as befits it’s superhero status (here at LeapGo we’re very fond of the saying “great design is invisible”) – it not only uses the device (rather than a remote server) to instruct it how to best appear, meaning it can resize and rearrange itself in seconds when your visitor switches from a horizontal to a vertical orientation, but it also adds other features to enhance the user experience, such as “contact us” buttons that call the company when pressed on a smartphone device.

Responsive web design works so much better with e-commerce stores, too, with a range of form-filling options that far exceed the ease of entering text into a mobile-friendly website. Remember the “rule of thumb” with e-commerce – the easier you can make it for the user to make it all the way through checkout, the more chance the interaction will progress right through to a successful sale.   Just like with mobile-friendly design, search engines will also recognize responsive web design, and are likely to order a responsive site higher in the search results than one optimized for a desktop computer when the user is searching via a mobile device.

Perhaps the most important reason to choose Responsive over Mobile Friendly is the future-proofing element that is built in by default, as Responsive relies on the device rather than a server to help it optimize for each user.   As mobile ownership and usage continues to soar, it’s never been a better time to take the plunge and upgrade to a responsive or mobile-friendly site now. The metrics we talk about here will become more and more critical as users become more discerning. They will soon realize if your website is not performing well when they try to access it from their handheld device, and they’ll be more likely to leave as a result.

Here at LeapGo, we have some substantial experience built up in all kinds of web design. If you have any question that this blog post hasn’t answered, why not ask it using the comment section below?

That’s it for today. I hope you found it useful! Be free to share it with any of your network that might also be wondering which option to go for when optimizing for mobile.