Fitts's Law: why CTA button size and position change everything on mobile

A visitor who's convinced by your headline and your offer can still fail to convert for a reason that has nothing to do with copy: the button was too small, too far away, or squeezed between two other clickable elements. That's a movement problem, not a persuasion problem, and it has been measured since 1954 by Fitts's law. This guide explains what the law says, what one-handed mobile usage studies have concretely added about the "thumb zone," and how to apply both to the size and position of a CTA on a landing page.

Fitts's law, in one sentence

Psychologist Paul Fitts showed, in a study that has become a classic reference in ergonomics (Fitts, 1954, Journal of Experimental Psychology), that the time needed to reach a target with a movement depends on only two factors: the distance to travel and the size of the target. The farther the target, the longer the movement takes; the smaller it is, the more precision — and therefore time — is needed to hit it without missing. The result is a simple intuition, but its consequences for an action button are direct: a CTA close to the thumb and wide enough is tapped faster and with fewer errors than a distant or tiny one, even if the button text is identical.

On a desktop screen with a mouse, the effect is measurable but subtle: the distance between two points on a screen is rarely huge and the cursor moves fast. On mobile, where the pointer is a thumb that has to both hold the phone and reach the screen, the effect becomes much more visible — and that's where most landing pages lose clicks without anyone noticing.

The thumb zone: what one-handed mobile studies added

Fitts's law predates the smartphone; it has since been complemented by studies specific to touch input. The most cited one, led by Parhi, Karlson and Bederson (MobileHCI, 2006), measured the speed and error rate of participants tapping targets of varying sizes with their thumb, on a phone held in one hand. Main finding: below roughly 1 cm × 1 cm, the error rate rises sharply, and the effect gets worse still when the target sits outside the thumb's natural comfort zone.

On a phone held in the right hand, that comfort zone roughly traces an arc: easy at the bottom and center of the screen, harder at the top and on the edge opposite the hand holding the device — a left-handed visitor doesn't have exactly the same zone, which argues for centering CTAs rather than pinning them to one edge. Three zones recur in the UX literature that followed this research:

• Easy zone — the bottom third of the screen, reachable without changing grip. This is where a sticky bottom CTA gets the most out of the thumb zone, as detailed in our article on the mobile sticky CTA.
• Stretch zone — the middle third, reachable by extending the thumb, with reduced precision: it's the most forgiving zone for a slightly generous button size, but not the fastest.
• Hard zone — the top of the screen, which often requires changing grip or using the other hand. A single CTA placed only there, without a repeat lower on the page, starts with a measurable disadvantage.

Minimum sizes: what Apple and Google recommend

Apple's and Google's interface guidelines translate these findings directly into numeric recommendations, consistent with the threshold observed by Parhi, Karlson and Bederson: Apple recommends a tap target of at least 44 × 44 points, Google at least 48 × 48 dp — in both cases, roughly the equivalent of the one-square-centimeter error threshold. Below that, the rate of missed taps (a finger touching next to the button, or hitting a neighboring element by mistake) rises without showing up clearly in analytics: these failures almost never appear as a tracked event, they just translate into a lower conversion rate than the rest of the page would suggest.

What that means concretely for a CTA

• Button height — at least 44 to 48 px on mobile, padding included, not just the visually colored area: a button that looks large enough but whose actual clickable zone is smaller than its appearance reproduces the same problem.
• Spacing around the CTA — enough margin from neighboring clickable elements (menu links, checkboxes, social icons) reduces the risk of tapping the wrong target, an effect Fitts's law covers under the term "competing targets."
• Full width on mobile — a button that spans the full usable width of the screen maximizes both target size and central position, within the zone reachable regardless of which hand is used.
• Repeated vertical position — on a page that scrolls through several screens, repeating the main CTA at the bottom of each important section shortens the average distance to travel, rather than relying on a single button at the top of the page.

The most common mistakes

• Button sized for desktop, copied as-is to mobile — a CTA that feels comfortable on a 15-inch screen becomes tiny on a 6-inch one without a dedicated responsive adjustment.
• A single CTA at the very top of the page — convenient for design, costly for conversion: a visitor who gets convinced after reading the pitch has to scroll all the way back up to act.
• Icons or secondary links too close to the main CTA — a share button, a close icon, or a navigation link stuck next to the action button creates a zone of competing targets where the thumb can miss.
• Clickable zone smaller than the visual zone — insufficient CSS padding means a visually wide button remains, technically, a small tap target.
• Placement in the hard zone with no alternative — a CTA placed only at the top of the screen on a long page, with no sticky version or repeat, ignores the thumb zone instead of working with it.

Applying both findings to a real landing page

LanderKit templates ship as React/Tailwind components with button sizes already aligned with recommended tap-target thresholds, but Fitts's law is still useful for tuning a page based on its actual content. On a capture page like the newsletter or SaaS waitlist template, where the form is short and the expected action is immediate, a wide, centered CTA in the first screen is often enough. On a longer page like certified training or real-estate valuation, where the pitch unfolds across several sections, repeating the button at the bottom of each convincing block — not just in the hero — reduces the average distance between the moment a visitor is ready to act and the moment they find the button to do it. This logic ties directly into the principles covered in our article on mobile-first design, and pairs well with the button color choice covered in our CTA color guide — contrast draws the eye, size and position determine whether the thumb can actually get there.

Before reworking an existing CTA, a quick test is often enough to spot the problem: open the page on your own phone, hold it in one hand the way a rushed visitor would, and try to reach the button without shifting your grip. If your thumb has to stretch or the tap requires precision, conversion pays the price — regardless of how good the copy above the button is. The 10 LanderKit templates (€89 each, €229 for the full bundle) ship already calibrated to these thresholds, so you can focus on the offer and the copy instead of a button's pixel size.