Fitts’s Law: Make Important Actions Easy to Reach
Review reach, target size, separation, and consequence before calling an action usable.
Start with the moment where the interface asks too much.
Someone is using a phone with one hand while carrying something in the other. They finish a form. The final action is a tiny icon in the far corner, close to another control and partly above the keyboard. The task is technically possible. That is not the same as usable. The interface has turned completion into precision work at the exact moment confidence should be highest.
Selection effort depends on more than visible button size. Distance, interactive area, movement context, competing targets, device, and motor ability all shape whether an action feels effortless or fragile.
Show the failure and the correction.
The lab uses controlled markup instead of raster text so the lesson stays legible, accessible, and easy to revise.
- Attention is near the inputThe movement path becomes longer than the task deserves.
- Visible icon is mistaken for hit areaMissed taps look like hesitation or broken UI.
- Competing targets crowd the actionA high-consequence mistake becomes easier.
- Reach is reviewed as a systemCompletion feels calm.
Move action near completion
Place the next action close to the content that enables it.
Make the useful path easier.
Reach, size, separation, consequence
A high-consequence action deserves stronger treatment across all four. A large button far from attention can still be awkward; a nearby target beside a destructive action can still be risky.
Hit area is not decoration
A small icon can be acceptable when the interactive target around it is generous and labelled. The visible graphic and clickable region do not have to be the same size.
Standards and comfort differ
WCAG target-size guidance gives a baseline for pointer targets. Comfortable use may require more generous spacing based on device, posture, frequency, and consequence.
Turn critique into a usable rule.
Remove
Tiny final control
The smallest target on the screen carries the most important action.
Keyboard collision
The submit path disappears behind or above a mobile keyboard.
Destructive neighbor
A rare or destructive action sits close to a frequent action.
Build
Move action near completion
Place the next action close to the content that enables it.
Increase actual target area
Use padding, minimum size, and touch-safe spacing without making every action visually loud.
Separate risky actions
Use distance, confirmation, or alternative placement when the consequence is high.
Use it on a real page.
Complete the primary mobile task with one hand and the on-screen keyboard visible.
Record missed taps.
Record grip changes.
Check whether focus or keyboard obscures controls.
Repeat with zoom and longer content.
- Use observations, tap misses, and screenshots of keyboard-open states.
- The important action remains reachable, distinct, and comfortably tappable.
- Completion depends on precise reach, hidden controls, or risky neighboring targets.
The rule should help the person making the next decision.
Business owner
Judge mobile conversion paths by effort, not only by whether the button is visible.
Designer
Draw reach arcs and competing-target zones on mobile screens.
Developer
Implement minimum hit areas and keep icon-only controls labelled.
QA
Test with one hand, zoom, keyboard visible, and real touch input where possible.
Large targets cannot replace clear labels or hierarchy. Enlarging every action equally may increase clutter and accidental activation, especially in high-density professional tools.
Check the page, then answer the doubt.
- Important controls have generous hit areas.
- Primary actions sit near enabling content.
- Destructive actions are separated.
- Icon-only controls have names.
- Keyboard-open layouts remain usable.
- Touch and pointer assumptions are both checked.
- Is visible icon size the same as touch-target size?
- No. The interactive region can and often should be larger than the visible icon.
- Does Fitts’s Law apply to desktop websites?
- Yes, but distance, pointer precision, keyboard paths, and screen density change the review.
- How large should mobile buttons be?
- Use current standards as a minimum, then adjust for task consequence, context, and comfort.
Standards and research links support the factual parts of the rule. They do not replace original judgment on the page.
Use the rule on the page that matters.
Use this when the reader is ready to inspect their own page before asking for a rebuild.
Get the conversion checklist