What is the Difference Between Mobile Web Design and Responsive Web Design?

Written by on August 2nd, 2013 // Filed under CLIENTS

We no longer solely operate on desktop PCs with fixed sized monitors. We constantly use other pieces of technology to surf the web, whether it’s on our mobile our tablet or our PC. The need to create a site that works across all platforms has never been so large.

How do we do this? Two of the most popular options are dedicated mobile sites, or one site that responds to the device it’s being viewed on.

Here we’re going to look at dedicated mobile sites vs. responsive web design and which comes out on top.

Firstly though, let’s briefly look at what they are.

Mobile Site – A mobile site, as the name suggests is built for use on a mobile phone. It requires a whole new site to be created just for the small screen of a cell phone. This second site mimics your ‘main’ website and shows all of its content in a mobile format.

If a customer was to type your URL into their mobile phone they would be rerouted to this mobile site which typically has a URL like m.holhy.com.

Responsive site – Unlike a mobile website, responsive only requires one site. In basic terms it means that your one website will respond to the device it’s being viewed on. If your customer jumps to your site on their mobile, the site will adjust to the screen it’s displaying.

So that’s what both responsive and mobile are, but which is the better option?

Let’s have a look at the pros and cons of these two web designs.

Mobile site:

Pros – The fact that you require two sites could act as a benefit. If you want your customers to enjoy one experience on their desktop and a completely different experience on their mobile then creation of a mobile site is the perfect choice. Each site can be designed independently allowing greater room for creative differences.

Cons – One of the main problems with mobile site design is duplication. Although I just mentioned the fact that 2 sites can be beneficial in some circumstances, it can also be detrimental.

The first and most obvious problem is the work. Everything you do has to be done twice. The design, the build, front-end development etc, all has to be done for one site, and then again for another. This means one thing – more money spent.

The second con is that ‘mobile’ is a broad term. When I say mobile, which device do you think of? Each has a different form factor and screen size and so one users experience might not be the same as another’s.

Responsive site:

Pros – One of the main pros of responsive web design is that it creates a much better user experience. Regardless of the device you’re viewing a site on, it’ll re-adjust to the most suitable size making your navigation much, much easier. 80% of people leave a site if the user experience isn’t good enough. Do you want 80% of people to do that on your site?

Didn’t think so.

Another pro is that Google likes responsive sites meaning that in terms of SEO a responsive site will work much better. This is because as its one website it will typically receive better page indexing.

Cons – A problem with responsive web design is that the loading of the site over a mobile network can be quite long. This however is being counteracted by the increase in mobile network speed.

Another issue is that it can be a costly investment. It can sometimes be a more time consuming task than creating a mobile site as it’s slightly more complex.

I touched on a mobile site being better suited to people who want a varying mobile experience to their desktop site earlier. With this in mind, a RWD site won’t offer this difference. It simply adapts your existing desktop site to a mobile view not allowing any real difference in usability between desktop and mobile.

The bottom line is that they both have their uses. Depending on what you want from your website a mobile site may suit you better over a responsive site and vice versa. But as more and more of us are using our phones and tablets to surf the web, responsive has become the first choice for many.

Leave a Comment

Name*
Email*
Website
Comment*