Skip to main content
WCAGrules
Quick navigation

Do not size text in viewport units

Text sized in viewport units scales with the window and ignores the reader's own text-size setting, so the one control meant to help them does nothing at all. F94 is the failure technique for that, and it is hedged twice on purpose. Viewport units used as the primary way of setting text size are what fails. Used alongside something else, they may not. Two exits get named as well. Media queries that adjust the size at different screen widths can take a page out of failure, and a site offering its own on-page text-size control passes the resize rule by that route whatever units it uses. So this is a real failure with genuine ways out, and the question worth answering is whether a reader can reach 200% by any means the page or the browser offers.

How we find it in an audit

A stylesheet sweep for vw, vh, vmin and vmax on font-size finds the candidates in seconds, and finding candidates is all it does. The verdict comes from the browser, because the test is to resize using browser zoom, the browser's own text-size setting, or any control the page provides, then check the text reaches 200% by one of them. Any single route passing is enough to clear it. Where the page ships its own text-size control we test that too, rather than assuming it works.

How affected users experience it

A low-vision reader turns text size up in the browser and the page does not move. Every other site responds to that setting, so the reasonable conclusion is that this page is broken rather than that the setting was ignored. What is left is browser zoom, which enlarges the layout along with the words and often brings horizontal scrolling with it. So the reader trades one problem for another and works harder for a worse result.

Passes vs. fails

Passes: the button grows with its text. Fails: fixed sizes shear the label.

Passes

h1 { font-size: clamp(1.5rem, 1rem + 2.5vw, 3rem); }

Fails

h1 { font-size: 5vw; }

How this gets tested

The W3C publishes test rules that define what a checker looks for here.

The other techniques filed under this rule

15 guides on this site are filed under 1.4.4 Resize Text. W3C documents this one as a failure of that rule, so it describes a way the rule gets broken rather than a way to pass it.

This guide is our interpretation of W3C technique F94: Failure of Success Criterion 1.4.4 due to incorrect use of viewport units to resize text. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.

Go somewhere useful

Find tools, resources and your workspace.

29 destinations