Most website owners build and check their site on a laptop. It looks great on a big screen, so they assume Google sees the same thing. But Google mostly looks at the mobile version of your pages. If your mobile version hides content, drops headings or leaves out product details, Google may never see them. That surprises a lot of people.
In this lesson, I will explain what mobile-first indexing means, why responsive design is the safest setup, what “content parity” is and why it matters, and how to test your own site the way Google sees it. By the end, you will be able to spot the mobile problems that quietly hold sites back.
What does mobile-first indexing mean?
Mobile-first indexing means Google uses the mobile version of your site’s content for indexing and ranking. Google crawls pages with its smartphone crawler, Googlebot Smartphone, and whatever that crawler finds is what goes into the index. We met the index in the indexing lesson.
An everyday comparison: imagine a restaurant with two menus, a full one at the tables and a short one on the takeaway flyer. If a food critic only ever reads the flyer, then dishes that appear only on the table menu might as well not exist. Google is that critic, and your mobile site is the flyer.
A few points help put this in context:
- It is not a separate “mobile index.” There is one Google index. Mobile-first is about which version of your page Google reads to build it.
- It applies to desktop searches too. Even someone searching on a laptop sees results based on what Google indexed from the mobile versions.
- It is not new. Google moved sites over gradually for several years and, in late 2023, announced on its Search Central blog that mobile-first indexing “has landed.” The full timeline is in my post on the mobile-first indexing rollout.
Do you have to have a mobile version? Google says it is not required for your content to be included in search results, but it very strongly recommends one. In practice, a site that is hard to use on a phone is hard to use for most of your visitors anyway.
Which mobile setup should you choose?
Google describes three ways to serve a site to mobile and desktop users. Here they are side by side.
| Setup | How it works | Ease of SEO |
|---|---|---|
| Responsive design | Same URL, same HTML; the layout adapts to screen size with CSS. | Easiest. Content and metadata are automatically the same on all devices. Google recommends it. |
| Dynamic serving | Same URL, but the server sends different HTML depending on the device. | Harder. You must keep both versions in sync and send a Vary: User-Agent header. |
Separate URLs (for example m.example.com) | Different URLs and different HTML for mobile and desktop. | Hardest. Needs matching content, correct annotations and redirects between versions. |
Google’s documentation says it recommends responsive web design because it is the easiest pattern to implement and maintain. Almost every modern WordPress theme, Shopify theme and website builder is responsive by default, so most small businesses are already in good shape.
A responsive page needs one small line in its <head>, which tells the phone’s browser to use the real screen width instead of pretending to be a desktop:
<meta name="viewport" content="width=device-width, initial-scale=1">Your theme almost certainly includes this already. If a page looks like a tiny zoomed-out desktop page on your phone, a missing viewport tag is the first thing to check.
If your site still runs a separate m. site or old AMP pages, consider moving to responsive design when you next redesign. My guide on removing AMP without losing traffic covers the AMP side, and the site migrations lesson covers moving URLs safely.
What is content parity, and why does it matter?
Content parity means your mobile pages contain the same important content as your desktop pages. With responsive design, you get this for free, because it is the same HTML. With dynamic serving or separate URLs, it is easy to lose things without noticing.
Google’s mobile-first indexing guidance lists the things that should match on both versions:
- The main content. Text, images, videos and links should be the same. If the mobile page has less content, expect to lose traffic for whatever was removed.
- Headings. Use the same clear headings on both. Our lesson on headings and structure explains why they matter.
- Titles and meta descriptions. They should be equivalent on both versions.
- Structured data. The same structured data must be on the mobile pages, and its URLs should point to mobile URLs where you use separate URLs.
- Image alt text and image quality. Use the same alt text, and don’t serve tiny, low-quality images to phones. See the image SEO lesson.
- Robots meta tags. A
noindexon the mobile version, but not on desktop, can stop the page being indexed at all.
Is hidden content in tabs and accordions okay?
On small screens it is natural to fold text into tabs or “read more” accordions. That is fine, as long as the content is actually in the page when it loads. The problem is content that only loads after someone taps, swipes or types. Google’s guidance is clear: don’t lazy-load primary content on user interaction, because Googlebot doesn’t click, swipe or type to load it. Lazy-loading images further down the page is fine when done properly; my post on lazy loading and SEO explains the safe way.
Which mobile problems should you look out for?
Beyond parity, here are the issues I would look for on any site. Most are about the person holding the phone, which is exactly what Google’s page experience guidance asks you to think about.
- Text too small to read without zooming, or lines running off the screen sideways.
- Buttons and links too close together, so people tap the wrong one.
- Intrusive pop-ups that cover the content as soon as the page opens. Google’s page experience guidance asks whether your pages avoid intrusive interstitials.
- Heavy images and scripts that make pages slow on mobile networks. This links to the Core Web Vitals lesson; mobile scores are usually worse than desktop. Serving the right image size per device helps, as shown in responsive images with srcset.
- Resources blocked by robots.txt, such as CSS or JavaScript files, which stop Google from rendering the mobile page properly.
- Separate-URL mistakes, such as every desktop page redirecting to the mobile home page, or missing links between the desktop and mobile versions.
What if you still run a separate mobile site?
Some older sites, and a few large ones, still serve phones from a separate address such as m.example.com. That setup can work, but it needs extra care, because Google has to understand that two URLs are two versions of the same page. Here are the extra rules Google gives for separate URLs, in plain words:
- Link the two versions. The desktop page is always the canonical, and the mobile page is its alternate. We covered canonicals in the canonical tags lesson.
- Redirect visitors to the matching page. A desktop product page should send phone users to the same product on the mobile site, never to the mobile home page. Several desktop pages should not all collapse into one mobile page. Our lesson on redirects explains the basics.
- Keep error pages consistent. If a desktop page returns a 404, its mobile version should too, and the other way round.
- Don’t use fragments (the part after a
#) in mobile URLs. - Connect language versions within the same device type. If you use hreflang, mobile pages should point to other mobile pages and desktop pages to other desktop pages.
- Make sure the mobile server can cope. With mobile-first indexing, Google crawls the mobile site more, so it needs enough capacity.
As you can see, that is a lot to keep right on every page, forever. This is why I usually suggest moving to responsive design at the next opportunity.
Try it: see your site the way Googlebot Smartphone does
Let’s test a few of your pages. You need Chrome and Search Console. Here is how I would do it.
- Pick three important pages: the home page, a key service or product page and a popular blog post.
- Open each on your own phone. Read it as a customer would. Can you read the text, tap the buttons and find the main information without pinching and zooming?
- On your computer, open the same page in Chrome, right-click, choose “Inspect,” then click the device icon to switch to a phone view. Compare it side by side with the desktop view. Is any text, section, image or link missing on mobile?
- Paste the URL into Search Console’s URL Inspection tool and run “Test live URL.” Then click “View tested page” to see the screenshot and HTML Google rendered. Make sure your main content is there.
- Run the page through PageSpeed Insights and look at the mobile results first.
- Write down anything missing or hard to use, and fix the biggest problem first.
Here is an invented example of a parity check:
| Element | Desktop | Mobile | Fix needed? |
|---|---|---|---|
| Service description | 600 words | Shortened to 150 words | Yes – show full text, use an accordion if needed |
| Customer reviews | Visible | Load only after tapping “Show reviews” | Yes – include reviews in the initial HTML |
| Title and H1 | Same | Same | No |
Questions beginners ask about mobile-first indexing
Does mobile-first indexing mean desktop doesn’t matter?
No. Desktop visitors still matter for your business. It only means Google reads the mobile version to index and rank your pages. With responsive design, both versions are the same, so you rarely need to think about it.
My site looks fine on my phone. Am I done?
Probably mostly. Also check that nothing important is removed or loaded only on tap, that the page isn’t slow on mobile, and that pop-ups don’t cover the content.
Should I have a separate mobile site?
For most sites, no. Google recommends responsive design because it is the easiest to maintain, and a separate site means double the work to keep content, metadata and structured data in sync.
Can I hide text on mobile to keep pages short?
You can fold it into tabs or accordions, as long as it is in the page when it loads. If you remove it entirely from the mobile version, Google won’t see it.
Mobile-first indexing, briefly, and what comes next
In brief: Google indexes and ranks your site based on what its smartphone crawler sees. Responsive design is the simplest, safest setup. Keep content, headings, metadata, structured data and images the same on mobile and desktop, don’t make Google tap to load important content, and check your pages on a real phone and in URL Inspection. For a deeper look, read my full guide to mobile SEO.
Next, we look at the other trust basics of a modern site in HTTPS and website security for SEO. If your mobile site needs work and you would like some help, our team is happy to take a look; just request a free quote.