Why a New Site Needs a Real Phone Test
A mobile website checklist keeps a launch review honest. On a desktop monitor almost every new site looks fine. The trouble starts when a customer holds the site in one hand on a sidewalk, in a truck or at a kitchen counter.
Small buttons, a menu that will not close and a phone number that does nothing are easy to miss on a big screen. They cost real inquiries on a small one.
The checks below use a remodeler, a bakery and a pet groomer as examples. The same steps work for any local business reviewing a new or redesigned site before it goes live.
Set Up the Test Before You Start Tapping
Use at least one real phone. A browser’s device preview helps with layout, yet it cannot show you how a thumb misses a button or how a form behaves with the on screen keyboard open.
- Test on the phone you own. Then borrow one from a family member or staff member on the other platform if you can.
- Use cellular data for one pass. Office WiFi hides slow loading that customers on the road will feel.
- Test the pages that make money. Homepage, main service page, contact page and one long content page such as a gallery or menu.
- Write down what breaks. A note with the page, the problem and a screenshot beats a vague memory at the next revision meeting.
Google uses the mobile version of a site’s content for indexing and ranking, which its mobile-first indexing documentation explains. So a phone test is not only about comfort. Content missing on mobile can be missing from search too.
Check Tap Targets With One Thumb
Hold the phone the way a customer would. One hand, one thumb. Now try to reach every button, menu item and link that matters.
Watch for three problems. Buttons that are too small to hit, buttons packed so close that you open the wrong one and links that only work when you tap the exact text.
The W3C’s WCAG 2.2 guidance on target size calls for pointer targets of at least 24 by 24 CSS pixels, with spacing and other exceptions. Treat that as a floor, not a goal. A “Call now” button earns more room than a footer link.
- Can you tap the main call to action without aiming?
- Do social icons in the footer have space between them?
- Does a whole button respond or only the word inside it?
- Can you close every pop-up with one tap?
Open, Use and Close the Mobile Navigation
The hamburger menu is where many redesigns fall apart. Open it on each test page and run through the same short script.
- Open the menu. Does it cover the page cleanly or push content sideways?
- Tap a parent item with subpages. Can you reach the subpages without the menu collapsing?
- Follow one link. Does the menu close after the new page loads?
- Open it again and close it without choosing anything. Is the close control easy to find and tap?
- Scroll with the menu open. Does the page behind it stay put?
A remodeler’s menu with Services, Gallery and Contact should take three seconds to use. If a customer has to fight it, they will hit the back button instead.
Review Sticky Headers, Bars and Banners
Sticky elements follow the screen as you scroll. A slim sticky call button can help. A sticky header, a sticky call bar and a cookie banner stacked together can hide half the page.
Scroll a long page slowly and check what stays visible. Then rotate the phone sideways and repeat.
- Reading room. Does enough of the page stay visible to read a paragraph without scrolling every two lines?
- Hidden anchors. When you jump to a section from a link, does the sticky header cover the heading?
- Stacked bars. Do the cookie notice, chat bubble and sticky call button overlap each other?
- Dismissal. Can you close banners and do they stay closed as you move between pages?
A sticky bar that hides the last line of every paragraph is not a conversion tool. It is a reason to leave.
Fill Out Every Form on the Phone
Do not just look at the contact form. Complete it and send it, then confirm the message arrived.
A pet groomer’s booking form might work perfectly on desktop and still fail on a phone because the date picker opens under the keyboard or the error message appears off screen.
- Field size. Can you tap each field without zooming?
- Keyboard type. Does the phone field bring up a number pad and the email field an email keyboard?
- Labels. Are labels visible while you type or do they vanish?
- Error handling. Submit with a missing field. Is the error visible and does your typed text survive?
- Success state. After sending, do you see a clear confirmation and does the business receive the message?
- Uploads. If the form asks for photos, can you attach one from the phone’s camera roll?
Keep test submissions clearly marked so staff do not treat them as real leads.
Test Every Phone Link and Contact Detail
A phone number on a mobile site should open the dialer when tapped. Test every instance, not only the one in the header. Numbers in the body, the footer and the contact page often get missed.
While you are there, check the rest of the contact details the same way.
- Does tapping the number open the dialer with the right digits?
- Does the email address open a new message?
- Does the address open a map app with the correct pin?
- Are current hours shown on the pages customers actually visit?
If phone calls drive the business, the number also belongs in the first screen of the homepage. The five answers behind a strong first screen are laid out in what a small business homepage needs before the first scroll.
Zoom In and Check for Horizontal Scrolling
Two quick tests catch most zoom problems. First, pinch to zoom on a text page. If nothing happens, the site may be blocking zoom, which hurts visitors with low vision. Second, scroll through each test page and watch for content that forces you to drag sideways.
The W3C’s reflow criterion asks that content work at a width equivalent to 320 CSS pixels without scrolling in two directions, with exceptions for items such as data tables and maps that genuinely need two dimensions.
Common offenders are wide tables, fixed width images and long email addresses that push past the screen edge. A page that only reads sideways is a page many visitors will abandon.
Walk Through Long Galleries and Project Pages
A remodeler’s project gallery or a bakery’s cake portfolio often holds dozens of photos. That is the page customers spend time on, so give it a full pass rather than a glance.
- Loading. Do images appear as you scroll or does the page stall while everything loads at once?
- Cropping. Are project photos cropped so tightly on a narrow screen that the work is hard to see?
- Captions. Do captions and project details still show on mobile?
- Filters. If the gallery has category filters, can you tap them and clear them easily?
- Next step. After the last photo, is there a clear way to call or request a quote?
- Rotation. Turn the phone sideways and check that the gallery still behaves.
Count the taps it takes to go from one project photo to a contact form. If the answer is more than two, the page is working against you.
A Printable Mobile Website Checklist for Launch Day
Run this list on each key page and mark pass or fix. Share the fix list with your designer or developer with screenshots attached.
- Main call to action is tappable with one thumb.
- Buttons and links have enough size and spacing.
- Menu opens, submenus work and the menu closes after a choice.
- Sticky header, bars and banners leave room to read.
- Contact and booking forms submit successfully from the phone.
- Phone links dial, email links open mail and the address opens a map.
- Pinch zoom works and no page needs sideways scrolling.
- Long galleries load, captions show and a next step follows the photos.
- One full pass ran on cellular data, not only office WiFi.
- Every issue is logged with page, screenshot and device.
Ten minutes per page is enough for most small sites. The point of a mobile website checklist is not a perfect score. It is catching the handful of problems that would otherwise cost you calls on launch week.
Speed and Access FAQ
Why is my website slow on a phone even though it looks fine on a desktop?
A phone has less processing power and may be using a slower or less stable connection than your office computer. Large images, third-party scripts and videos can add delay even when the finished layout looks correct. Run the same pages through a repeatable speed test on a phone connection, then compare the results. See the launch day checklist above.
Should I replace all my photos with smaller versions?
Not automatically. Choose dimensions that match each image’s display size and use an efficient format while keeping enough detail for customers to evaluate your work. Check photos on both phones and larger screens before replacing originals, and keep backup copies. Gallery and image checks are covered in the launch day checklist above.
What makes a site hard for people using a keyboard or screen reader?
Missing form labels, weak contrast and controls that only work with a mouse can block visitors from reading or completing a task. Keyboard users also need a visible focus indicator and a logical tab order, while screen reader users need meaningful button names and image alternatives. Test basic tasks without a mouse, zoom the page and use a screen reader for a sample pass. Tap targets, zoom and form labels are also covered in the launch day checklist above.
What should be tested right before a website goes live?
Test forms, phone links, menus, payment or booking paths and mobile layouts on real devices. Check broken links, redirects, indexing settings, analytics events and backups, then confirm that labels, keyboard focus and zoom still work. Record each issue and retest after fixes. Start with the launch day checklist above and the homepage first-screen checks at What a Small Business Homepage Needs.
The information here is general information and not legal or technical advice. Devices, browsers and accessibility standards change, so test on your own site and consult a qualified professional about your specific situation.
