1.4.10 Reflow (AA)

Success Criterion 1.4.10 Reflow (Level AA):

Content can be presented without loss of information or functionality, and without requiring scrolling in two dimensions for:

  • Vertical scrolling content at a width equivalent to 320 CSS pixels;
  • Horizontal scrolling content at a height equivalent to 256 CSS pixels.

Except for parts of the content which require two-dimensional layout for usage or meaning.

Note: 320 CSS pixels is equivalent to a starting viewport width of 1280 CSS pixels wide at 400% zoom. For web content which are designed to scroll horizontally (e.g. with vertical text), the 256 CSS pixels is equivalent to a starting viewport height of 1024px at 400% zoom.

Examples of content which require two-dimensional layout are images, maps, diagrams, video, games, presentations, data tables, and interfaces where it is necessary to keep toolbars in view while manipulating content.

Intent:

Having to scroll in two dimensions to view content on a page makes seeing and reading the content difficult. If a user has to scroll in order to see a full line of text, it becomes very difficult to then follow to the next line. Pages should reflow as zoom increases up to 400% so that content continues to be presented in only one column. This is often done through responsive design that uses CSS media queries to reflow the page for different viewport sizes. Some images can be resized so that they stay within the viewport as the user increases zoom, others need to be enlarged so that the user can see the details. See the WCAG Understanding Document for this criterion for more details.

Exceptions:

Some web page functionality requires scrolling in two directions. This can include large graphics, images or data tables where reflow is not feasible without losing meaning. It also includes toolbars that need to fit many buttons, which may scroll in the direction of the text.

Who it helps:

  • Users with low vision who magnify their screens.
  • Users who use mobile devices.

“It's nearly impossible to read text if I have to scroll right and left to read each line. It's disorienting and I lose my place. It makes it hard to understand what I'm reading.”

- Parent with low vision