Video transcription
OK.
Today’s question comes from Scott in England,and it’s a really popular question.
A lot of people have been asking about mobile phones, mobile versions of pages.
So today’s question is this– Is there a way to tell Google there is a mobile version of a page,so we can show the alternate page in mobile search results? Or similarly that page is responsive, and the same URL works on mobile?
OK.
Great question.
So first off, we’re going to assume that when we’re talking about mobile, we’re talking about smartphones. OK, so leave feature phones at the door.
Here’s stuff about smartphones.And we can provide more links and context in the meta descriptions, so that people could read more about this.
But here’s the deal– you want to be able to make sure that mobile version, mobile smartphone users get to the mobile version of a page, and regular desktop users end up on the desktop version of a page.
So, there’s a couple ways you can do this.
Number one, you can do a responsive design. That just means that it is the exact same page that’s served up to mobile users and to desktop users, but that the JavaScript is able to handle that, the CSS is able to handle that.
So one thing to bear in mind is, don’t block JavaScript and CSS. That actually makes a pretty big difference.
If we are able to fetch the JavaScript and CSS, we can basically try to figure out whether it’s responsive design on our side.
So my advice– and I’m going to keep hitting this over and over and over again– is never block JavaScript and CSS. Go ahead and let Googlebot fetch those, interpret those, figure out whether a site is responsive, and do all sorts of other ways.
Like executing or rendering JavaScript to find new links, and being able to crawl your website better.
OK.
So that’s one way to do it, is responsive design.
And if you’re using the same stuff for mobile users and for desktop users, just make sure we can crawl the JavaScript and CSS.
The other way to do it, is to have one version of the page for desktop and another version of the page for regular mobile smartphone users, and to have separate URLs.
So, how do you handle that case correctly?
Well, first off, you want to make sure that on your desktop page, you do a rel alternate that points to the smartphone version of your page. So that basically lets Google know,yes, these two versions of the same page are related to each other because this is the smartphone version and this is the desktop version.
Likewise, on the smartphone version, you want to do a rel canonical to the desktop version.
What that does, is it tells Googlebot about, hey, even though this is its own separate URL, the content is the same. And so it should really all be glommed together on the desktop version.
And so as long as you have those bidirectional links, a rel alternate pointing from the desktop to the smartphone and a rel canonical pointed from the smartphone to the desktop, then Google will be able to suss out the difference between those and be able to return the correct version two the correct user.
Now there’s one other thing to bear in mind which is, you can also just make sure that you redirect any smartphone agents from the desktop version to the smartphone version.
So we look for that. If we crawl with the Googlebot-Mobile, and we see that we get redirected to a separate URL, then we start to interpret and say, ah, it looks like most people are doing that, where they have a desktop version of the page, a smartphone user agent comes in, and they get redirected to a different URL.
Of course, the thing to bear in mind is, just like earlier and we said not to block JavaScript and CSS, one common mistake that we see is blocking Googlebot-Mobile or blocking Googlebot whenever he tries to fetch the smartphone version of the page. Don’t block Google in either case, just make sure that you return the correct things and treat Googlebot-Mobile like you would treat a smartphone user agent. And treat Googlebot regular just like you would treat desktop user.
And as long as you follow those best practices, we should be able to figure out whether a page is responsive, whether there’s a different URL for mobile users, and go ahead and redirect those or show those to users who are searching for mobile search results.
So if you follow those best practices, and we’ll have the links to the definitive information inside of the description of this video, that’s the best way let Googlebot know there’s different versions of a page or the different ways to handle your content correctly for smartphones.
I hope that helps.
Quick Answer: Either use a responsive site or rel=alternate if you have a mobile site with a rel=canonical on the mobile site.