The Practical Ceiling for a Mobile Tab Bar
A mobile app's IA has seven validated top-level sections, and the team is deciding whether a persistent bottom tab bar can hold all of them.
Per this subject's stated deciding factor for tab bars, what's the practical ceiling on top-level items?
The correct answer is "Roughly 5 — more forces an overflow tab, defeating the pattern's purpose."
This subject's navigation-pattern table names the deciding factor explicitly: a tab bar fits when top-level sections number roughly ≤5; more than that and tabs get crowded or require an overflow "More" tab, which defeats the pattern's whole purpose of persistent, one-tap access. Seven items is past that ceiling, which is exactly the scenario the worked mobile-banking example in this subject walks through — folding lower-frequency items into a "More" entry to bring the tab bar back to five.
The distractors don't match the stated guidance: 3 isn't the cited ceiling — the table specifically names roughly 5; tab bars don't scroll horizontally as a way to fit more items — that would undermine the "persistent, glanceable" property the pattern exists for; and there is a stated ceiling — treating icon size as the only constraint ignores the crowding and overflow problem the subject calls out directly.
Share this question