Müller-Brockmann Grid Systems — built real, visible, and verified

Josef Müller-Brockmann (1914–1996), Zurich; Grid Systems in Graphic Design (1981) is the corpus. The grid is treated as an ethic, not decoration: "The grid system is an aid, not a guarantee. It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. But one must learn how to use the grid; it is an art that requires practice."

Two real review notes this skill exists to prevent:

1. "the grid is just slapped on top and misaligned" → the overlay wasn't in the same content box as the content (see §2.2).
2. "the H in the headline is off the grid" → the headline's BOX was on the grid but its INK wasn't; large glyphs carry a side-bearing (see §2.6). Box-on-grid ≠ ink-on-grid.

PART 1 — THE DISCIPLINE (decide before drawing)

• Objective order. The grid brings "constructive thought," legibility, and "objective and functional" design.
• Modular grid. Divide the type area into modules — columns AND rows — separated by consistent gutters, inside defined margins. For the web, a 12-column grid + 8px baseline is a robust general default.
• Baseline grid. Vertical rhythm is sacred: leading = a whole multiple of the baseline unit, and every element snaps to it.
• Typography. A grotesque sans (Akzidenz-Grotesk / Helvetica; on the web Inter, Helvetica Now, Archivo). Flush-left, ragged-right. Few sizes, large jumps in scale for hierarchy.
• Palette. Pure white paper, near-black ink, one accent — red is canonical (#e4002b).
• White space + asymmetry. Generous margins; asymmetric compositions held in tension by the grid.