A beauty salon's mobile booking form had its 'Submit' button positioned at the very top-right corner of a long form, above every field — a layout that made sense on a desktop screen where a mouse cursor covers the whole page equally easily, but on a phone held in one hand, that corner sits at the exact spot a thumb has to stretch furthest to reach. Visitors were reasonably filling out the form and then either awkwardly two-handing the phone to submit it, or in a fair number of cases, apparently giving up right at the finish line. Moving the submit button to the bottom of the form, within comfortable one-handed thumb reach, reduced that specific drop-off.
Phones get held differently than screens get designed
Most web design historically inherited assumptions from desktop use, where every part of the screen is equally reachable with a mouse. A phone is different: it's usually held and operated with one hand, thumb doing the tapping, and the thumb has a natural, comfortable arc it can cover without the hand shifting grip or the other hand getting involved. Areas outside that arc — typically the very top of the screen and the far corners — require a grip shift, a reach, or a second hand to comfortably tap. Placing critical actions outside the comfortable zone doesn't make them impossible to tap, but it adds friction, and friction on a form is where visitors drop off.
Mapping the comfortable zone
- The bottom third to bottom half of the screen is generally the easiest one-handed thumb reach zone for most phone sizes and most people's grip habits
- The very top of the screen and the far upper corners are the hardest to reach one-handed, often requiring a grip adjustment
- Reach comfort varies by hand size, phone size, and whether someone is right- or left-handed, so there's no single universal boundary — but the general top-hard, bottom-easy pattern holds broadly
- This is why many mobile apps place primary navigation and key actions toward the bottom of the screen rather than only at the top, a pattern increasingly mirrored on mobile web design as well
Applying this to forms specifically
Forms are where thumb-zone thinking pays off most directly, because a form is a sequence of small, repeated taps — each field, then eventually a submit button — and any added friction compounds across the whole sequence. A long form that ends with a submit button in a hard-to-reach spot puts the friction at exactly the worst possible moment: right before the desired outcome, after the visitor has already invested effort filling everything in.
- Position primary action buttons (submit, book now, add to cart) toward the bottom of the visible screen or the bottom of the form itself
- Make interactive elements — buttons, checkboxes, dropdown fields — large enough to tap accurately without needing to zoom in first
- Avoid placing two tappable elements close enough together that a thumb might hit the wrong one, especially near screen edges
- For persistent actions like a call button or add-to-cart button, consider a fixed position at the bottom of the screen that stays visible while scrolling
- Test the actual form by filling it out one-handed on a real phone, not just by looking at how it's laid out
The best-designed submit button is worthless if reaching it requires the visitor to switch how they're holding their phone.
Tap target sizing matters alongside placement
Placement solves reachability; size solves accuracy. A button or link that's technically reachable but visually and physically tiny still causes mis-taps and frustration, particularly for visitors with larger fingers or those tapping while walking or otherwise not giving full attention to the screen. A commonly cited usability guideline suggests keeping tappable elements around 44 by 44 pixels or larger, with enough space between adjacent tappable elements that an inaccurate tap doesn't accidentally trigger the wrong one.
This affects more than forms
The same thumb-zone logic applies to navigation menus, filter controls on a listing page, and any interface with several tappable options stacked close together — a real estate site's property filters, an automotive dealer's inventory sort options, a restaurant's online ordering menu. Anywhere a mobile visitor is expected to make several taps in sequence, placement and sizing decisions compound, and small friction at each step adds up to a meaningfully worse experience overall.
A simple test that catches most problems
Hand a phone to someone unfamiliar with the site, ask them to complete the form or booking flow one-handed, and watch where their thumb struggles. This kind of informal usability check catches placement and sizing problems far faster than reviewing a design mockup on a desktop screen, where every part of the layout looks equally reachable. Mobile usability like this is part of what we review in a free audit.
Does your business show up when AI answers?
ChatGPT, Claude, Perplexity and Google's AI Overviews are already answering the questions your customers ask. The $49 AI Visibility Scan shows you where you're cited, where you're invisible, and the three changes that move you first — a written report in your inbox within 48 hours. If nothing in it is actionable, you don't pay.
Run the $49 AI Visibility Scan →Share this article
Comments
Leave a comment