Skip to content

Commit f5aa89f

Browse files
committed
[css-anchor-position-1] Make the a11y section clearer about anchorpos not having any a11y implications itself. w3c/css-aam#14
1 parent 87ec652 commit f5aa89f

File tree

1 file changed

+34
-17
lines changed

1 file changed

+34
-17
lines changed

css-anchor-position-1/Overview.bs

Lines changed: 34 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -2412,24 +2412,37 @@ using existing JS APIs (such as {{Element/getBoundingClientRect()}}).
24122412
Accessibility Implications {#accessibility}
24132413
==========
24142414

2415-
It's important to remember that Anchor Positioning
2415+
Advisement: CSS Anchor Positioning does not create, delete, or alter any accessibility bindings between elements.
2416+
Authors must use appropriate markup features to control such bindings.
2417+
2418+
Because it can be used in many different ways
2419+
for many different use cases,
2420+
CSS Anchor Positioning
24162421
does not automatically establish any semantic relationship
24172422
between a positioned box
2418-
and any of its anchors,
2419-
because it can be used in many different ways.
2420-
Authors must not rely solely on a <em>visual</em> connection
2421-
implied by the positioning
2422-
to link elements together semantically;
2423-
without additional help,
2424-
the elements often have <em>no</em> meaningful DOM relationship,
2425-
making them difficult or impossible to use in non-visual user agents,
2426-
like screen readers.
2423+
and any of its anchors.
2424+
For example, the <em>visual</em> anchoring relationship in a design
2425+
might be between an element and its <em>semantic</em> anchor,
2426+
or it might connect the element to an ancestor, sibling, or descendant of the semantic anchor,
2427+
depending on the desired visual effect.
2428+
Siimilarly, a design might opt out of a visual anchoring relationship even while there is a semantic one,
2429+
or vice versa.
2430+
2431+
Authors must not rely on the visual connections
2432+
implied by CSS positioning
2433+
to link elements together semantically.
2434+
Without appropriate markup,
2435+
the elements linked visually have <em>no</em> meaningful DOM relationship--
2436+
which if there <em>is</em> a meaningful relationship,
2437+
can make them difficult or impossible to use in non-visual user agents,
2438+
like screen readers,
2439+
or in non-graphical navigation modes,
2440+
such as tab navigation.
24272441

24282442
Many features on the web platform,
24292443
both existing and upcoming,
2430-
allow establishing such connections explicitly,
2444+
allow establishing semantic connections explicitly,
24312445
so that non-visual user agents can also benefit.
2432-
24332446
For example, the [[HTML#the-popover-attribute|Popover API in HTML]]
24342447
automatically links the invoker button
24352448
to the popover element,
@@ -2445,13 +2458,17 @@ ARIA features such as
24452458
the <a href="https://w3c.github.io/aria/#aria-details"><code>aria-details</code></a>
24462459
or <a href="https://w3c.github.io/aria/#aria-describedby"><code>aria-describedby</code></a> attributes
24472460
on an anchor element
2448-
can provide this information
2449-
in a slightly more manual fashion;
2450-
in concert with the <{html-global/role}> attribute on the positioned element,
2451-
non-visual user agents
2452-
can tell their users about the relationship between the elements
2461+
can create connections
2462+
in a slightly more manual fashion.
2463+
In concert with the <{html-global/role}> attribute on the positioned element,
2464+
it allows non-visual user agents
2465+
to tell their users about the relationship between the elements
24532466
and let them automatically navigate between them.
24542467

2468+
However, authors should not overuse such features either,
2469+
since overburdening the page with extra, unnecessary semantic connections can also
2470+
make the page difficult to comprehend.
2471+
24552472

24562473

24572474
<!-- Big Text: cssom

0 commit comments

Comments
 (0)