SEO

Note: By submitting this form, you agree to Third Door Media's terms. We respect your privacy.

Google Finally Takes A Clear Stance On Mobile SEO Practices

Today at SMX Advanced during the iSEO panel, Pierre Far, Google Webmaster Trends Analyst, announced clear guidelines and recommendations on mobile SEO. In short, Google recommends you go with a responsive design when possible, otherwise you can use device-specific HTML but Google asks you to take certain steps to communicate when you are using device-specific […]

Barry Schwartz on June 6, 2012 at 2:06 pm

Today at SMX Advanced during the iSEO panel, Pierre Far, Google Webmaster Trends Analyst, announced clear guidelines and recommendations on mobile SEO. In short, Google recommends you go with a responsive design when possible, otherwise you can use device-specific HTML but Google asks you to take certain steps to communicate when you are using device-specific HTML.

Google has been known to offer contradictory advice on mobile SEO thus far and Google wanted to take a watch and listen approach to see how webmasters were implementing their mobile web sites. Now Google has come out with their official recommendations on how to build mobile web sites that work best for users and at the same time work well for Google.

In December 2011, Google introduced a new mobile user agent for Googlebot-Mobile Smartphones, which was responsible for detecting mobile content. Now Google is offering specific recommendations on which way to build your mobile sites.

Three Methods of Smartphone Mobile Site Design

Google says there are three basic configurations when going mobile, however they do seem to strongly recommend going with the responsive design approach.

Sites that use responsive web design, i.e. sites that serve all devices on the same set of URLs, with each URL serving the same HTML to all devices and using just CSS to change how the page is rendered on the device. This is Google’s recommended configuration.
Sites that dynamically serve all devices on the same set of URLs, but each URL serves different HTML (and CSS) depending on whether the user agent is a desktop or a mobile device.
Sites that have a separate mobile and desktop sites.

Responsive Design Approach

Google says if possible, they recommend you go with the responsive design approach. This is where you use CSS3 media queries to alter the way the page renders on mobile devices. In this case, there is one URL, one content, one HTML code but CSS media queries to specify which CSS rules apply for the browser displaying the page. Google says the advantages of this method include having one URL making it easier for your users to interact with the page and enable Google’s “algorithms to assign the indexing properties to your content.” It is also more efficient when Google is crawling your content because Google doesn’t have to crawl multiple pages.

Device-Specific HTML Approach

If you are going with the dynamic serving configuration, which is fine, Google recommends you use the Vary HTTP header to give Google a hint that the content and CSS may change based on the useragent. The header is commonly used for caching purposes but can also be used in this situation to communicate the content has changed based on the useragent. In this case, it would be used as a indexing and crawling signal for Googlebot-Mobile.

Pierre from Google explains:

As for the separate mobile site configuration, since there are many ways to do this, our recommendation introduces annotations that communicate to our algorithms that your desktop and mobile pages are equivalent in purpose; that is, the new annotations describe the relationship between the desktop and mobile content as alternatives of each other and should be treated as a single entity with each alternative targeting a specific class of device.

These annotations will help us discover your smartphone-optimized content and help our algorithms understand the structure of your content, giving it the best chance of performing well in our search results.

Google has a developer site with more on how to implement this solution. Please note that depending on if you go with the new URL versus the same URL, the annotations Google asks you to use are different. So during your implementation, please read the developer site.

(1) When you use the different HTML approach but the same URL, Google wants you to use the HTTP Vary Header as a hint for GoogleBot-Smartphone to crawl the site.

(2) When you use the different HTML approach but a different URL, Google wants you to use a rel=alternate on the desktop version and use a canonical on the mobile version.

Again, when possible, go the responsive approach but when you cannot, Google can and does support the device-specific HTML approach but remember to communicate to Google that the content is changing based on the useragent.

About The Author

Barry Schwartz

Barry Schwartz is Search Engine Land's News Editor and owns RustyBrick, a NY based web consulting firm. He also runs Search Engine Roundtable, a popular search blog on SEM topics.

Note: By submitting this form, you agree to Third Door Media's terms. We respect your privacy.

We're listening.

Have something to say about this article? Share it with us on Facebook, Twitter or our LinkedIn Group.