Touch target size and placement
Mobile interfaces contain various interactive elements (buttons, menus, icons, links) that must be sized and spaced properly for reliable touch interaction.
Touch target guidelines vary by platform:
- WCAG minimum: 9x9mm (34px)[1]
- Material Design: 48x48px
- iOS: 44x44px
- Increase sizes further for apps used while moving, allowing room for error
Key design considerations:
- Keep at least 8dp/16px spacing between interactive elements
- Add inactive space around elements with minimum-sized touch targets
- Position primary buttons within thumb's reach, as users often operate phones one-handed
Pro Tip: Test your touch targets by navigating one-handed. If you struggle to tap accurately, increase target sizes or reposition key elements.