A long invisible wait hurts more than painting a fallback first

What it is

When paint is blocked, the letters’ boxes are there and the ink is transparent: FOIT, flash of invisible text. Painting immediately in a fallback, then swapping when the custom face arrives, is FOUT, flash of unstyled text. A few seconds of blank makes people think the copy failed to load. Seeing the “wrong” face makes people think the type is there and the face is late. A long blank hurts more than a face-swap — invisible waiting looks like a fault; ugly waiting looks like loading.

Why it happens

The first move in a reading task is confirming “there are words here.” FOIT removes that confirmation and leaves holes the height of the type: buttons with no labels, headings with no headings. A three-second timeout is short in a lab and long enough on a first screen for a back-tap or a retry. FOUT keeps the confirmation and pays with a style jump. People can explain a jump (“the font just landed”); they cannot explain a blank (“is the network dead”). The longer the block, the more FOIT resembles an outage. Slow networks, large files, several weights fetched at once stretch the block into seconds. This is not a taste preference. It is fault attribution: blank is tagged as the system broken, a swap as still loading.

Where it stops holding

A wordmark, a single brand word, can sit invisible for tens of milliseconds with FOIT cost near zero; a screen of body cannot. A cached page with a cached face flashes neither way. On a very slow network FOUT can linger on a fallback that is missing glyphs or barely readable; visible-but-unreadable can hurt more — that is a bad fallback, not an argument for returning to blank. If a skeleton is already saying “content is coming,” FOIT on top is a double hole.

Applying it

• Do not put body copy and button labels on a long block. Let a system face appear first.
• Record the first screen on a slow-network profile: time from entry to the first readable word. On a FOIT path that interval has no type on screen. Compare it to FOUT; which one looks like a fault is usually obvious.
• Subset and split weights so the custom face arrives sooner, shrinking the FOUT swap window. Do not lengthen the block in the hope the file wins the race.

Related

• Same group: F4.15.1 Text during a custom-font load needs an explicit display strategy · F4.15.3 Metric mismatch between fallback and target shifts the layout after load · F4.15.4 When a webfont fails, a system face must catch — not a blank
• Nearby: F4.07 Typeface choice · E6.07 Skeleton screens
• Search terms: FOIT · FOUT · flash of invisible text