# Content Hierarchy

> Structuring content for scanability, progressive disclosure, and information architecture.

- Skill: `dragoon0x/content-hierarchy` (Agent Skill)
- Install (CLI): `npx skillmds@latest add dragoon0x/content-hierarchy`
- Raw SKILL.md: https://api.skillmd.com/api/skills/dragoon0x/content-hierarchy/raw
- Safety review: pending
- Works with: Claude Code, Claude.ai, OpenAI Codex
- Category: Coding & Dev Tools
- Author: dragoon0x (https://skillmd.com/u/dragoon0x)
- Updated: 2026-09-17
- Page: https://skillmd.com/skills/dragoon0x/content-hierarchy

---


# Content Hierarchy

## Inverted Pyramid
Most important information first. Details follow.
1. Headline: the conclusion/key takeaway
2. Lead: essential context (who, what, when)
3. Body: supporting details
4. Background: additional context for those who want depth

## Scanning Patterns
- F-pattern: users scan headings down the left, then read selectively
- Layer-cake: users jump between headings, scanning for relevance
- Spotted: users scan for specific targets (links, buttons, numbers)

## Design for Scanners
1. Clear headings at each level
2. Bold key terms within paragraphs
3. Short paragraphs (3-4 sentences max)
4. Bulleted lists for 3+ related items
5. Pull quotes for key insights
6. Numbers and data points stand out

## Progressive Disclosure
- Show summary by default
- Expand for details on demand
- 'Show more' / 'Read more' with preview of what's hidden
- Accordions for FAQ-style content
- Tabs for parallel content types