To be or not to be is not the question anymore. Sorry Sir Shakespeare, with all due respect, the questions of today’s world are much more complicated than that. For instance, knowing the shockingly increasing growth of mobile and tablet devices to browse the web, year after year, poses questions like – to have or not to have one of the following things:
Not so long time ago, one of our reader’s Ryan Gray, asked me a million dollar question about mobile website on this post about How to Redirect Mobile Users On Your Website. That is when we decided we must address this complicated question in a new post and so here we are trying to find out which of the above options are viable for websites of the 21st century.
A. Same Desktop Website For Mobile:
You probably do not have the budget for a mobile website or you think that your users will not get enough information in a limited mobile site that they could get from your desktop site on mobile screens.
The usability quotient is nil on un-optimized full sites for mobile and tablet screens. People have to pinch and zoom, they have to scroll left to right and the hyperlinks and navigation buttons are never finger-friendly.
Shown below is one such website that is same for both desktop and mobile.
Google has two crawler bots, one for desktop called Google bot and other for mobile websites called GoogleMobile bot. If you are serving the desktop experience to your users on mobile, Google may modify your page. A mobile Google search for your desktop site will have resized or adjusted images, text formatting and some functionality changes. If you do not want Google to modify your page you can enter a code in the head section of your desktop website. Learn more about this in aGoogle Help Article on Mobile Viewing.
Nevertheless, given the rate at which users are opting to browse on mobile as much as they do on desktop, it is advisable to have a mobile version for your site.
B. A Separate Mobile Website
Building a separate mobile website is a viable option for businesses that get a high percentage of mobile traffic and whose site depends on functionality more than content. For instance, most of the popular e-commerce websites have a separate mobile site that are customized to highlight certain important actions and eliminates the insignificant elements.
According to Jakob Neilsen, the author of mobile site vs full site, desktop users and mobile users need different functionality on sites as they show different behavorial patterns.
Say for example you own an e-commerce site. A desktop is at the leisure of his home or work with a wide-screen monitor that can occupy a whole lot of information to browse. On the other hand, a mobile user is probably walking on the road and is looking to find a particular product in a particular category with the least number of clicks using just a thumb. Both these users have different browsing behaviors on their different devices. For example, take a look at JohnLewis.com site’s desktop and mobile versions. They are miles apart in appearances and the functionality is changed based on user behavior.
The advantages of having a separate mobile website are as follows:
1. Incredible Functionality:
A separate mobile site or a mobile landing page can be designed to be highly functional and equivalent to a native app. You can eliminate unwanted buttons and offer finger-friendly custom navigation to save the user’s time. These sites come in handy when customers are meant to make quick purchases on the site or access directions to a place or place a phone call with a click of a button.
You will find a few good examples of mobile sites with high functionality in this post on Tips and Tools to Make an Awesome Mobile Website.
2. Enriched Usability:
When you create a site specific to your mobile users, the usability elements of your site is focused on them. Some of the usability elements of a mobile site include, finger-friendly buttons, less cluttered information, prominent call-to-action buttons and a direct button to place a call to the merchant site, ability to locate the business on Google Maps, optimized forms with checkbox and drop-down menus and content hidden in tabs interface in cases where users require more information.
3. Enhanced SEO:
When you create content specific to mobile users, you can add keywords that contain terms such as ‘nearby’ to optimize your mobile site content for mobile SEO.
4. Convenience:
Sometimes it is convenient to create a separate mobile website as modifying the existing content to fit all screens (as in the case of responsive website) can demand a investment of good amount of time and expertise. Not to mention the testing phase to see if the site renders on all devices appropriately. When your main site is coded in a CMS platform it is easier to create a separate mobile-optimized site and redirect your mobile users.
5. The Flash Option:
If you want flash elements on your desktop site you can have them because you have a separate mobile site without flash that is optimized for mobiles.
The disadvantages of a separate mobile website are as follows:
6. Everything is Doubled:
Every changes you make on your desktop website needs to be replicated on the mobile website. Also, the content that you create on desktop website need to be created again for the mobile website but with the mobile users in mind. Both the sites require separate maintenance.
7. Incomplete Or Missing Information:
When you give priority to usability on your mobile site and eliminate certain elements that is otherwise present on the desktop site, this may create discrepancies with the mobile users of your site. Say for instance, an e-commerce desktop site has more options such as related products or the combo price of the product with other accessories or products with offers of the similar kind. These options are eliminated on the mobile version for better usability. There is a possibility that your mobile users who have seen your desktop site would feel your mobile site is inadequate for shopping. They may browse elsewhere because they did not have enough purchasing options put forth.
To overcome this limitation, often separate mobile sites place a link to the full site on the mobile version, as shown below:
But even if users choose to go back to the full site, it brings us back to the criteria that we discussed above about same desktop site for mobile with lots of usability flaws.
8. Faulty Link Sharing:
When you have a separate mobile site you have two different URLs to your business – www.example.com and m.example.com or www.example.com/mobile. Sometimes, your ads targeted to a mobile audience may show up on a desktop site with the mobile site URL.
Take a look at one such example below taken from the desktop version of Facebook that shows an ad containing a mobile site URL.
In another example, your customers may decide to share your page URL from the mobile to their social media profiles.
The following is one such post viewed on the desktop Facebook page that shows a mobile URL from American e-commerce sites, Zappos.
The shared URL above, when opened on a desktop looks very odd, as shown below:
9. Faulty Redirects:
Separate mobile websites use user agent strings from various browsers to detect the device used. Newer UA strings come up from time to time with newer development in browsing technologies. Also, there is no guarantee that the user string detected is from a mobile browser. Hence a separate mobile site can render incorrectly to a desktop user or vice versa.
10. Brand Consistency:
While cutting down on design and content on a separate mobile site can be user-friendly, it is almost always a compromise on brand consistency. For instance, a regular desktop site visitor to your site may not be comfortable on your mobile site as they do not find things that easily as they do on your desktop site. This limitation can, however, be surpassed if you design your separate mobile site in-line with your desktop site design.
11. Link Juice Dilution:
Having a separate mobile website may have a negative effect on overall SEO for your brand. Since you have two URLs you cannot earn the consolidated link juice of both URLs to rank higher in search.
C. Responsive Mobile Website:
If you are counting on Google to rank both your desktop and mobile websites, you must know that they have personally recommended responsive websites (at least for now). The following is an intercept from a Google help article that confirms the same.
Regardless of whether Google recommends it or not, there are a few advantages of a responsive website design that compensates for the flaws in having a separate mobile website. They are as follows:
1. One Website, One SEO:
Although, you will not have the advantage to rank on mobile search for keywords containing the term ‘nearby’ as opposed to those in a separate mobile website, the rest of the SEO on HTML and text content of the site remains the same throughout both desktop and mobile experiences. You can always include the ‘nearby’ keywords to the responsive website among the various other desktop/mobile keywords of your site.
Also, since you have one URL, when your site earns inbound links there is no dilution of link juice.
2. Single Update:
Anything that needs to be updated on the desktop/mobile versions of your site need not be replicated anywhere else. It all happens on one single site thus saving you precious time and labor.
3. Brand Consistency:
Your mobile site does not differ from your desktop site in terms of design and content. Brand consistency increases trust on a brand and improves customer loyalty.
4. No Redirects or Sharing Blunders:
Unlike separate mobile sites, responsive websites are not dependent on UA strings to render the right version of the site. They have CSS media queries, fluid layouts and flexible images to fit to various screen sizes. Since there is no redirects required there is no issue of faulty redirects. Similarly, since there is just one URL that can be shared on social media, a user will never have to be redirected to a different version of the site whether they click the link on mobile or desktop.
5. Content Consistency:
There is no slimming down or omission of content from the desktop site. The content remains consistent both on desktop and mobile versions.
And like any other method, this one also has its drawbacks. Listed below are some of those drawbacks:
6. Little or No Compromise on Functionality:
Although a responsive desktop website looks the same on mobile it does not mean that there is a compromise on functionality, especially in the case of content. Take for instance, the responsive e-commerce site – Currys.co.uk. It offers an optimized experience on mobile, almost similar to a separate mobile site.
Shown below is a screenshot of their desktop interface.
The main navigation horizontal menu bar is reduced to a hidden sidebar within a hamburger icon on the mobile version of the site. Most of the product page and checkout page navigation remains the same.
Now, let’s look at some drawbacks to responsive site design:
Compromise On Quality For Desktop:
This is not a big drawback but it is certainly a compromise on desktop user experience. For instance, the product page of the same Currys.co.uk site we mentioned above looks condensed in a desktop unlike the conventional desktop e-commerce product pages we are used to. Because the website is built with mobile users in mind, the desktop users are made to go through extra clicks to ‘find out more’ information about the product.
Take a look at the following screenshot from Currys website product page on desktop screen:
Costlier:
Building a responsive website from scratch may be costlier than building a separate mobile website.
Load Time:
Since the mobile version of the site also has the same amount of content as the desktop version, there may be some lag in load time. However, this can be easily corrected. But for a site that keeps growing with time with newer products and pages, this may be a concern for faster mobile experience.
Compatibility With Lower-End Smartphones or Feature phones:
Since, the responsive technology is fairly new, it works well only on the newer smartphones. A responsive website may not render well in a lower-end smartphone or feature phones. Majority of the developing country population are using lower-end mobiles that may suffer from poor usability on these sites.
0 comments