Your Website Looks Fine. Have You Opened It on a Phone?

Take out your phone. Open your own website. Not a preview, not your laptop window dragged narrow — your actual phone, on mobile data, standing up.

Most people have never done this. They have looked at their site a hundred times on a 27-inch monitor at a desk. The phone is where their customers are.

Why this keeps happening

Nobody decides to neglect mobile. It happens structurally.

The designer works on a large screen because that is where the tools are. The client reviews on a laptop because that is where the email arrived. The developer builds and tests on the machine they are building on. Everyone in the chain is looking at a wide screen all day.

Then at the end, somebody checks it on a phone, finds four problems, fixes those four, and ships. And the site is not broken exactly — it is just clearly an afterthought, in a hundred small ways, to the majority of the people who will ever see it.

The test, right now

Two minutes. Do it before reading further.

1. Can you read the body text without zooming? Not the headline. The paragraphs.
2. Can you tap the buttons with a thumb, first try, without aiming?
3. Does anything run off the right edge? Try scrolling sideways. If you can, something is too wide.
4. Is your phone number tappable? Or is it just text you would have to copy?
5. Can you fill in the contact form standing on a bus? Try it. Actually try it.
6. How long until something appears? Count it. On mobile data, not office wifi.
7. Is the menu findable and usable? Or does it require two taps and a guess? Every "no" is people leaving.

The five things that are almost always wrong

Text too small. A designer sets body text at a size that looks elegant on a large screen. On a phone it is 11px and your customer is 45 and squinting on a train. Elegance is not worth a squint.

Tap targets too small or too close. Fingers are not cursors. A link that sits three pixels from another link is a coin flip. The customer taps, gets the wrong page, goes back, taps again, gets it wrong again, leaves.

Enormous images. A photo from a camera is several megabytes. On a laptop with fibre, invisible. On a phone on the move, that is the difference between a page appearing and a person giving up. This is also one of the most common reasons sites are slow, and Google measures it.

Forms designed for keyboards. Ten fields, tiny inputs, dropdowns with forty options, a date picker that fights you. On a desktop it is tedious. On a phone it is a wall. Every field you remove is an enquiry you gain — this is more true on mobile than anywhere.

Hover states that do not exist. A menu that opens on hover does not open on a phone. There is no hover. Anything that only appears when a mouse is over it is invisible to most of your visitors, and this is more common than you would believe.

The thing that is not a bug but costs more

Everything above is fixable. This one is not, quite.

The site was designed for a wide screen and squeezed into a narrow one.

A three-column layout becomes three stacked boxes. The important thing that sat on the right, in the corner of your eye, is now at the bottom after everything else. The hero image that framed the headline now takes the whole screen and the headline is below the fold. Nothing is broken. It is just wrong — the priority order that made sense across a wide screen makes no sense down a narrow one, because down a narrow one, order is priority.

You cannot fix this with CSS. It is a design decision made at the beginning, and the only real fix is to make the decision the other way: design the narrow version first, then expand it. That way the hard question — what actually matters most — gets answered first instead of never.

If your site has this problem, that is a redesign conversation rather than a patch. Which of those two you need has its own tests.

What good actually means

Not "it fits". Fitting is the floor.

Good means:

• The most important thing is first, not first-on-desktop-and-fourth-on-mobile
• Text is readable at arm's length, in daylight, by someone who is not twenty-five
• Buttons are big enough to hit without looking
• The page appears fast on a bad connection
• Phone numbers dial and addresses open a map
• The form can be finished one-handed on a moving bus
• Nothing depends on hovering

Do this today

1. Open your site on your phone. Outside. On mobile data.
2. Try to contact yourself. Use the form. Actually complete it.
3. Run Google PageSpeed Insights, mobile tab. Under 50 is costing you.
4. Show it to someone over 50. Watch without helping. It will be uncomfortable and it will be the most useful ten minutes of your month. Most of what you find is a small fix and a large return. The rest tells you something more expensive, but you would rather know.

We're DAKER, a web design and development studio in Baku working with startups and small businesses across Europe. We design for the phone first, because that's where your customers are. If your site fails the test above and you want to know why, we'll audit it for free. Get in touch.