WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Resizing content on a web page

for

From: Mark Magennis
Date: Feb 10, 2023 8:50AM

Francesco,

You need to look at the WCAG SC's 1.4.4 Resize text and 1.4.10 Reflow.

1.4.4 Resize text states that users should be able to zoom up to 200% without losing any content or functionality. 1.4.10 Reflow is the one that people are referring to when they talk about 400% zoom. It states that users should be able to view the page at a viewport width of 320px without losing any content or functionality and without having to scroll horizontally to read any piece of text. It contains a similar requirement for height and vertical scrolling. The reason people talk about 400% is that the 320px requirement was chosen at least partly because it is equivalent to zooming to 400% on a 1280px wide screen and this is considered a reasonable thing for many users with visual impairments to need to do. But the SC doesn't actually say 400%, just so you know.

Note that 1.4.4 Resize text doesn't state a starting window size and zooming to 200% on a window 1600px wide is obviously different to zooming to 200% on one that is only 640px wide. So you have to be sensible and think about what's reasonable. For example, is it reasonable to expect that someone zooming to 200% will be using a screen of 1280px or wider? Given that 1280px is considered a reasonable starting point for 400% zoom in 1.4.10 it seems sensible to also use that screen size as a basis for testing 1.4.4.

Bear in mind also that 1.4.10 Reflow says "at exactly 320px" whereas 1.4.4 Resize text says "up to 200%" (not quoting verbatim there but that's the meaning) and this is an important difference.

This is my best shot at a brief explanation. I expect someone may tell me what I've said here is wrong, misguided, or leaving out important details though, so I await that with interest.

All the best,
Mark