RE: How to test for WCAG 2.1 SC 1.4.10 Reflow - Level AA?

I also recommend docking the dev tools to the side when testing and resizing.  I believe Chrome will show you the values as you drag but Firefox requires a setting change in order for those values to be display.  The setting is in Dev tools.

My preference is to test at 320 CSS width and not start at 1280 width and zoom to 400% -- but I haven't proven examples where it could be different.

Jonathan

-----Original Message-----
From: Alastair Campbell <acampbell@nomensa.com> 
Sent: Monday, February 10, 2020 12:45 PM
To: Newton, Brooks (TR Product) <Brooks.Newton@thomsonreuters.com>
Cc: w3c-wai-gl@w3.org
Subject: Re: How to test for WCAG 2.1 SC 1.4.10 Reflow - Level AA?

CAUTION: This email originated from outside of the organization. Do not click links or open attachments unless you recognize the sender and know the content is safe.


Hi Brooks,

If it helps, I tend to test reflow, text-size & text-spacing at the same time:

- Set the window to wider than the largest breakpoint (usually 1280 wide does that)
- Zoom until the effective width is 320px (which is 400% from 1280)
- Check for horizontal scrolling.
- Check for text that hasn't re-sized to at least 200%
- Check for any sticky headers/footers that block the view (not a fail, but we bring that up as a 'best practice' issue)
- Activate the text-spacing bookmarklet
- Gradually zoom out looking for areas of text that have been cut off, and check that menus & complex features work.

It's worth poking around features like hamburger menus and anything that isn't standard content as you go through those connotations, but once you've done it on one page of a site you can narrow down to the differences on other pages.

Cheers,

-Alastair


On 10/02/2020, 17:11, "Newton, Brooks (TR Product)" <Brooks.Newton@thomsonreuters.com> wrote:

    Aha!  Nice workaround by docking the Chrome DevTools to the side.   That allows the Chrome browser viewport to be resized below 500 pixels.  Also, good advice on starting at 640 pixels in the browser viewport width, then zooming to 200% to test for Reflow.  Thank you, Patrick, for those tips.

    Brooks

Received on Monday, 10 February 2020 19:32:05 UTC