Responsive Design & Mobile SEO: Best Practices for 2013

SMS Text
Responsive Design & Mobile SEO: Best Practices for 2013

We’re shifting into a world in which smartphones and tablets are beginning to rule the roost in terms of connectivity. More people are searching for information via mobile phones, tablets, and smartphones.

Mobile Web Browsing

Mobile Web browsing is on the rise. Photo: http://www.flickr.com/photos/lady-madonna/752175103/

Yelp reported several months ago that about 40% of searches came from their mobile app. BGR chimed in to say that a little more than 10% of all web searches originate from mobile devices. We’re now past the stage of expecting that mobile devices will take over web searches — the process is already underway.

What does this mean for website owners? Or for optimization experts?

The future is mobile and the future is happening right now.

Googlebot Mobile, Google’s Recommendations, and More

Ideas and opinions about mobile SEO were floating around long before Google’s formal recommendations for mobile websites got posted. Following the introduction of Googlebot Mobile for smartphones and feature phones, webmasters and SEO specialists became involved in endless debates about optimal ways to serve mobile websites so they got listed at the top for mobile searches.

I won’t get into the details of Google’s recommendations for making mobile-compatible variations of a web page, but briefly, they are:

  • Make them responsive (serve the same page with an altered design using techniques like CSS 3 Media Queries)
  • Have a separate sub-domain served for user-agents (like http://m.google.com/, http://m.yelp.com/ etc.)
  • Provide different HTML output based on the type of user-agent (desktop or mobile)

Responsive design is the best way forward in the present web demography. There are a lot of benefits, although some experts will tell you that one of the finest ways to leverage mobile SEO is to have a separate domain served based on the user-agent.

Such a method — when you redirect the user to a mobile version of the website based on the user-agent — involves some complicated steps like adding switchboard tags (similar to canonical) and/or using robots.txt to make sure Googlebot Mobile gets to the right version of your website.

A responsive design, on the other hand, discards all such complexity and makes things simple.

Why a Responsive Web is Better

If you’re in the loop of web designers and developers, you probably know that “responsive web design” is the hottest trend right now. Large brands have shifted their focus to designing websites that look good on mobile devices like smartphones and tablets while also looking sharp on a desktop — all with the same content.

The advent of what is popularly called CSS3 Media Queries enables websites to have the same content (and HTML) now, but still render differently between smartphones, tablets, and desktop browsers.

Why this method is better:

  1. Easier to Develop:

Using CSS3 media queries reduces the time it takes to develop and customize websites to meet mobile standards and dimensions. Instead of having to create an entire website from scratch (for the mobile platform), the existing content is merely styled to fit mobile browsers of various sizes.

  1. Simpler Management of Content:

With a responsive design, you have only one set of content to manage instead of multiple pages on multiple domains. This makes it simpler to manage content on your website.

  1. Link Juice & Page Authority Preserved:

One of the greatest benefits from an SEO point of view is that since there’s just one page for desktop and mobile, the page retains its original link authority. There are ways in which a separate domain for mobile can be “related” (something like canonical and alternate methods) and thus retain the authority and link-backs, but this is the simplest of them all.

  1. Google’s Recommendation:

And finally but most importantly, Google has written about having responsively designed websites more than the other options. It favors responsive design for reasons that are more design/code oriented, and those are worth looking at.

How to Tweak A Responsive Website To Meet Mobile SEO

1. Think Local

Recent surveys indicate that search volume for restaurants on mobiles is closing in on that for desktop searches. When people are home, they are more likely to look for things from their desktop. But on the move, it’s the smartphone or the tablet that serves their needs. And when it comes to that, you have to think “local.”

Most mobile search results are largely influenced by geo-specific parameters. This means you have to tweak your website to meet local SEO pointers. This enables Google to identify your optimized website as a suitable result for display in local searches — mobile being one of the most important ones.

2. Think Shorter Keywords

When it comes to mobile phones and tablets, people are using touch-screen keys. They’re not comfortable typing out the entire search phrase, so the keywords they’re using are shorter than normal. Target shorter keywords if you want to show up on mobile searches more often.

Another interesting user experience with regard to mobile searches is that people are more prone to tap the keyword suggestions that Google offers when they start searching for specific terms. Take note of Google’s recommendations and target your keywords based on them. You can get Google’s recommended keywords either while you begin searching for keyword phrases, or on Google’s AdWords Keyword Tool.

3. Think Mobile Analytics

Google’s Mobile section in Web Analytics offers insights into the number of visits from mobile devices like smartphones and tablets. As a webmaster/SEO, you can tweak the results to include more metrics like keywords and thereby track which keywords are driving traffic. Even a cursory look reveals a lot and can give you ideas for small tweaks that will energize your mobile SEO efforts.

4. Think Users First

The best advice you’ll ever hear from the likes of UI/UX experts, however, is this: focus your mobile strategy to help users find information on your website quickly and easily. Forcing users to resort to pinch-to-zoom should be avoided, and having a lot of heavy-load graphics on a mobile website is not recommended either.

Mobile phone users do have 3G (and 4G) connectivity these days, but resources on mobile devices aren’t as powerful as those on desktops and laptops. At least not yet. Users still prefer fast-loading websites that present information well within the smaller dimensions of their smartphones and tablets.

The Way Forward

It has always been a matter of faith that a well-designed, information-rich website will attract both visitors and links. Responsive web design is the next big thing not because it’s a spectacular method of having the same HTML code while varying the design, but because it makes it easy for the user, browser cache, user-agents, and crawlers to track the website. Since the information is the same, it makes sense to have just one page for both desktop and mobile versions.

Local SEO, intuitive and smart keyword targeting, mobile analytics tracking, and a commitment to good usability are the essential elements of effective mobile SEO.

Jayson DeMers
Jayson DeMers is the founder & CEO of AudienceBloom, a Seattle-based content marketing & social media agency. You can contact him on LinkedIn, Google+, or... Read Full Bio
Jayson DeMers
Subscribe to SEJ!
Get our weekly newsletter from SEJ's Founder Loren Baker about the latest news in the industry!