Mobile navigation design starts with an awkward truth: phones keep getting taller, and thumbs do not get longer. Most people hold a phone in one hand and navigate with one thumb, often while doing something else.
The top corners of a large phone are the hardest places to reach. Many interfaces still put the menu exactly there.
Map where the thumb goes#
Picture the screen as three bands. The bottom third is easy to reach. The middle is comfortable. The top third needs a stretch or a second hand. Primary actions belong low; content and status can live high.
Practical placements#
- Put the most used destinations in a bottom tab bar, four or five at most
- Keep the main call to action in the lower half of the screen
- Use the top of the screen for titles, search entry and context, not for frequent actions
- Let sheets and menus open from the bottom so their options land under the thumb
Size targets generously#
A target that is easy to see is not always easy to hit. Platform guidance gives a useful floor: Apple recommends at least 44 by 44 points, Material Design 48 by 48 density-independent pixels, and WCAG 2.2 sets 24 by 24 CSS pixels as a minimum. Spacing matters as much as size, so adjacent links do not catch the wrong tap.
Hamburger or tabs#
A hamburger menu hides everything behind one tap. That is fine for secondary destinations, but it lowers discovery of anything important. If a section matters to the business, give it a visible place in the tab bar or on the page.
If people need it often, they should see it without opening anything.
Test with one hand#
The quickest review is physical. Hold the phone in one hand, walk across the room, and try to complete the main task. Where you shift your grip, the layout needs work.
