WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Testing 1.4.10 Reflow

for

From: Mallory
Date: Nov 30, 2020 12:13PM

The height thing is important.
Websites where someone made sure it "looks good on the old iPhone" often don't check zoomed desktop users (yay, me). The main issue is, developers assume mobile views are portrait views, but zoomed desktoppers are going to be landscape.
If you're testing with an actual phone-like device, check landscape please.

Sticky headers/footers kill me. There are websites I cannot use until I first delete the stickies in devtools. What if I was a normal person who didn't use devtools?? I'd be locked out.

cheers,
_mallory

On Mon, Nov 30, 2020, at 6:05 PM, Patrick H. Lauke wrote:
> 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
> > > > >