WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: G142 and spatial relations

for

From: Patrick H. Lauke
Date: May 12, 2020 6:39PM

On 13/05/2020 00:19, Aditya via WebAIM-Forum wrote:
> G142 technique mentions "This technique requires that the zoom function preserves all spatial relationships on the page and that all functionality continues to be available"
>
> I'm confused about the spatial relationships part. At 200%, the last column of the page just wraps and moves to the end of the page. (Bootstrap)
> The DOM is unchanged but that content now is at the end of the page and users have to scroll all the way to the bottom.
> How can spatial relationship be maintained if page just reorders or reflows while zooming.

Spatial relationship means that it's important that certain pieces of
content are in a specific layout/arrangement in respect to each other.

Say your content is laid out as a table. It's important that all
rows/columns are correctly lined up, so it's clear which cell belongs to
which row/column. If that were to fall apart after zooming (with an
actual table column wrapping below/moving to the end of the page), then
it would no longer be clear which what the relationship of that content
is/which rows those cells belong to.

If the content still makes sense though even when it rearranges itself
to adapt to the changed viewport width, then there was no "spatial
relationship" there...the position of pieces of content relative to each
other was not important/wasn't what was conveying meaning/structure.

> Is it a failure if content is placed at a different visual location but still has all the content and functionality based on "spatial relationships" phrase mentioned in G142.

Not a failure.

> Isn't it also a failure if a menu turns into a hamburger menu at 200% since spatial relationship has changed and content is moved under this hamburger dropdown.
>

No, not a failure.

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