Website Not Mobile-Friendly? What Phone Visitors See

Most owners look at their website on a computer. Many of their customers look at it on a phone, often while standing outside, in a hurry, with one thumb. If the site was not built for that, they notice at once.

What phone visitors see

• The whole desktop page shrunk down, with text too small to read.
• Pages that scroll sideways, or content cut off at the edge.
• Buttons and links so close together that people tap the wrong one.
• Menus that do not open, or open and cover the whole screen.
• A phone number that is plain text, so they cannot tap to call.
• Pop-ups that hide the page with no easy way to close them.

Why it matters

For many local businesses, phones bring more visitors than computers; your own analytics will show the split. Google also switched its whole index to mobile-first indexing: since July 2024 it crawls and ranks sites using their smartphone version. If key text, links or pages are missing or broken on phones, Google sees the weaker version too.

How to test your site in 2026

Google retired its old Mobile-Friendly Test tool and the Mobile Usability report in December 2023, so use these instead:

1. Your own phone. Open every main page. Can you read it without zooming? Can you tap each button easily? Does anything run off the screen?
2. Chrome's device mode. On a computer, press F12, then click the phone-and-tablet icon. Pick a few phone sizes and scroll through each page.
3. PageSpeed Insights or Lighthouse. Run the mobile test. It flags problems such as a missing viewport tag, small text and slow loading.

The common causes and how to fix them

1. No viewport tag

Without this one line in the page's <head>, phones pretend to be a wide desktop screen and shrink everything:

<meta name="viewport" content="width=device-width, initial-scale=1">

Adding it is easy. But on an old fixed-width site, adding it alone can make things look worse, because the layout itself does not adapt.

2. Fixed-width or table layouts

Sites built in the 2000s often use HTML tables or fixed widths such as 960 pixels to place content. These cannot reflow on a narrow screen. The fix is a responsive layout that uses flexible widths and CSS media queries, which usually means a new theme or a rebuild.

3. Images and videos that do not shrink

Large images with fixed sizes push the page wider than the screen. A simple CSS rule such as img { max-width: 100%; height: auto; } fixes most of them.

4. Text and buttons that are too small

Aim for body text of about 16 pixels and tap targets of roughly 48 by 48 pixels, with space between them. Put the phone number in a tap-to-call link: <a href="tel:+15551234567">.

5. Intrusive pop-ups

Full-screen pop-ups that block the content annoy visitors, and Google treats intrusive interstitials as a poor page experience. Use a small banner instead, and make sure it closes easily.

6. An old WordPress theme or page builder

If your theme is years out of date, switching to a modern responsive theme fixes many issues at once. Test on a copy of the site first, because a theme change can move content around.

Check the fix on real phones

After any change, test again on at least one iPhone and one Android phone, not only in a desktop browser. Check these five things on every main page:

• You can read the text without zooming.
• Nothing scrolls sideways.
• The menu opens and closes with one tap.
• The phone number starts a call when tapped.
• Contact and booking forms are easy to fill in and actually send.

Fix it or rebuild it?

If the problems are a missing tag, a few big images or small buttons, a repair is usually quicker and cheaper. If the site is built on tables or fixed widths, or every page needs reworking, a rebuild often costs about the same as patching, and you end up with a site that is faster and easier to update.