It’s no secret that mobile search is already important and it is only destined to see continued growth, with some predictions saying that mobile internet usage will surpass desktop usage by 2014. But, in case you needed a reminder, here are some key statistics that will spur your efforts in making your website more mobile friendly:

  • 25-30% of all paid search traffic is coming from mobile devices
  • 61% of customers say when visiting a website which isn’t mobile friendly, they are likely to visit a competitors site
  • A study for the automotive industry found that roughly half of the automotive search audience wanted to make a purchase within the day, while 36% converted within the hour

Now that you’ve decided to make your website mobile-friendly, what’s the best way of going about it, and what SEO considerations are there? The following guidelines can apply to both webmasters wishing to make their site mobile-friendly, as well as to those who already have a mobile site but wish to make sure they’ve done everything they should have done.

There are basically three ways of serving up a mobile-friendly site, each with unique considerations:

  1. Responsive design. In responsive design, the same URL is served for all devices but CSS is used to alter the layout and rendering of the HTML to optimize the site for different screen sizes; e.g. my website
  2. Separate mobile URL’s. This is where there is a different site for mobile devices and desktops; e.g. www.bbc.co.uk and m.bbc.co.uk
  3. Dynamically serving different HTML. Using this method, all devices use the same URL but different HTML is served depending on the user agent (i.e. device).

Responsive design

This is the method of serving up a mobile site that Google themselves recommend. If set up properly on your site, it saves time having to develop more than one form of a page for different devices and also tends to give the best user experience because users are generally not limited in what they can do on the site, and they don’t need to mess about with different URL’s – you are making it as easy as possible for people to link to you and share your content.

Responsive design also allows the most efficient crawling of the site; there is only one set of URL’s and Google can index all of your content with only one user agent. Just make sure that Googlebot and Googlebot-mobile can fully crawl your CSS, javascript and images. If they can’t, then Google may not detect the responsiveness of your site.

Separate mobile URL’s

By far the more common method before responsive design came along, this is probably the least desirable of all three options. Having the mobile site on a different sub-domain means that if people are linking to the mobile version of a page, you are not getting the majority of the SEO benefits of those links.

This also makes mobile URL’s more difficult to share and less people will share – they know that they are viewing a device specific page with a separate URL. Crawling is also more difficult as Google has a different set of URL’s to crawl; don’t make Google’s job any more difficult than it needs to be! But, if you are using this method (perhaps temporarily until you can afford that responsive template), follow these two points:

  1. On the desktop version of a page, use the rel=”alternate” tag, pointing to the mobile version of the page. This helps Google find the location of your mobile pages more easily.
  2. On the mobile version of a page, use the rel=”canonical” tag, pointing to the desktop version of the page. This tells Google which page is “the original” and prevents duplicate content.

Dynamically serving different HTML

Last of all, this method gives a user experience much like having separate mobile URL’s above, but only actually having a single URL (serving different HTML on the same URL is known as dynamic serving). This is the method Google recommends using if you cannot use responsive design for whatever reason.

Dynamic serving is preferable to separate mobile URL’s because Google only has a single set of URL’s to crawl and users will find it easier to link to you (and you will get all the benefit of said links) for the same reasons as discussed in responsive design. When using this method, it’s recommended you use the Vary HTTP Header so that the server sends a hint to Googlebot-mobile that it should crawl the site as well (which isn’t always apparent). Instead of going through all of the technical details here, I’ll point you to Google’s page of developer recommendations here.

What are your preferences as a user? When browsing a mobile site from your phone, do you prefer responsive design or a mobile-specific version of the site? Let us know in your comments below!


Peter Meinertzhagen is an SEO Consultant based in Oxfordshire, UK. Having come into the industry from teaching he’s passionate about training, development, and dispelling the myth that SEO has to be complicated. Follow Peter on Google Plus.