Making your site work on a phone

Last updated 14 October 2026

By the FocalScore team at Astrolabix LLC. First published 14 October 2026. Sources last checked October 2026.

The short answer

First make sure phone visitors actually land on your site, not on a link page or an old mobile site somewhere else. Then check the basics: the viewport tag in each page's head, text big enough to read without zooming, buttons big enough to tap, a menu that opens and form fields that don't make the phone zoom in.

What working on a phone means

A site that works on a phone fits the screen without sideways scrolling, can be read without pinching to zoom, and can be used with a thumb. Responsive design is the usual way: one site whose layout adapts to the width of the screen, rather than a separate mobile site.

Why it matters to a small business

Many people find a local business on their phone, often with the intention of calling it there and then. Google also looks at the phone version of your site: with mobile-first indexing it crawls as a smartphone and uses what a phone gets to decide what your pages are about. If a phone sees less than a computer, or sees another site, that is what Google works from.

How the free scan decides

Phone visitors stay on your site fails when phone visitors opening the homepage are sent to a different website.
Responsive viewport meta fails when there is no viewport tag, and Mobile viewport set up when the viewport sets a fixed width, blocks zooming, or a block on the page is wider than a phone.
Legible mobile font size fails when body text is under 12 pixels on a phone and warns under 16.
Tap target size / spacing fails when buttons and links are too small or too close together to tap.
Mobile menu works fails when tapping the menu button doesn't open a menu, and Form fields don't trigger zoom when form fields are under 16 pixels, which makes iPhones zoom in as soon as someone taps one.

First: keep phone visitors on your site

When phones are sent elsewhere, phone visitors never see your site, Google's phone speed test measures the other site instead of yours, and Google's smartphone crawler is most likely sent there too. Find what does it and remove it:

A script in the page. Look in the page's code, and in any code pasted into the site's header settings, for a script that checks the device or screen width and then changes window.location. Delete it.
A mobile-redirect setting. Some builders, plugins and hosting panels have a "mobile redirect" or "mobile site" option. Switch it off.
A server or CDN rule. On IIS, look in web.config for a rewrite rule that matches on the user agent; on Apache, in .htaccess; on Cloudflare, in the redirect rules.
If the page phones were sent to has links you want people to find, such as social profiles or a booking link, add them to your own homepage instead.
Afterwards, open the homepage on a phone over mobile data (not your office Wi-Fi) and check it stays on your address. If your site is in Google Search Console, its URL Inspection tool shows the page as Google's smartphone crawler fetched it.

The other fixes, by platform

The viewport tag

Each page's head should have exactly this line, and no zoom limits added to it:

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

Remove maximum-scale=1 or user-scalable=no if they are there: they stop people zooming in to read.

Text, buttons and forms

Set body text to at least 16 pixels on phones.
Make buttons and links at least 24 by 24 pixels, the WCAG minimum, and 44 where you can, or leave enough space around a small one that a thumb can't hit its neighbour.
Set form fields to a font size of at least 16 pixels.
Open the mobile menu on a real phone, and check each link in it.

By platform

Shopify, Squarespace and most WordPress themes are responsive and add the viewport tag. Problems usually come from what was added: a wide table or embed, a font size set by hand, or a plugin's pop-up. Check the theme's typography settings for the phone text size.
Wix has a separate mobile view in its editor; elements can be resized, moved or hidden there without changing the computer layout.
Page builders on WordPress have responsive settings per element (often a phone icon beside the size field). A font or padding set only for computers is inherited by phones.
A hand-built site or ASP.NET: the viewport tag belongs in the shared layout (_Layout.cshtml on MVC) so each page gets it. Sizes are set in your stylesheet, usually in a @media (max-width: …) block for small screens.

How to check yours

Use the site on your own phone: open the homepage from a search result, read a page without zooming, tap the menu and each main button, and fill in the enquiry form. The free scan's Mobile section reports the same things from Google's phone test and its own phone visit, with the elements it found too small; the sample report shows the layout. The speed guide covers how fast it loads on a phone.

Checklist

Phone visitors land on your own homepage, not another site.
Each page has the viewport tag, with no zoom limits.
Nothing on the page is wider than the screen.
Body text and form fields are at least 16 pixels on phones.
Buttons and links are big enough, and far enough apart, to tap.
The mobile menu opens, and each link in it works.

What the free scan checks for this

These are the FocalScore checks that cover this guide's subject. Each one in your report says what it found, shows the evidence and gives the fix.

Phone visitors stay on your site
Responsive viewport meta
Tap target size / spacing
Legible mobile font size
Mobile viewport set up
Mobile menu works
Form fields don't trigger zoom

Sources

Last checked October 2026. Documentation, settings and rules change; if one of these pages now says something different, it is right and this guide is out of date. Tell us at info@focalscore.com.