Should You Use a Responsive Web Design or a Mobile Subdomain?

The debate between responsive web design, also known as RWD, and mobile subdomains, known as M-dots or M. subdomains, has raged ever since Apple released the first generation iPhone. The iPhone revolutionised the mobile web and the masterminds at Google realised early on that the mobile web would take over as the most common way to access the internet.

The internet search giant started to push towards mobile eventually being its primary focus as early as 2009 and by 2012 there were clear differences between mobile and desktop search engine results pages.

Whilst a whole host of global companies use either responsive web design or mobile subdomains, what is the right choice for your business? As a web design agency, it’s a question we get asked frequently and we’ll look at the pros and cons of each here.

We’re also going to cover dynamic (progressive) designed websites as they’re often overlooked and most SEOs, marketers and even developers know little about them.

What is Responsive Web Design?

First, we need to answer ‘what is responsive web design?’ or better yet ‘what is a responsive website?’

Responsive web design quickly explained is when you deliver the same website with the same content but with slightly different styling so that it fits into a mobile or tablet sized screen. Going into slightly more detail, responsive web design uses the same URL and HTML code for both the desktop and mobile versions of the site.

The only thing that changes is the CSS also known as styling. In effect, your website is coded the same at the back end and most of the front end but there is code in place at the front end to reformat the way it looks when the site recognises the device is a mobile or tablet.

Google’s table should quickly help you understand the differences between the three available website options. Note, ‘dynamic serving’ is the dynamic website and ‘separate URLs’ is the M. subdomain website.

With the majority of internet users now viewing the web on their mobile phones or tablet devices it means that sites need to be mobile friendly. Responsive web design is often the quickest and easiest way to achieve this, as you only need to code one website with minor changes to the CSS. As a result, millions of websites are now responsive as this functionality is built into sites, not only by web design and development agencies but by also being incorporated into all low cost/free themes available online from sites such as themeforest.

Does keeping Google happy by creating a mobile responsive website mean a responsive web design was the best option for all of these websites?

The answer is, it depends, there are some variables that we have to consider first; the website’s requirements and purpose, financial resources available and the situation of each person or company who owns the site. If we knew the variables for every single mobile responsive website we could then give you an answer on whether every site made the right decision but we don’t know nor would that be very interesting to read.

What we can do is explore the mentioned variables and see which ones relate to yourself or your company, aiding you in your decision about what is the best thing to do. You can also get in touch to speak to a digital expert.

As well as the previously mentioned variables we also have to look at the pros and cons of responsive web design, mobile subdomains and dynamic websites. The pros and cons might not always be an influencing factor in your decision-making because the variables won’t always have as much of an effect on your business as they would for another business.

Responsive Web Design Advantages

Lowest Cost Option

Whether you’re thinking of buying a theme for WordPress or a website design and development agency is building your site, the cost of using a responsive web design is much lower than that of a dynamic website or an M. subdomain website. This is simply because responsive web design uses the same codebase. The same codebase means that the HTML code used for your desktop site is the same as the mobile version. In essence, you’re making one website rather than two websites and that works out much cheaper.

It is also cheaper because the content will be the same on both websites meaning you only have to create one set of written/visual content. The CSS will do the hard work of organising the content so that it displays in a way that works well on both the mobile version and the desktop version of the site.

Having CSS deliver different styled versions of the site is obviously going to require more development time if you’re using an agency. It’s best to use an agency if you have the budget to do so because as themes and web builder plugins go, they can be tricky to get working correctly so that they display your content as you’d want it to on a mobile. To be able to make web builders work properly with themes you often have to know how to edit CSS which means you might as well have used an agency in the first place.

SEO Friendly

Responsive web design is SEO friendly as long as you get the CSS styling right on the mobile version of the site to meet Google’s mobile friendly requirements.

Having one URL for both the desktop and mobile versions of the site means no redirects thus removing the risk of common redirect mistakes. Mobile dedicated websites (M. subdomains) use redirects to get you to the mobile version of the site and can therefore suffer from redirect mistakes.

Dynamic websites also suffer link juice issues when someone backlinks to a 301-redirected page. Basically, if you’ve got old pages redirecting to your existing pages and the user clicks on a link to the old page then the user has to redirect to the new page and then has to redirect to the mobile version of your site.

This counts as multiple redirections which means all the link juice is lost. As responsive web designed websites use the same URL, there is no redirect to a subdomain, which means no multiple redirections and no lost link juice and therefore a better domain authority.

The content also remains the same on both versions of the site which means you only need to use one set of content. This saves you time and money but also means you won’t risk suffering any duplicate content penalties from incorrectly using rel=’canonical’ and rel=’alternate’ tags when using similar content or carbon copied content on the mobile version of the site. This is something you might do with an M. subdomain site (mobile subdomain website) or dynamic website.

Sharing the content, backlinks being an important SEO factor and social shares being an SEO ranking factor of sorts, is easier for responsive web designs as the URL remains the same. Whereas, if someone wants to share the URL of a mobile subdomain on another site or on social media they will share the mobile URL. So, when the person clicks on the shared URL and they are on a desktop PC or Mac the site will have to redirect to the desktop version of the site and that’s when common redirect mistakes can rear their ugly head.

Single URLs used by responsive web design sites mean that you won’t get multiple versions of the same page ranking in the SERPs. Poorly built M. subdomain sites can mean you get both the desktop version of the site and mobile subdomain version ranking in the SERPs which Google can penalise you for.

This can confuse customers and stop either result being clicked on which results in lower CTRs (Click Through Rates). Meaning Google will lower your ranking in the SERPs and you’ll also have a lower your conversion rate on site whether that be for sales or leads.

Quickest Website Build Time

As you’re only building one website you only have to code one set of HTML which means the website build project is a lot quicker. If time is important to you and you want to get the project launched as quickly as possible, responsive web design can often be the right solution. However, it can take some time to tweak the CSS to make the mobile version of the site work perfectly.

Build time shouldn’t always be a factor and proper planning is key in making sure time isn’t an issue with a web build. Make sure you speak to your agency about build time and don’t expect that just because you’ve got more money to spend on the project to get it built quicker the agency will be able to oblige. No agency worth their salt will take extra money to build a website quicker if they believe the timescale is too short to allow proper testing, client changes and bug fixing. More money isn’t always the solution and a properly functioning website should always be the end goal here not just the finish time.

Responsive Web Design Disadvantages

Site Speed

Site speed of responsive web design sites can be an issue vs M. subdomain websites and dynamic websites. Due to the loading time needed for a website to recognise that the device being used is mobile and then for it to load different styling, means this can make page load speed slower than the other two options.

If page speed is an issue, which it can be for ecommerce sites, who need page speed to be as quick as possible to maximise conversions as consumers are impatient. Then responsive web design with lots of CSS can be a real issue for ecommerce sites as page speed is slower in comparison.

The same is true for any site where one of its biggest user requirements is near instant load time. The way around this is to use a simple design for both the desktop version and the mobile site to reduce the CSS required. Coincidentally, simple designs and styling lead to better conversion rates and therefore less CSS goes hand in hand with this.

Increased Bugs During Build

When the mobile version of the site is being styled, it can often lead to bugs and errors due to the range of different screen sizes and orientations available. Bugs can often include cropped images, text being the wrong colour or font, text not fitting on the screen properly, videos not embedding correctly or playing full screen once fixed, contact forms not working correctly or fitting on the screen, drop down menus and sliders not working properly or buttons not clicking correctly.

These are all fixable but it can add time to the build if you are on a tight schedule and bugs might not always be picked up straight away in any of the testing stages if the bug is only on one obscure page.

User Experience / User Interface Issues

Users will run into all sorts of issues when testing the site and because the styling of the site is very different to that of the desktop version it will lead to some bugs popping up during testing.

Verb use testing to make sure we create the best user experience possible and avoid these issues appearing after launch. However, nothing can give you better feedback than running the site with actual users once launched and this is often where obscure bugs are picked up. You will always need to make changes to the CSS later on so the user experience is perfect and the user journey is seamless. A good agency will provide post build support with the cost of this written into your contract to help you smooth over any UX / UI issues after launch.

What is a Mobile Subdomain?

A mobile subdomain is a specialised subdomain that serves specifically for delivering content optimised for mobile devices. It stands in contrast to responsive web design, which employs the same URL and HTML code for desktop and mobile versions, modifying only the CSS for different displays. The mobile subdomain hosts a distinct version of a website, crafted to meet the unique needs and constraints of mobile devices like smartphones and tablets.

Key characteristics of a mobile subdomain are its separate domain, often named m.example.com or mobile.example.com, where “example.com” is the main site. This subdomain functions as an independent entity within the main domain. The user experience is optimized for mobile, with content and layout tailored for smaller screens and touch interfaces, including simplified navigation, reduced image sizes, and a vertical orientation-friendly design. The content management in a mobile subdomain may vary from the main site, focusing on mobile users’ essentials. Additionally, updates to the mobile subdomain can be made independently from the main site, allowing for specific adjustments and features suitable for mobile users.

Are mobile subdomains the same as subdirectories?

In contrast to mobile subdomains, subdirectories are a different approach to organizing website content for various devices. Subdirectories are part of the main domain and are located after the domain name in the URL structure, such as example.com/mobile. 

Unlike a separate mobile subdomain, a subdirectory is integrated within the main website’s architecture and shares the same server and backend. This integration often means that the subdirectory uses the same content management system and backend database as the main site. 

Subdirectories are frequently used in conjunction with responsive web design, where the same HTML code serves both desktop and mobile users, but the display is adjusted based on the device.

Mobile Subdomain Advantages

Site Speed

Site speed will be phenomenal as the mobile version of the site will have been built using HTML and CSS specifically designed for the M. subdomain. This can be particularly useful to ecommerce sites and sites where the user is very impatient e.g. Facebook. Site speed is an SEO ranking factor for Google so the better it is, the higher you’ll rank if all your other SEO is carried out correctly.

Your conversion rate will also see some gains due to your super fast page load speed. Users who have more time to ponder their purchase between pages loading are more likely to not purchase a product as they start to consider all of the usual things like cost, should I buy this, can I afford this, is this necessary, shall I wait until pay day and shall I just buy it next time. This means if the user leaves the site, the competition are back in with a shout to gain the user’s custom for a similar product or service.

User Experience / User Interface

User experience is always going to be great because the site has been built and designed for mobile separately from the desktop version of the site. The user journey will be smooth and there will be much fewer UX / UI issues in the testing stages than with a responsive web design.

This better initial UX will mean better conversion rates, lower bounce rates and less headaches from bugs and things not working as well as they should when the site is launched. If these things are important to you, an M. subdomain can really be an advantage for you, particularly if you have tens of thousands of users to your site each day, making purchases or contacting you about your services or products.

Mobile Subdomain Disadvantages

SEO Roadblocks

Your site is an M. subdomain and therefore, your content sits on a subdomain which if the content is the same as your desktop site or fairly similar could land you with a duplicate content penalty if you haven’t used your rel=’canonical’ and rel=’alternate’ tags properly.

This can mean you lose lots of your core keyword rankings or see a significant drop in their position within the mobile SERPs and desktop SERPs. The other issue with content on mobile subdomain websites is the temptation to remove loads of the content to make the design process quicker and simpler.

This will negatively affect your SEO unless you’re an ecommerce site selling hundreds of different variations of the same thing. If you only sell 5 variations of the same product it means your keyword is probably only mentioned 5 times because you’ve cut out the other content on the page.

Redirects are also an issue and this means an initial slow down in load speed as the redirect takes place from desktop to mobile. It can also mean if you have redirects to your desktop URLs, you get a multiple redirection issue as the site has to redirect to the mobile version after being redirected from the previous page. Multiple redirections are frowned upon by Google and it means you lose all your link juice which would have come from the original URL that you redirected from initially.

This leads us to issues when sharing the site. If someone copies the URL on their mobile to share on their social media channel or their website they will share the mobile subdomain version. This means if a desktop user clicks on the link, they have to first redirect to the desktop version of your site, which slows load time and if the user is impatient they might leave before the redirection finishes.

There is also the risk of multiple versions of the same page appearing in the SERPs if you haven’t used your canonical tags correctly. Multiple versions of the site appearing in the SERPs won’t please Google and can result in a penalty; it will confuse users and reduce CTRs and increase bounce rates as the user comes onto the site and redirects to a different version of the site.

Build Time

As we’re making two websites, one for mobile and one for desktop, this requires twice as much time as you have to code two separate codebases. This also means two sets of testing and two sets of bug fixing. You’ll also need to test the website to make sure it doesn’t index both versions of the site. If you’re operating on limited time this means a mobile subdomain website might not be the best solution because with the time it takes to build and test you’ll be cutting things close. Whereas if you used a responsive design, it would take almost half the time to build, test and launch.

Cost

The cost of building two websites is much higher compared to a responsive web design where only the CSS coding needs to be altered to allow for different styling on mobile devices. If cost is an issue to you, a mobile subdomain website will not be the best option for you to take. If however, cost isn’t a factor in your decision process then a mobile subdomain website can in theory be an option for you.

Dynamic Advantages

Site Speed

Dynamic websites, like their M. subdomain counterparts, are designed mobile first and are therefore superfast. They are sometimes faster than M. subdomains because they don’t use a redirect and therefore, they don’t slow the page load speed. Their site speed is super fast due to the fact they are designed specifically for mobile and are often converted from Apps so the styling is simple and uses less CSS and JavaScript to render the site. They are particularly advantageous for ecommerce sites who require the best site speed possible to increase conversions or for sites whose users are particularly impatient and who want instant load times.

User Experience / User Interface

User experience is naturally better than mobile responsive websites in the initial testing stages and launch due to the fact that the site was designed specifically for mobile first. This will result in less time spent on fixing the UX when building the site, allowing the developers to focus on other areas of the site and spend more time testing it.

SEO Friendly

The site will be relatively SEO friendly because the content is coming from the same URL, unlike an M. subdomain site. This makes backlinking to the site easier as the URL remains the same and therefore no link juice is lost through multiple redirects. The same is true for sharing on social channels as the URL is the same. This also stops the redirection issues we mentioned earlier with M. subdomains as the URL remains the same and therefore none of the common redirect issues or multiple redirect issues appear.

Dynamic Disadvantages

Build Time

Due to the fact the site uses different codebases as it delivers different HTML, it means the build time is much longer than a mobile responsive website. Mobile responsive sites use one codebase with different CSS whilst dynamic sites use two codebases with different CSS. Dynamic sites work out which sort of device you are on by using the Vary HTTP tag to identify the device and thus how to style the CSS for your screen size and orientation.

Cost

Dynamic websites are similar to mobile subdomain websites in the sense that they use two separate codebases, meaning you need longer build times, resulting in greater expense during the web development stages. It will also mean more testing which takes more time as you have to test each version of the site to look for bugs and to test the UX. If cost isn’t a factor in your decision making then a dynamic site might be the correct option for you.

User-Agent Mismatch

User-agents are identifiers which tell a website what type of device is being used to view the site. Dynamic websites are programmed to recognise thousands of them from specific things like Googlebot (Google’s indexing robot) to an iPhone, Android device or a MacBook.

These user-agent lists must be kept up to date. However, with so many new devices launched everyday it can be hard to stay up to date. If the list is wrong, you can get a mobile version of the site delivering on desktop and vice-versa.

It can also mean that Googlebot thinks your site is the desktop version when it is, in fact, the mobile version and it indexes the mobile version instead, which adds this to the SERPs and results in a duplicate content penalty. To make sure this doesn’t happen, you need to make sure your user agent lists are kept up to date and tested regularly.

Variables To Think About

Now we know the pros & cons of each option we need to look at the variables. Using the variables we can then add the advantages and disadvantages of each option to this and make a decision.

The best variable to start with is the financial resource available for the website build. If the finance available is limited and you wish to pursue the best value for money option then you need to focus on a responsive web design.

A mobile subdomain site or dynamic website can be between 40%-100% more expensive than a responsive web design website. If it’s a standard simple brochure site, you’re looking at 40% more expensive; and if it’s an ecommerce site, you could be looking at something 100% more expensive than an ecommerce website built with responsive web design. This price variable can instantly remove the option of creating a mobile subdomain website or dynamic website.

If however, you can afford this premium, then we can look at the rest of the variables to see if an M. subdomain or a dynamic website is the right choice for your business. Beware of web design and development agencies who say they can build you an M. subdomain or dynamic website for a very low price.

The site won’t work properly and it’ll be a total waste of time and more importantly, money. If you’d like to know the cost of a website design and build then you can contact us and tell us what you need. We can talk you through what you want and send you a quote for the work. We also do this for responsive web design sites so no matter what your query, we’re happy to help.

The purpose and requirements of the website are what we have to look at next. Is the site going to be a brochure site, ecommerce site, news site, social media site, lead generation site, etc.? Now we know the purpose of the site we can look at the requirements for each kind of site and narrow our options down further.

If the site is going to be an ecommerce site, news site, social media site or any website that requires extremely fast page load speeds, then an M. subdomain site or a dynamic site might be a good choice.

However, you can get page load speeds that are a fraction of a second slower on responsive web design sites if they’re built correctly by the agency and you’ve got a monthly SEO retainer with them to monitor that sort of thing. So a responsive web design can also be just as good, bar a couple of hundredths of a second, and half the price of an M. subdomain website or dynamic website.

If the best page speed possible is the end goal, then an M. subdomain website or dynamic site is probably the right option for you if you can manage all of the previously mentioned disadvantages that come with those two options.

If your site is going to be a standard brochure site or lead-gen site, then we’d advise against using a dynamic website or M. subdomain website. A brochure site doesn’t require the best page speed possible and a responsive web design website will be more than enough. It’s like using a Ferrari to go to the shops, it would be impractical, pointless and a waste of resources to do so when a Mercedes would get you there a few seconds later. Therefore, the best option here is to use a responsive web design site.

Finally we can look at the situation of the person or company wishing to have the website built. A person or company’s situation will boil down to one thing, time! For example, you might be in the situation of requiring lots of complicated functionality to be added to the website such as customer and staff login, you might need to add tens of thousands of products each with variations in colour or size to the site, or you might want a custom built CMS, and these are all different situations that each individual or company finds themselves in.

However, any decent web development agency worth their salt will be able to do all of this for you but the only issue will be time. The bigger the website build, the longer it will take and therefore the only situation you are in, is one of time. So, what time frame are you working on?

There may have been months’ worth of pre-planning to make sure an agency was found in time and the budget was approved but like all plans, things can go awry and your delivery date might now be a lot closer than it was before. In this situation, a responsive web design is going to be your best option as it’ll take roughly half the time to build, test and deliver. Even if time isn’t that tight a mobile subdomain site or dynamic website will really stretch the boundaries you have in order to build two versions of the site and test both of them in time. Therefore, a mobile subdomain website is only advised if you have plenty of time to work with.

So What’s The Best Option?

To conclude, if we can, mobile responsive web design is the best option for the overwhelming majority of projects and would more than suffice for the remaining minority of projects that might suit a mobile subdomain website site or a dynamic website.

The financial resources and time needed to build mobile subdomains and dynamic websites, to gain miniature increases in page speed, mean that in reality, most sites don’t need a mobile subdomain site or dynamic website. If you’re planning to build the next YouTube, Facebook, or Amazon then a serious conversation about M. subdomains or dynamic sites can be had.

However, bear in mind that even Amazon uses a responsive web design. So it’s fairly safe to say that responsive web designs are a good bet if one of the leading online retailers use them.

If you’d like to discuss building and designing a website with VERB, or if you’re still unsure about which of the above web build options are best, get in touch.