Fat-finger errors: fixing links and buttons that are hard to tap

You try to close a popup and open an ad instead. You aim for "Terms" and land on "Privacy". You tick a checkbox three times before it registers. These are fat-finger errors, and despite the jokey name they have nothing to do with the size of anyone's hands. They are design faults: controls that are too small, too close or too hard to hit on a touch screen. Every one of them costs a little patience, and on an enquiry form or checkout that patience runs out quickly.

This article focuses on diagnosis and repair. It works through the four offenders that cause most mis-taps and explains how to find them on your own site.

How to tell that visitors are mis-tapping

People rarely report this kind of problem. They just try again, or leave. So you need to look for indirect evidence.

• Session recordings and heatmaps: tools such as Microsoft Clarity can show repeated rapid taps in one spot, often called rage clicks, and taps landing just beside a button.
• Unexpected navigation in analytics: visits to your privacy page that immediately bounce back to the checkout, or a surge of clicks on a footer link that sits next to a popular one.
• Accidental submissions: half-filled forms arriving in your inbox because the submit button sits right below a field.
• Your own thumb: use the site one-handed on a small phone while walking around the office. Anything you miss once, customers will miss often.

Culprit 1: Tiny links inside text

Inline links are the hardest targets on most sites. A link on a single short word such as "here" or a number is only as tall as the text and perhaps 30 pixels wide. When two such links sit close together, as in "see our terms and privacy policy", accurate tapping becomes a matter of luck.

Fixes for inline links

1. Link longer, meaningful phrases rather than single short words. "Read our refund policy" is easier to hit than "click here", and it is better for accessibility and SEO too.
2. Increase line height in body text to around 1.5, which creates vertical breathing room between lines of links.
3. Avoid placing two links separated by only a comma or a single word. Rewrite the sentence or move links into a list.
4. For link-heavy blocks such as footers or related articles, turn them into a vertical list with padding on each item instead of running text.

Culprit 2: Buttons placed side by side with no gap

Paired buttons are everywhere: Cancel and Confirm, Previous and Next, Minus and Plus on a quantity selector, Edit and Remove in a cart. When they touch or sit a few pixels apart, a slightly off-centre tap triggers the wrong action. If the wrong action is "Remove", the customer loses their cart item and may not bother re-adding it.

Fixes for adjacent buttons

• Leave clear space between neighbouring buttons, at least 8 pixels and more for opposing actions.
• On small screens, stack paired buttons vertically at full width, with the primary action most easily reachable.
• Make destructive actions visually different, for example a text link style instead of a solid button, and place them away from the main action.
• For quantity selectors, enlarge the plus and minus buttons and consider allowing the number to be typed directly.
• Offer an undo message after removal so a mistake costs a single tap to reverse.

Culprit 3: Small close icons on popups and banners

A 12-pixel "×" in the top corner of a popup is a classic trap. The visitor wants to dismiss the popup, misses, taps the popup content behind it and gets taken somewhere they did not want to go. On mobile, the top corner is also one of the hardest spots to reach one-handed.

Fixes for close buttons

• Give the close control a hit area of at least 44 pixels square, even if the visible icon stays small, by adding padding.
• Keep a gap between the close button and any link or button inside the popup.
• Allow tapping the dimmed background outside the popup to close it, and support the Escape key for keyboard users.
• Add a clear text option such as "No thanks" near the bottom of the popup, where thumbs reach easily.
• Never place the close button outside the visible screen area on small phones. Test on a narrow device.

Culprit 4: Checkboxes and radio buttons with miniature hit areas

Default browser checkboxes are small, often around 13 to 16 pixels. If only the box itself responds to taps, ticking "I agree" or choosing a delivery option becomes surprisingly awkward.

Fixes for checkboxes and radios

1. Connect every checkbox and radio to its text with a proper label element. Then tapping the words ticks the box, which instantly multiplies the target area.
2. Add vertical padding to each option row so the entire row is tappable and options are well separated.
3. For important choices such as shipping method or payment type (UPI, card, cash on delivery), use large selectable cards instead of bare radio buttons.
4. If you style custom checkboxes, make sure the real input remains accessible and the clickable label area stays large.

Retesting after fixes

After making changes, repeat the thumb test on at least two phones, including a narrow one around 360 pixels wide. Run a Lighthouse audit in Chrome DevTools to catch any remaining targets flagged for size or spacing, and check your session recordings again after a couple of weeks to confirm the rage-click spots have calmed down.

Start with the pages that carry money or leads: product pages, cart, checkout and your enquiry form. If those templates are difficult to change in your current theme, our support team can help, or see how we build checkout flows in our online store development work.

Frequently asked questions

Why do I keep clicking ads by mistake on some websites?

Often because ads or links are placed right next to content controls such as close buttons, menu icons or pagination. Small targets and layout shifts while the page loads make accidental taps far more likely.

Can layout shifts cause wrong taps?

Yes. If an image or banner loads late and pushes content down just as someone taps, the tap lands on whatever moved into place. Reserving space for images and ads reduces this.

Is it enough to make buttons bigger to stop mis-taps?

Size helps, but spacing, placement and clear labels matter just as much. Two large buttons with no gap can still be confused, especially when one of them is destructive.