Can customers increase text spacing without losing content?

Understand what the criterion actually asks

WCAG 2.2 success criterion 1.4.12 concerns whether content and functionality survive when a user changes four text-spacing properties. For markup that supports them, the test values are line height at least 1.5 times font size, spacing after paragraphs at least 2 times font size, letter spacing at least 0.12 times font size and word spacing at least 0.16 times font size. These are values applied by the user for a test, not a command to set every customer page to that appearance. The page needs to remain readable and operable after the override.

The criterion includes an exception for a language and script that does not use one or more of those properties in written text. That matters for a Hong Kong site with English and Traditional Chinese editions: a property such as word spacing may have little visible effect on a run of Chinese characters without spaces, while line height, letter spacing and container behaviour can still matter. Do not simply exempt the entire Chinese edition, and do not assume English results stand in for it. Judge the properties that apply to each writing system and inspect the actual rendered page.

Choose the page states that matter

Create a short test set from customer tasks, not only a style-guide component gallery. Include a long product description, a pricing or delivery table, a checkout summary, a form with validation messages and a page with navigation that wraps at smaller widths. Choose an English and a Traditional Chinese example with realistic content lengths. A short placeholder sentence rarely reveals the problem that appears in a real address, service name or instruction. Record the original page and state so the team can compare the override against something customers actually use.

Include states reached after interaction. A confirmation banner may fit before a form error appears but crop the longer recovery instruction afterward. A button label may fit on desktop yet overlap its neighbouring price when a narrow card is rendered. Long bilingual navigation items can create a second row and push content under another layer. The test should therefore cover the point at which new content appears, not just initial load. If the site uses responsive layouts, check each materially different layout because W3C technique C36 specifically calls for that in its test procedure.

Apply one controlled spacing override

Start at the page’s ordinary zoom and apply only the four specified spacing properties with a user style mechanism, extension or test tool. Do not alter width, font size or zoom in the same pass; otherwise it becomes hard to identify which requirement exposed the loss. Preserve a record of the tool, values and browser used so another editor can repeat the result. Inspect every text container, including links, buttons, tabs, form labels, errors and explanatory text. The outcome is whether content and functionality survive, rather than whether the page still matches the designer’s original screenshot.

Look for clipped ascenders or descenders, a last word hidden by a fixed height, overlapping paragraphs, text that sits beneath a neighbouring card and controls whose names become unreadable. For an ellipsis, ask whether the full content remains available through a clear mechanism or on the linked destination; the W3C explanation allows truncation only where the content can still be obtained. Test with keyboard focus as well as visual inspection so a reveal-on-focus mechanism is actually usable. A page can look acceptable at first glance while a single purchase condition has disappeared.

Let content and containers grow

W3C technique C36 explains a practical repair: containers need room to expand, or must be able to expand when text spacing grows. A fixed pixel height on a card, navigation item or alert can turn a modest spacing change into clipping. Prefer content-driven block size and allow wrapping where the component can reasonably become taller. If a rigid row is essential, inspect whether it can change layout at a breakpoint or expose the full text by an operable control. Fix the container that loses content; applying a smaller font to hide the problem does not address the user override.

Treat horizontal space separately. A table with meaningful columns may need a scrolling region that keyboard users can reach, while a set of cards may stack. Do not break a price from its currency or a condition from the product it qualifies just to make the screenshot appear tidy. For Chinese copy, review punctuation and line breaks in the real font; for English, watch long service names and unbroken identifiers. The choice is about retaining relationships and actions, not preserving a particular number of cards per row.

Test a bilingual delivery option card

Consider an online shop whose delivery option card shows a method name, an estimated window, a fee and an eligibility note. In the original layout, all four lines fit into a fixed-height card. The English note becomes two extra lines after the spacing override, and the last line disappears behind the card boundary. The customer may select an option without seeing a condition that matters to the order. First remove the fixed block height and let the card grow; then check that its selection control remains attached to the same option and that neighbouring cards do not overlap.

Now load the Traditional Chinese version. The wording may occupy fewer or more lines despite conveying the same condition, and letter spacing can change where punctuation wraps. If the card sits beside a price summary, make sure neither pushes the other out of view. Next trigger an ineligible-address message and reapply the override: the added explanation must remain fully available. This is a worked test case, not a claim about a real merchant or a measured conversion effect. It shows why acceptance should follow the complete decision, including the error state, rather than a single static card.

Review both writing systems honestly

Do not turn the language exception into a blanket waiver. In Chinese text without spaces, changing word spacing might have no meaningful effect, but line-height changes can still clip characters in a badge and letter spacing can make a long button label overflow. In English, paragraph spacing can separate an instruction from the field it explains if the layout relies on absolute positioning. Test the properties that have an effect in each edition and record the observation. If a tool applies spacing in an unexpected way, verify its output rather than treating the extension’s report as proof of a site defect.

Read the full affected sentence after any repair. A visual patch can keep a box within bounds while silently hiding a qualification after an ellipsis. Compare the English and Chinese editions for the same business decision, but allow natural differences in structure and line length. A reviewer should be able to answer: what condition did the customer need, where was it shown before the override, where is it now, and can a keyboard user still reach it? That review is more meaningful than counting whether every component kept its original dimensions.

Keep a reproducible regression check

Write down the test page, content state, language, layout, browser and override values. Mark each issue by the actual text or control that was lost, with a before-and-after view and the action needed to reveal it. Close an issue when the information and task remain available with the override, not merely when the visual overlap has shifted elsewhere. A developer can then change a card, banner or navigation component and know exactly which customer path to recheck. Keep the test set compact enough to repeat during normal releases.

This test does not by itself establish that every accessibility requirement has been met. Zoom, reflow, contrast and keyboard operation have their own questions, even though one defect can affect several of them. For this decision, the immediate next action is to run the four-property override on a representative English and Traditional Chinese customer journey, fix any loss of content or functionality, and preserve the route as a release check. That gives the business evidence about a specific user need rather than a broad, unsupported accessibility claim.

When triaging defects, rank lost purchasing terms and blocked actions ahead of purely cosmetic shifts. A clipped eligibility sentence can change a decision even if the page remains visually polished; a slightly taller card can be harmless if its content and controls remain usable. Ask the content owner to read every repaired condition in both languages and confirm that the displayed wording still matches the offer. Then ask a tester to complete the task with the override active, including selecting an option and recovering from an invalid entry. This separates a functioning repair from a change that merely conceals overflow. Reuse the same examples when longer real copy replaces demonstration text.