# Visual Hierarchy & Emphasis

**Track:** Design Foundations — Design & Human-Centered Design — proposed (25)
**Framework / surface:** design
**Level:** Beginner
**Prerequisites:** Gestalt Principles of Perception

**In one line:** Directing attention through scale, contrast, weight, and position.

## Theory, aesthetics & inspiration

Hierarchy is the designer's grammar of attention: by manipulating scale, contrast, weight, and position, a composition declares what matters first, second, and third. Dominance and subordination give the eye a path rather than a field of equals. The Bauhaus and Swiss schools formalized this through typographic emphasis, and Jan Tschichold's "Die neue Typographie" (1928) argued that contrast, not ornament, should rank information. Empirically, Nielsen Norman Group's 2006 eyetracking revealed the F-shaped scanning pattern for dense text, while the older Z-pattern guides the eye across sparse, image-led layouts — proof that people scan rather than read. Today WCAG 2.2 (2023) folds contrast minimums into accessibility, making hierarchy an ethical as well as aesthetic obligation.

## References

- [Visual hierarchy — Wikipedia](https://en.wikipedia.org/wiki/Visual_hierarchy)
- [F-Shaped Pattern of Reading on the Web — Nielsen Norman Group](https://www.nngroup.com/articles/f-shaped-pattern-reading-web-content/)
- [Web Content Accessibility Guidelines (WCAG) 2.2 — W3C](https://www.w3.org/TR/WCAG22/)