Open your website on your phone. Not just the homepage. Try the thing you expect a customer to do.

Can you compare the options? Read the specifications? Fill in the form with the keyboard covering half the screen?

When we talk about responsive design, that’s the work. Fitting the desktop layout into a narrower rectangle doesn’t settle it.

Preserve the job, not every arrangement

A desktop layout may have room for a large comparison, a side navigation and supporting imagery. A phone needs a different arrangement.

The priority is not preserving the exact composition. It is preserving the information and function required to do the job.

A product specification does not become unimportant because the screen is small. A service explanation does not become optional because the hero image looks cleaner without it.

For a comparison of three service plans, stacking each plan into a separate card might look tidy. It can also leave someone scrolling up and down to compare one important feature. Consider whether a compact comparison or clearly labelled sections make the decision easier. The best arrangement depends on what needs comparing.

Decide how to present the detail rather than remove it by default.

Design the controls people actually use

Menus, filters, date pickers, forms and media controls need attention at their real sizes. Check whether labels wrap sensibly, focus is visible and controls remain reachable when the keyboard opens.

Use text that describes the action. Keep errors close to the relevant fields and preserve entered information when something goes wrong. W3C's forms guidance treats labelling, instructions and recoverable validation as part of accessible interaction.1

Testing a screenshot is not the same as testing a task.

Give long-form content a proper mobile experience

Reports, tables and diagrams can be awkward because they were originally designed for a fixed page or large canvas.

Sometimes a table needs controlled horizontal scrolling. Sometimes a chart needs an alternative text explanation. Sometimes the material should be reorganised for reading rather than simply scaled down.

A PDF may remain useful as a download while a web version provides a better reading path. Keep the access arrangements appropriate to the document. A private report can still have a better reading layout; it doesn’t have to become public to be redesigned.

Understand the search connection without overselling it

Google uses the mobile version of a site's content for indexing and ranking. It recommends equivalent important content and metadata across mobile and desktop, and responsive design as an approach that is easier to maintain. Responsive layouts serve the same page at the same address while changing its presentation for the available screen size.2

Keep the performance and content checks too. A layout can fit a phone beautifully and still take far too long to load.

Reorganising detail into a usable accordion is different from removing it. The important content still needs to be available to the reader and to Google; content fetched only after a tap may not be seen by its crawler.2

Test beyond a couple of device presets

Check the widths where the layout actually changes, long headings, enlarged text and portrait and landscape use where relevant.

Try the menu while the page is loading. Open and close the keyboard. Return from a product to the filtered list. Follow the confirmation journey after a form. Review fixed controls near the footer so they do not cover the final links.

These are ordinary ways people use websites, not unusual edge cases to discover after launch.

Include a real phone in the review, not only a resized browser window. A layout can look finished until you try to use it with your thumb and the keyboard open. That's a much better time to discover the problem than when a customer is trying to send you their details.