Skip to content
UX Atlas
AccessibilityCraft conventionIntermediate

Reflow and Zoom

Content must work at 400 percent zoom without horizontal scrolling, which is the same as working at 320 pixels wide.

Definition

WCAG 1.4.10 requires content to be presentable without loss of information or functionality, and without two-dimensional scrolling, at a width equivalent to 320 CSS pixels. Data tables and complex diagrams are exempt.

Craft convention. True because the industry converged on it. Breaking it costs familiarity, not correctness.

On this page
  1. Definition
  2. Testing it
  3. Sources
  4. Continue from here

Testing it

  • Set the browser to 400 percent zoom on a 1280 pixel wide window. That is the 320 pixel equivalent.
  • Check that no horizontal page scrolling is required.
  • Check that sticky headers and footers do not consume the whole viewport.
  • Check that fixed-position elements do not cover content.
  • Check that long strings such as URLs wrap rather than forcing overflow.
  • Check that modals remain fully visible and scrollable.

Sources

Where a source establishes something narrower than the popular reading of it, the note says so.

Continue from here

Each link says what the connection is, so you can tell a principle from an alternative from a thing people mix this up with.

Applies when you are designing

A Data TableA Pricing PageAn Ecommerce ExperienceAn Enterprise Workflow

Relied on by

Entries that assume this is already in place.

Practical example

A worked decision where this was the deciding factor.

Check your work

Review passes that test whether this was done properly.

Related concept

Connected closely enough to change how you apply this.