Re: Examples of websites that handle linearization properly

On 20/07/2020 23:11, Catherine Ailanjian wrote:
> Patrick,
> 
> I'm using Accessibility Insights for Web for accessibility testing.  For SC 1.3.2 of WCAG 2.1, these are the instructions in the Assessment portion:
> 
> -----------------------------------------------------------------------------------------------------------------------------------------------------------------------
> The visual helper for this requirement highlights content positioned on the screen using CSS position:absolute or float:right.
> This procedure also uses the Web Developer browser extension.
> 1. Examine the target page to determine whether it has any positioned (highlighted) content that's meaningful:
>       a. Content is meaningful if it conveys information that isn't available through other page content.
>       b. Content is decorative if it could be removed from the page with no impact on meaning or function.
> 2. If the page does have meaningful positioned content, use the Web Developer browser extension (Miscellaneous > Linearize page) to show the page in DOM order.
> 3. Verify that the positioned content retains its meaning when the page is linearized.
> 4. Record your results.
> -----------------------------------------------------------------------------------------------------------------------------------------------------------------------
> 
> So, I'm looking for web pages that retain the meaning of their content when the page is linearized, especially e-commerce sites.

That explanation/instruction in Accessibility Insights is perhaps a 
touch misleading or confusing. Essentially, what 1.3.2 wants to 
ascertain is that the content makes sense in terms of the DOM order / 
the order in which assistive technologies would read/announce it. This 
is approximated visually by using the linearization tool in the web 
developer extension or similar. Another way to test would be to actually 
go through the page with a screen reader. And what you're trying to 
check is whether or not the content/functionality overall still makes 
sense, i.e. that the page wasn't relying on layout/positioning to convey 
meaning.

To be clear, actual end users wouldn't generally use something like web 
developer extension's "Linearize page". This is used here to help with 
evaluating the content order of the page, from an audit/development 
point of view.

Now I'm curious about your original question "I’m looking for websites 
that make use of CSS-background images but that also handle 
linearization well"...not quite clear what background images would have 
to do with ascertaining correct content order - I'm going to speculate 
and ask "is it because doing the "Miscellaneous > Linearize page" step 
ends up messing with the CSS and some of your images are disappearing? 
If so, that's not a problem per se, as it's expected that a page starts 
to look odd once you mess with its CSS.

Maybe more specifically: do you have a specific page that you're 
currently evaluating that you believe i failing content order? And it 
also uses CSS background images? Maybe it's easier if we can have a look 
at the kind of problem you're concerned with?

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

Received on Monday, 20 July 2020 22:24:28 UTC