UX / UI Medium impact Easy 15–30 min

Readability and size of links/buttons

Clickable elements must be readable and easy to hit.

What it is

Links and buttons with tiny text are harder to read and, above all, harder to hit with a finger on a touch screen. This relates to the size of the so-called tap target (the clickable area).

Why it matters

Small clickable elements increase the error rate: instead of clicking, the user misses or hits an adjacent link. That's frustrating and reduces conversions. Google recommends a tap target of at least 48×48 px with spacing.

How to do it

1Give links and buttons readable text (ideally 14px+).
2Ensure a sufficient clickable area (min. ~44–48 px) via padding, not just text size.
3Leave spacing between adjacent clickable elements (e.g. 8px+) so fingers don't overlap them.
4On mobile, test with your thumb, not a mouse.

Example

Correct

.btn, nav a {
  font-size: 1rem;
  padding: 12px 16px;   /* sufficient clickable area */
  display: inline-block;
}

Conclusion

Make clickable elements generous: readable text, ample padding, and spacing. You can only verify the exact tap-target size in the browser, but tiny clickable text is a clear signal to fix. Fewer mis-clicks = more conversions.