Start with one affected page and one task. Record whether the page fails to load, the layout overflows, or a control does not work. Then note the phone, browser and steps that reproduce it. Those details make a repair much easier to investigate.

A homepage can look good on a laptop while its mobile menu covers a button or its enquiry form becomes awkward when the keyboard opens. Review the website as a customer using a phone, including the steps after the first screen.

1. Name what is actually broken

“It does not work on mobile” is a useful starting report, but the next step is to narrow it down. Keep these situations separate:

  • The site will not open: record the full browser message and affected address. This needs a loading or connection investigation.
  • The page loads but looks wrong: identify overlapping text, content outside the screen, or images that obscure other content.
  • The page looks right but a task fails: name the menu item, button, form field or submission that stops working.

Several problems can exist together. A screenshot can show a layout fault, while a short screen recording may explain a menu or keyboard problem better. Hide personal information before sharing either.

2. Check whether the content fits the screen

Responsive layouts adapt to the available screen width. Google's responsive design guidance explains the role of the viewport, flexible content and breakpoints. For an owner, the useful question is simpler: can a customer read the information and reach the actions without losing part of the page?

Problem example

Content runs off screen

The action is partly hidden beyond the available width.

Desired behavior

Content fits the screen

The information and complete action remain visible.

Illustrations of a layout problem and its intended behavior, not screenshots of a client website. The sample actions are not buttons.

Try scrolling the page and reading a long section. Check whether headings wrap, whether images stay inside their sections, and whether a floating chat button covers useful content. A wide comparison table may have its own labelled scrolling area; the whole page should not need sideways movement to reveal an enquiry button.

Do not treat a smaller font as the automatic solution to overflow. The developer should find the element or layout rule causing the problem, then check that the correction still works at other sizes.

3. Test the complete enquiry journey

Choose a realistic task, such as finding a service and asking about it. Walk through that task without skipping the awkward parts.

  1. Open and close the menu. Follow a service link and confirm that the menu no longer hides the page.
  2. Read the offer. Check important conditions and contact options as well as the headline.
  3. Use the form with the keyboard open. Make sure you can see the active field, move to the next one and reach Submit.
  4. Try a recoverable error. For example, leave a required field empty. Check that the explanation is visible and previously entered information is preserved where appropriate.
  5. Check the result. On your own site, arrange a labelled test with the recipient and confirm both the on-screen result and the enquiry's arrival.
  6. Check alternate contact routes. Confirm that phone, email and WhatsApp links point to the intended destination.

If submission succeeds but the notification never arrives, use the missing form email guide. That is a separate check from whether the form fits on a phone.

4. Change one condition at a time

Repeat the same steps in another browser if one is available. If the website does not load at all, comparing Wi-Fi with mobile data can provide a useful clue. A difference is evidence to investigate, not proof of a particular cause.

A desktop browser's mobile preview is useful for checking widths. It does not reproduce every phone behavior, such as the on-screen keyboard or opening another app. Include at least one real-phone check for the task that matters to your business.

5. Record the problem, then verify the same task

Example repair report

“On the contact page, the Send button is covered when the keyboard is open. This happens in Safari on my phone. I can reproduce it by opening the message field and scrolling to the bottom. On my laptop I can reach the button.”

This describes the page, conditions, steps and expected behavior. Add the actual phone model and browser version if you know them.

After a repair, repeat those original steps and check a second screen size. Ask the developer to explain what changed and any limits that remain. Keep the final result with the original report so you can compare it if the issue returns.

A mobile problem does not automatically require a full redesign. The appropriate scope depends on what is broken and how widely it occurs. Read about scoped website fixes before deciding on a larger rebuild.