The mobile search market is fast rising. Google searches that come from mobile devices now make up 15% of total Google search volume. This rate of growth is expected to continue, and Google continues to maintain the lion share (95%) of all mobile queries.
These two factors alone are incentive enough make an optimized mobile website a priority for your business.
A mobile website design can be delivered a number of different ways. The most common and accepted approaches are through responsive (or flexible) design, device specific HTML, or the use of a subfolder or subdomain—essentially a separate website altogether.
Let’s find out which is best…
1. Responsive Design for a Mobile Website
Responsive design is a succinct format for delivering mobile ready content in one website.
This is done through the creation of varying style sheets that are called based on the device and screen size used by the visitor browsing the website. Each style sheet uses the same HTML file of the page to display the content giving the sense of 3 different website versions.
2. Device Specific HTML for a Mobile Website
Through user agent detection this approach dynamically serves all devices with the same set of URLs, but based on the device (mobile, tablet, desktop) in use will call different HTML and CSS.
This approach does have common issues such as irrelevant redirects and mismatch of user agents (detect a user agent inaccurately)—both of which end with the result of providing the wrong URL version to the website visitor.
Additional Resources: <a href="https://developers.google.com/webmasters/smartphone-sites/redirects" target="_blank">https://developers.google.com/webmasters/smartphone-sites/redirects</a><strong></strong>
3. Mobile URLs for a Mobile Website
By establishing a separate location within the same domain (m.domain.com or domain.com/mobile) the creation of a second, more mobile ready website can also be done.
Within this approach the use of the rel=”alternate” and “rel=”canonical” tag is very important. This will allow search bots to eliminate potential duplicate content confusion as well as assist in their determination of which URL should rank based on the device utilized when performing any given query. [source]
Additionally, to further allow crawlers to locate both versions of each URL you have two options for the XML sitemap.
- Create a separate mobile XML sitemap altogether [source]
- Utilize the rel=”alternate” within the standard XML sitemap [source]
Which is the best approach for an optimized mobile website?
Responsive design is the ideal approach to take when and wherever possible. While each of these 3 approaches can certainly work the evidence and logic—both for the user experience as well as effective search engine optimization—behind a responsive design is strong.
Here are a few quick reasons responsive design is the preferred mobile website approach:
- Resolves any duplicate content issues before they occur
- Optimizes for crawl budget (not duplicating amount of landing pages crawlers have to visit)
- Cuts cost and time for web development, additional content creation and optimization etc.
- You’ll never have to worry about which version of a URL is ranking on which device
- Provides overall better user experience and search optimization
- Centralized link authority (meaning link value is no longer split between two URLs)
Why is a mobile optimized website important for every business?
It really doesn’t matter what your business model is. As more and more users adopt the mobile approach to browsing the regular viewing of your website through a phone or tablet is inevitable. The question is—is your website truly ready for mobile visitors as they arrive?
Looking at the mobile market we can see statistics all over that indicate (check out just a few here, here and here) just how important it will be to adapt to this format of browsing because the likelihood of your target audience using the phone is always going to be high.
So if you haven’t yet developed a mobile ready version of your website I would suggest, “Why not do a redesign of your current desktop website and build responsive (or flexible) design right into it?” If you have already developed a mobile ready website using one of the other two formats, don’t fret—just make sure your implementation is correct to ensure you can perform in the search engines no matter the device the visitor is using.
Additional resources: <a href="http://googlewebmastercentral.blogspot.ch/2012/06/recommendations-for-building-smartphone.html" target="_blank">http://googlewebmastercentral.blogspot.ch/2012/06/recommendations-for-building-smartphone.html</a> <a href="https://developers.google.com/webmasters/smartphone-sites/details" target="_blank">https://developers.google.com/webmasters/smartphone-sites/details</a> <a href="http://www.bing.com/community/site_blogs/b/webmaster/archive/2012/03/07/building-websites-optimized-for-all-platforms-desktop-mobile-etc.aspx" target="_blank">http://www.bing.com/community/site_blogs/b/webmaster/archive/2012/03/07/building-websites-optimized-for-all-platforms-desktop-mobile-etc.aspx</a>