Skip to content

How Do You Make Your Website Work Well on Phones?

Google uses the phone version of your website to decide what your pages are about and where they rank, so your site has to work fully on a phone. Use a responsive design that fits any screen, keep the same content on phones as on computers, and test every main page on a real phone. Make sure people can read the text, tap the buttons, use the menu, and send the form without zooming.

Google calls this mobile-first indexing. It means Google mainly looks at the phone version of your site when it reads and ranks your pages. If something is missing on the phone version, Google may not count it.

Google recommends responsive design. That means one website that rearranges itself to fit any screen, instead of a separate phone site. Most modern website builders and themes are responsive out of the box.

Say Riverbend Landscaping’s site looks great on a computer. On a phone, the menu won’t open, the phone number is a picture, and the estimate form’s “Send” button is hidden behind a chat bubble. On a computer the site is fine. On a phone, where many customers will first see it, it doesn’t work.

  • Google reads the phone version. Google says if content is missing from the mobile version, it may not be indexed.
  • Phone visitors can’t fight a bad layout. Tiny text, buttons too close together, and sideways scrolling send people back to search.
  • Your call to action lives on phones. If the call button or form doesn’t work on a phone, phone visitors can’t reach you (see 19.4.8 Calls to Action).
  • Hidden content can be missed. Google says it won’t tap, swipe, or type to load content. Content that only loads after one of those actions may never be seen.

Every business with a website. Older sites built before responsive design was common, and sites with a separate “m.” phone version, need the closest look.

  1. Open your main pages on your own phone: home, each service, each location, about, and contact.
  2. Check that you can read the text without zooming and that nothing runs off the side of the screen.
  3. Tap every button and link. Make sure they’re big enough and not crowded together.
  4. Open the menu and make sure every important page is reachable.
  5. Tap your phone number. It should open the dialer.
  6. Fill out and send each form on the phone (see 13.5 Website Forms).
  7. Compare the phone and computer versions. Google says the main content and headings should be the same on both. You can tuck content into tabs or accordions on phones, but don’t remove it.
  8. Check that page titles, meta descriptions, and robots tags are the same on both versions. Google says a mismatched noindex on the phone version can stop the page from being indexed.
  9. Make sure images show on phones and have the same alt text as on desktop.
  10. Use Lighthouse in Chrome or PageSpeed Insights for a deeper check. Google retired its standalone Mobile-Friendly Test in December 2023, so don’t look for it.
  11. Repeat the phone check after every theme change, plugin update, or new page.
  • Dated phone and desktop screenshots of each main page
  • A checklist showing you tested the menu, tap-to-call, and each form on a phone
  • Notes on anything you fixed

Keep these in your website records folder.

  • Only checking on a computer. Most problems only show on a phone.
  • Phone numbers and addresses in images. They can’t be tapped or copied.
  • Pop-ups that cover the screen. On a phone, they can hide everything, and the close button is often tiny.
  • Removing content to “clean up” the phone layout. Google reads the phone version. Content you cut there may not count.
  • Chat bubbles covering buttons. A floating widget can sit right on top of your “Send” button.
  • Text over busy photos. Hard to read on a small screen in daylight.

Your web developer or designer: if your site uses an old theme, a separate phone site, or layouts that break on phones. Questions to ask:

  • Is this site fully responsive, and does the phone version have the same content as desktop?
  • Can we fix the menu, buttons, and forms on phones without a full rebuild?

[Bill: add a short story or lesson here. For example, a client site that looked fine on a desktop but had a broken form or menu on phones.]

If you’d rather have this done for you, SiteSmarty builds responsive websites and tests every page on a phone before launch.

  • [Date I did this:]
  • [What I actually did, step by step: which phones I tested on and what I checked]
  • [What it cost and how long it took:]
  • [What surprised me or what I’d do differently:]
  • [Screenshot or photo to add, with private info blurred: phone and desktop screenshots of a SiteSmarty service page]
  • [Result so far:]

What is mobile-first indexing? Google mainly uses the phone version of your site to read and rank your pages.

Is Google’s Mobile-Friendly Test still available? No. Google retired it in December 2023. Test on a real phone and use Lighthouse or PageSpeed Insights.

Should my phone site have less content than desktop? No. Google says the main content should match. You can organize it into tabs or sections.

What is responsive design? One website that adjusts its layout to fit any screen size. Google recommends it.

How do I test my site on a phone? Open each main page, read it, tap every button, use the menu, call the number, and send each form.

  • Question: Do all main pages work fully on a phone, with the same content as desktop?
  • Pass looks like: Responsive design, readable text without zooming, working menu, tap-to-call numbers, forms that send from a phone, and the same content, headings, titles, and robots tags on phone and desktop.
  • Fail looks like: Sideways scrolling, tiny buttons, phone numbers in images, broken forms on phones, content removed from the phone version, or pop-ups that cover the page.
  • Evidence to collect: Dated phone and desktop screenshots and the phone test checklist.

Where this fits

Do this first: 13.2.1 Website Hosting, 13.3.3 Website Navigation

Do this next: 19.5.6 Broken Links and Redirects

Related pages: 9.7.3 Website Accessibility, 13.5 Website Forms, 19.4.3 Headings and Opening Lines, 19.4.8 Calls to Action, 19.5.3 Page Speed

Sources

This page explains general rules and Bill's own experience. It is not legal, tax, or insurance advice. Talk to a qualified professional about your situation.

Get free updates

I'll send you a short email when new guide pages and videos go up.

No sales pitches. Unsubscribe any time.