F2.01.3grid as constraint not occupancydesign

A grid constrains edges; it does not demand occupancy

Aliases: empty columns · unfilled grid · occupancy

What it is

A grid tells you where edges may land. It does not order every cell occupied. A two-column form that takes 6 of 12 tracks, with 3 empty on each side, is the grid doing its job: field measure stays readable, edges stay on a line. Stretching those fields to 12 because empty tracks look “wasted” blows line length until scanning collapses.

Empty tracks are not unfinished work. Leaving them empty is what keeps a constraint a constraint.

Why it happens

Constraint and occupancy are different variables. Column lines restrict the legal set of alignment points. Occupancy sets density and measure. Body text has a comfortable measure; controls have a comfortable working width. Both come from the content, not from leftover tracks.

Filling empty columns usually treats a local complaint (“this page looks sparse”) with the wrong knob. The page needed a stronger type ramp, more content, or honesty that it is a short page — not more width. Stretching keeps the alignment datum and wrecks reading and pointing scale. A packed dashboard is sometimes right, because the modules need those columns to compare side by side, not because vacancy is illegal.

Where it stops holding

Dense workbenches and multi-metric canvases: empty tracks force cards that should be compared in a row to wrap, and filling is the task talking. Full-bleed media — maps, drawing surfaces, video — should eat available columns. The failure cluster is short content stretched: settings, sign-in, article body, confirm dialogs.

If “too much white” is actually groups with no gap contrast, that is a grouping problem. Filling columns to fix it yields long lines and groups that are still mush.

Applying it

  • For each module, ask what width the content actually wants, then take the nearest integer span. Leftover tracks may stay empty, or go to a neighbor that truly sits beside it.
  • Ban “it looks empty” as a reason to widen. Add content, add hierarchy, or accept a short page.
  • How to check: find every form, body and dialog stretched to full width. Measure line length (about 35–45 Han, 60–75 Latin characters) or the span of a single form control. Over budget with no side-by-side comparison task means occupancy got kidnapped by the grid. Pull the module back to the nearest comfortable span and confirm the left edge is still on the original datum.

Related

  • Same group: F2.01.1 A grid gives pages a shared alignment spine · F2.01.2 Column count sets which proportions you can even express
  • Nearby: F2.04 Whitespace · F2.07 Information density · F4.03 Line length
  • Search terms: grid occupancy · empty columns · measure · line length

Cards in the same group

Quick Actions

Share

Share this page

ios_share

https://hci.top/en/handbook/F2.01.3