Progressive Disclosure
Show the common case first and reveal the rest on request, so complexity is available without being present.
Definition
A structuring principle that separates an interface into an initial view containing what most users need most of the time, and secondary views containing the rest. The secondary layer stays reachable, discoverable and complete.
Expert heuristic. A review criterion developed by practitioners. Useful and widely taught, but evaluated by judgement rather than measurement.
On this page
Two conditions make it work
First, the split has to be right. You need evidence about what the common case actually is, otherwise you have hidden the thing most people came for. Analytics and task frequency data are the inputs, not intuition.
Second, the hidden layer has to be discoverable. 'Advanced' as a label tells the user nothing about what is inside. Naming the content, such as 'Shipping and tax options', lets them decide whether to open it.
Forms this principle takes
| Form | Best for | Watch out for |
|---|---|---|
| Accordion or disclosure | Optional detail on one page | Hiding required fields, which breaks form completion. |
| Show more on truncated text | Long descriptions | Truncating before the useful part of the sentence. |
| Tabs | Parallel content of similar importance | Content users need to compare, which tabs prevent. |
| Multi-step wizard | Long linear tasks | Trapping users. Always allow back and review. |
| Detail panel or drawer | Inspecting one item from a list | Losing list context, and mobile behaviour. |
| Overflow menu | Rare actions | Burying an action a segment uses constantly. |
In practice
Optional shipping instructions
CheckoutA collapsed 'Add delivery instructions' link keeps checkout short for the majority while keeping the capability one click away for the minority who need it.
Advanced search
SearchA single query field with an expandable set of filters serves both the person typing two words and the person constructing a precise query, without making the first pay for the second.
Sources
Where a source establishes something narrower than the popular reading of it, the note says so.
J. Nielsen, Nielsen Norman Group, 2006
Continue from here
Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.
Applies when you are designing
Why this works
The reasoning this entry rests on.
- Choice OverloadPsychology
- Cognitive LoadPsychology
Disclosure works because working memory is the constraint, not screen space.
- Decision FatiguePsychology
Applied through
Where this shows up as a concrete interface decision.
- AccordionComponent
- TabsComponent
- FilteringPattern
- Settings and PreferencesPattern
Alternative approach
A different answer to the same problem, with a different cost.
- Multi-Step FlowsPattern
One long form with disclosure, or several short steps. The choice turns on whether the parts are genuinely sequential.
Related concept
Connected closely enough to change how you apply this.
- Aesthetic and Minimalist DesignHeuristic
- Help and DocumentationHeuristic
- Hick's LawLaw
- Miller's LawLaw
- Tesler's LawLaw
- DiscoverabilityPrinciple
- Occam's RazorPrinciple
- Pareto PrinciplePrinciple