Mobile-First: What Most Small-Business Sites Get Wrong

Most small-business websites are still designed on a big screen and then squeezed onto a phone — so the things mobile visitors need first (a clear headline, proof, and a tappable call-to-action) end up buried, while oversized hero images and hidden menus get in the way. Mobile is now 60–70% of traffic on the small-business sites we work with, yet most are built as if it were the other way round. Here is what goes wrong, with the research behind each point, and what to fix first.

Why does mobile deserve to come first?

Because that is where your visitors are, and their attention runs out fast. In NNGroup's eye-tracking work, people spend 57% of their viewing time above the fold and 74% within the first two screenfuls of a page (NNGroup, 2018, 120 participants, 130,000+ fixations). Attention then decays with every section. (That study used desktop monitors; mobile users scroll more out of necessity, but the same steep drop-off applies.)

The lesson is simple: front-load the things that persuade. Lead with a short headline and a clear next step, put your proof — logos, reviews, a real testimonial — high up, and stop saving the good stuff for the bottom of the page. On a phone, "below the fold" often means "never seen". This is exactly the kind of number we design around, not a detail we add at the end.

What is the single most common mistake?

The full-screen hero image with nothing visible beneath it. It looks impressive and quietly kills your page. When a hero fills the whole screen with no hint of content below, visitors assume the page has ended — a problem usability researchers call a "false floor". In one test, 6 of 8 people did not realise they could scroll past the hero at all (NNGroup, n=8).

The fix is to lead with text and a button, not a picture, and to let the next section "peek" above the fold so people know there is more. We treat that as a build rule, not a nice-to-have.

Are hamburger menus actually a problem?

Often, yes — when they hide things people need. Tucking your whole menu behind a hamburger icon measurably lowers how much of your site people discover. In an NNGroup study (179 participants, 6 sites), hidden navigation was used by only 27% of desktop users, versus 48–50% when navigation was visible. On mobile the gap was the same shape: hidden nav was used 57% of the time against 86% for a visible-plus-hamburger combination (NNGroup).

The practical rule we follow: with four or fewer key links, keep them visible. Only hide navigation behind a hamburger when there are genuinely too many items to show.

How big should buttons and links be?

Big enough to hit on the first try with a thumb. The recommended minimum tap target is 44×44 CSS pixels (Apple's Human Interface Guidelines and WCAG 2.2 AAA), with Google suggesting 48×48 and at least 8px of space between targets (web.dev). The real-world physical floor is roughly 1cm × 1cm (NNGroup, based on Parhi et al., 2006). Corners need a little more room — around 12mm — because thumbs reach them less accurately (Hoober, 2017, 1,333 observations).

Tap targets below ~1cm and cramped footer links are two of the most common, easiest-to-fix mobile faults we see.

We size every button, link and form field to these targets from the start, so nobody has to pinch, zoom or tap twice.

Why do mobile contact forms lose people?

Because they are built like desktop forms. The fixes are well-evidenced:

• One column, always. A single-column form is completed about 15.4 seconds faster than a multi-column layout (Smashing Magazine / CXL).
• Ask for less. Keep lead forms to four fields or fewer. Most checkout flows could cut their fields by 20–60% (Baymard Institute).
• Set inputs to at least 16px, or iOS Safari zooms in every time someone taps a field — a small detail that makes a form feel broken.
• Validate as people go. Inline validation after each field, rather than only on submit, raised success rates by 22% in Wroblewski's 2009 study.
• Use the right keyboard. type="email", type="tel", and autocomplete attributes matter; Google found autofill cut completion time by around 30%.

For a local service business, also give people a tappable phone number — a proper tel: link styled as a button — alongside the form. Google/Ipsos research found roughly 70% of mobile searchers have called a business straight from search results.

Where should proof and pricing go?

High, and stacked. Social proof belongs within the first two or three screenfuls, where 74% of viewing time lives (NNGroup). Testimonials with a real photo recall significantly better than text-only quotes, and recognisable client logos earn the strongest recall of any proof type (CXL eye-tracking; figures partially verified as the source is bot-blocked, so we treat them as directional). Pricing should be stacked cards, one plan per card, full width — never a horizontal table that forces people to rotate their phone (Baymard).

FAQ

What does "mobile-first" actually mean? Designing for the phone screen first and treating desktop as the expansion — not designing on desktop and shrinking it. In practice that means a text-first hero, visible navigation, thumb-sized buttons, and a single-column form, all decided before the wide layout.

How much of my traffic is really on mobile? On the small-business sites we build, it is typically 60–70%. For many local businesses it is higher. Check your own analytics — but assume the majority of visitors will only ever see your phone layout.

What is the fastest mobile fix I can make today? Two things: stop the full-screen hero image hiding everything below it, and make every button and link at least 44×44px. Both are quick and address the most common faults.

Do longer pages hurt on mobile? Not by themselves. There is no evidence people dislike long pages; the real enemy is the "false floor" that stops them scrolling. People will keep going if each section rewards them.

We build fast, conversion-tuned websites to exactly this research — text-first heroes, visible navigation, properly sized tap targets, forms that respect a thumb. If you would like a calm second opinion on your own site, book a call and we will tell you honestly what is worth fixing first.