How to fix mobile usability errors
Google indexes 1 version of your page, and it is the mobile one. Google's mobile-first indexing documentation states it plainly: “Google uses the mobile version of a site's content, crawled with the smartphone agent, for indexing and ranking.” So a broken mobile page is not a cosmetic problem. It is the page. The fixes are concrete: a real viewport meta tag, text a human can read without zooming, tap targets a thumb can hit, and mobile content that matches desktop.
The symptom: the phone version is a squint test
Open your site on a phone. If you see a shrunken desktop layout, pinch-zoom to read a sentence, or miss a link three times because the one next to it fires instead, you have mobile usability errors. Owners rarely see them because they built and reviewed the site on a desktop monitor. Visitors see nothing else. For most local businesses the majority of sessions are mobile, and every one of those sessions starts with the broken version.
The machine sees the same thing. Googlebot Smartphone crawls your site as a phone. If the phone version is cramped, truncated, or missing sections that only exist in the desktop layout, that degraded version is what gets indexed, ranked, and handed to the AI answer engines as your page.
The cause: the site was built desktop-first and never finished
Almost every mobile usability failure is a downstream effect of one decision: the desktop layout was the real project and mobile was an afterthought. It shows up in four specific ways.
- No viewport meta tag. Without it, the phone browser assumes a desktop-width canvas and scales the whole page down. Everything else on this list follows from this one missing line.
- Fixed-width layouts. Absolute pixel widths, giant tables, and images wider than the screen force horizontal scrolling and clipped content.
- Illegible text. Font sizes chosen for a 27-inch monitor render tiny on a phone. If a visitor must zoom to read body copy, the text has failed.
- Crowded tap targets. Links and buttons designed for a mouse cursor sit too close together for a fingertip. Google's tap target guidance recommends targets of at least 48 by 48 CSS pixels with space between them.
There is a fifth cause that hides behind the visual ones: hiding content on mobile. A theme that drops whole sections on small screens, or a stripped-down m-dot site, quietly deletes that content from the version Google reads.
The fix: build the phone page like it is the real one
Because it is. Start with the viewport tag. It belongs in the head of every page:
<!-- Without this line, phones render a scaled desktop page --> <meta name="viewport" content="width=device-width, initial-scale=1" />
Then work through the rest in order.
- Use relative widths. Replace fixed pixel widths with percentages or max-width, and give images
max-width: 100%so nothing overflows the screen. - Size text for a phone held at arm's length. Body copy around 16 CSS pixels is a sane baseline. If your own eyes want zoom, the size is wrong.
- Space the tap targets. Give buttons and links enough padding and margin that a thumb hits only the one it aimed at.
- Keep parity with desktop. The mobile-first indexing doc is explicit: “Make sure that your mobile site contains the same content as your desktop site.” The same applies to structured data and meta tags. If a section, a schema block, or an internal link exists only on desktop, mobile-first indexing means it effectively does not exist.
Responsive design, one URL serving one set of content that adapts by CSS, is Google's recommended setup precisely because it makes parity automatic. Separate mobile sites and adaptive serving can work, but every difference between the versions is a place for the index to silently lose content.
Be honest: do not hide content to look clean
The tempting shortcut is to declutter the mobile page by cutting things: the detailed FAQ, the schema markup, the long-form answer that actually earns citations. That trades your substance for tidiness, and the trade is invisible until rankings move. Since the mobile page is the indexed page, whatever you hide from phones you hide from Google, and from every AI engine that builds on its index. Design the content to fit the small screen. Collapsible sections whose content is present in the HTML are fine. Deleting the content for mobile visitors is not decluttering. It is deindexing yourself one section at a time.
Verify: look at it as a phone, then as the crawler
First the human check. Open the page in Chrome DevTools device mode, or on your actual phone. Read a paragraph without zooming. Tap every link in the nav with a thumb. Scroll and watch for horizontal drift. Then the parity check: put the mobile and desktop versions side by side and confirm every section, heading, and schema block exists in both. Search Console's URL Inspection shows you the rendered mobile page exactly as Googlebot Smartphone fetched it, which settles any argument about what the crawler got.
Then verify it the way the engines will. Paste your link into our GEO audit or the full Brimm audit and we fetch your page with a mobile user agent, check the viewport tag, and compare what a phone-sized machine actually receives. If your mobile page is slow as well as cramped, our guide on fixing a slow Largest Contentful Paint is the next stop, and the rest of the fix library covers the failures we find most.