Why Responsive is Best for SEO

We’ve established that mobile sites should have the same content as desktop sites, but possibly use a different navigational system. But why are we recommending responsive so strongly?

1. Responsive sites rank for the maximum possible searches

All too often, separate mobile sites end up with different content from the main mobile site. This can come out in a few different ways:

Mobile sites have fewer pages than the desktop site.

This is by far the most common problem I see with separate mobile sites. Since the mobile site is almost always built after the primary site, site owners only recreate “important” pages from the desktop site. But those pages always have some traffic, and excluding them means you’re excluding all of the mobile visitors who would have found those pages via search engines.

Mobile sites have different pages than the desktop site.

If you add content to separate mobile sites that isn’t on the desktop sites, you’re going to run into two problems.
First, it may take longer to get mobile-only content indexed, since your desktop site is most likely stronger than your mobile site, and therefore visited more often by Googlebot. Content on the mobile site will be harder to find.
Second, you’re depriving desktop visitors of that content. Don’t think that desktop visitors are interested in a page talking about Foursquare? Don’t prioritize it in the navigation, but check desktop traffic to the page with your web analytics software. Worst case scenario, your site will have no mobile traffic to some pages and no desktop traffic to other pages, but you’ll have peace of mind knowing you aren’t losing any visitors to missing content.

Mobile sites have the same pages as desktop sites, but less content on each page.

This means one of two things:

1. Mobile visitors get less information than desktop visitors.
2. Desktop visitors get redundant or unnecessary information, and you’re streamlining it for mobile visitors.

In the first case, your mobile site will have a harder time ranking for as many search terms as your desktop site. It’s tempting to include less information simply because you have less information on the screen, but mobile visitors expect to scroll.
In the second case, why do you have that extra information on your desktop site in the first place?

Responsive sites include all pages.

When you want to add content on a responsive site, there’s never a question as to whether it’s aimed at mobile visitors or desktop visitors; it’s just for visitors. If it really is for one or the other, no harm done, visitors will navigate to the information they’re most interested in.

2. Responsive sites don’t have redirect issues

If you write different HTML for the mobile version of your site, you have to tie the different versions of each page together.

Dynamically Served Mobile Sites

Dynamically served sites use the same URLs, but your servers send different code depending on the user agent requesting the page. Left on its own, this can look like you’re “cloaking,” or, serving different information to try to trick the search engine into thinking you have different content than you really do. In order to avoid cloaking penalties, you need to include the Vary HTTP Header.

Mobile Sites with Different URLs

Search engines use URLs like unique IDs, so you never want to put the same content on two URLs. Whenever you do, you need to choose one as the “original” source of the content, and place a rel=”canonical” tag on the “copied” page. Generally, you’ll end up putting the canonical tag on the mobile page pointing towards the desktop page. Google also recommends that you add a rel=”alternate” tag to your desktop pages, letting Google know that there’s a mobile-optimized page out there.

Responsive Sites are Just the Same Site

If you properly tag your desktop and mobile HTML, separate mobile sites can rank just as well as responsive sites. But it’s much too easy to make a mistake with redirects and tagging, especially on smaller pages that you might not think to tag. Responsive sites don’t have that problem, because you’re always serving the same site.

3. Responsive sites (usually) deliver better mobile sites

I say this primarily for business reasons.
If you build a separate mobile site, mobile site changes and updates are separate tasks from desktop site changes and updates, and will probably become separate projects from desktop site changes and updates. Sometimes, mobile site changes and updates will be given to an entirely separate team than desktop site changes and updates.
When mobile site changes are separate, they will usually come after desktop changes, meaning your mobile site will often be behind your desktop site. When you’re building new pages, this will create problems with redirects, since you’ll have to figure out how to redirect mobile visitors to the new desktop page without a mobile version. When you’re just changing the content, mobile content will be inferior to desktop content (and possibly even wrong).
If you have a separate mobile team, they’ll either have to spend their days playing second to the desktop team, or they’ll add more content than the desktop site has, creating more redirect issues (and maybe making the desktop site miss out on great content!).

Responsive sites integrate mobile and desktop changes and updates.

With responsive sites, any changes you make to the site rolls out to the desktop and mobile sites instantaneously. No need for a separate team, no need for separate decisions, no worries about temporary inconsistencies between the sites.