WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Testing 1.4.10 Reflow

for

From: Patrick H. Lauke
Date: Nov 30, 2020 10:05AM

On 30/11/2020 16:38, Mark Magennis wrote:
> I'm having trouble understanding how to test for this. The SC says this applies to "Vertical scrolling content at a width equivalent to 320 CSS pixels" and the note says "320 CSS pixels is equivalent to a starting viewport width of 1280 CSS pixels wide at 400% zoom". So I assumed that either of the following approaches would be sufficient and that both would give the same results:
>
> 1. Resize the browser window to a width of 320px.
> 2. Resize the browser window to a width of 1280px and zoom to 400%.
>
> But I've tested this in Chrome on bbc.com/news using the Window Resizer extension v.2.6.4 and the results aren't the same. I've tried changing the Window size and changing the Viewport size but in both cases the results aren't the same.
>
> Can anyone tell me what I'm not understanding here and what testing process I should be following?


Assuming you're doing this in Chrome, even using something like Window
Resizer extension the browser won't actually let you go below a certain
width (500px generally). So, likely, you're not comparing like for like
to being with.

Only way to do it without too much effort is to use DevTools, device
toolbar, and ideally set yourself up with a new custom profile there for
320 px width but without touch/acting like a desktop. Or, zoom to 200%
and then use Window Resizer to go to something with 640px width (which
at 200% zoom is obvs 320 CSS px).

Beyond that, just changing the width, versus doing the zoom, will result
in a difference in height, obviously. If the site also uses the height
of the viewport as a determining factor, then the results will also look
different).

P
--
Patrick H. Lauke

https://www.splintered.co.uk/ | https://github.com/patrickhlauke
https://flickr.com/photos/redux/ | https://www.deviantart.com/redux
twitter: @patrick_h_lauke | skype: patrick_h_lauke