More levels compress the step between them

What it is

A mobile type system lists Display, H1–H6, Title, Body and Caption — nine rungs — and expects them to appear together on a 375-wide screen. The ceiling is screen height and how many characters fit on a line. The floor is the smallest readable size. Nine rungs dividing a fixed physical interval thin the size gap on every step. No single rung is “drawn wrong.” The count itself eats contrast. H3 and H4 collapse on device first; Title and Body start to follow.

Why it happens

Usable size on a display is a bounded interval, not a ruler you can stretch. The floor sits near the smallest discriminable size at the design distance; the ceiling sits where a title still does not wrap after two or three characters, or shove the rest of the first screen off. n levels means cutting that interval into n−1 steps. As n grows, a geometric scale drops its ratio toward the discrimination threshold; if you protect a few critical gaps (body vs. display title), the squeeze lands on the in-between rungs that also wanted to be a level. Either way, extra grades are not free: they steal width from existing steps. Smaller screens compress the same nine-rung table harder — H2/H3 that split on desktop may remain only “big type / small type” on a phone.

Studying it

Hold min and max size fixed, vary the number of grades, and measure forced-choice accuracy between adjacent rungs on a real device. Independent variables are rung count and allocation (geometric, linear, dropping middle rungs); dependents are pairwise discrimination and the number of piles in a free-sort. A lighter audit lists every size that actually appears on one screen, computes adjacent ratios, and flags steps below the discrimination threshold. You do not need a debate about the “scientific” number of rungs before counting how many cuts this screen already made.

Where it stops holding

Compression is an account on the size axis. If adjacent rungs already split hard on weight, colour or position, a thin size step can still be treated as a different level — but size is no longer doing that work. A very wide desktop raises the ceiling, so the same nine rungs can open up again; drop that desktop ladder unchanged onto a watch or a widget and compression arrives early. Dynamic type translates floor and ceiling together; with rung count held constant the relative squeeze remains, but some rungs hit the system maximum and get clipped, which is a runtime loss of usable gaps.

Applying it

• Write down how many size grades this class of screen can show at once, then design the table. Mobile reading UIs should keep on-stage size levels to a few; nominal H4 and H5 can live in the document outline without owning a pixel step.
• Protect two incompressible distances: body vs. main title, and body vs. caption. What can be sacrificed are middle rungs that rarely carry “look here first.”
• When H3/H4 will not split on a device, delete a rung. Do not nudge every rung by 1 px — nudges do not un-slice a crowded interval.
• Check: pick the page that actually shows the most sizes at once, list pixel values, compute adjacent ratios. Merge or drop any pair that is not instantly split in a device forced-choice. Recompute until the list has no neighbours that are named as levels and seen as one.

Related

• Same group: F3.02.1 A size difference must clear the discrimination threshold before it makes a level · F3.02.3 Hierarchies of three levels or fewer are the most stable
• Nearby: F3.01.3 Weight is relative and meaningless out of context · F4.01.2 Adjacent rungs must be discriminable · F5.08.3 The number of levels is limited by discriminable luminance steps
• Search terms: hierarchy compression · type scale · dynamic range · size contrast