As more people use mobile as their primary device to search the internet, Google is placing greater emphasis on mobile-first indexing.
Essentially, Google robots prioritize the mobile version rather than the desktop version of a site when they crawl and index it.
In turn, this encourages webmasters to create mobile-friendly sites not only for UX but to gain an SEO advantage for mobile searches.
Of course, there are many best practices for mobile-friendly SEO on Google. Here, we share two of these best practices—responsive design and mirrored content—to help get started optimizing your site for mobile and ultimately driving more traffic.
Mobile SEO Best Practice #1: Responsive Web Design
Mobile-friendly SEO works best when you have a responsive web design, meaning that your site serves the same HTML code to all devices but with different CSS style rules to optimize the site’s interface across desktops, smartphones, and tablets.
Responsive design is the highest recommended mobile-friendly SEO best practice in terms of structuring your site for mobile and desktop.
Mobile SEO Best Practice #2: Mirrored Content on Mobile and Desktop
However, if you don’t have a responsive web design and instead you have separate URLs for the mobile and desktop versions of your site, this is still okay, but you may experience a problem: Your mobile site is appearing in desktop searches.
Of course, you don’t want this to happen. Rather, you want the desktop version appearing in desktop searches and the mobile version appearing in mobile searches.
To do so, start by making sure that your mobile site contains the same content–mirroring it exactly–as your desktop site. Structured data and meta data should also be present on both versions of your site.
Canonical Tags + Alternate Tags
After mirroring your content on your mobile and desktop sites, all you need is a canonical tag and an alternate tag. You may wonder what these tags are? No worries. We’ll explain now.
Canonical Tag
Google sees pages that share the same or similar content as duplicate pages, which results in a 200 error status code. Essentially, duplicate content confuses the search engine on which page should be ranked. In this sense, if your mobile site has the same content as your desktop site, Google would view it as duplicate. That’s without a canonical tag.
However, adding a canonical tag to your code stops two duplicate pages from getting simultaneously indexed and directs Google on which page to rank, as the canonical tag tells the search engine which URL is the master copy that should be indexed.
Therefore, when your site has a desktop version and mobile version, you should add a canonical tag to both the desktop and mobile page to let Google know to index the desktop version.
Desktop Version Canonical Tag
<link rel=”canonical” href=”https://www.example.com”>
Mobile Version Canonical Tag
<link rel=”canonical” href=”https://www.m.example.com”>
Alternate Tag
After adding the canonical tags to both your desktop and mobile sites, add an alternate tag to the desktop version to tell Google that there is a mobile version available as an alternative version. The following code is used for screens <640px to browse your site:
<link rel=”alternate” media=”only screen and (max-width: 640px)” href=”https://m.example.com /”>
With these two tags, the search engine will be able to index your site correctly, so that the desktop version of your site will appear in desktop searches and the mobile version of your site will appear in mobile searches.
***
There are many more best practices for mobile-friendly SEO. Stay tuned to our blog to learn more.