hierarchy

• SKILL.mdcore · 15,569 bytes
• references/research-and-cross-domain.mddoc · 7,716 bytes

# Hierarchy

Hierarchy is the ranking of importance among visible elements, made legible to the eye through differences in size, weight, color, contrast, position, density, and surrounding space. It is the single most decisive principle in visual design: when hierarchy is well-constructed, the rest of the layout almost designs itself; when it is missing, no amount of polish recovers the page.

## Definition (in our own words)

A composition has *visual hierarchy* when the viewer can, at a glance and without instruction, identify a primary focal element, secondary supporting elements, and recessive background elements. Hierarchy is created by introducing **deliberate differences** along one or more visual dimensions (size, weight, color, position, density, motion). It is destroyed by making everything the same — and equally by making everything different at maximum intensity. Hierarchy is a *contrast* principle: emphasis is meaningful only against a quieter background.

## Origins and research lineage

The deliberate construction of visual hierarchy is one of the oldest practices in graphic communication. Its modern theoretical grounding draws from several lines of work:

- **Gestalt psychology** (Wertheimer, Köhler, Koffka, c. 1910–1930) established that perception groups stimuli into wholes whose structure precedes their parts. The Gestalt laws (figure/ground, proximity, similarity, continuation) are the mechanisms by which hierarchy is read.
- **Information design** (Bertin's *Sémiologie graphique*, 1967; Tufte's *Visual Display of Quantitative Information*, 1983) formalized the visual variables (position, size, value, texture, color, orientation, shape) that encode rank and difference.