@@ -1372,49 +1372,6 @@ were ''visibility: hidden'',
1372
1372
regardless of what their actual 'visibility' value is.
1373
1373
1374
1374
1375
- Accessibility Implications {#accessibility}
1376
- --------------------------
1377
-
1378
- It's important to remember that Anchor Positioning
1379
- does not automatically establish any semantic relationship
1380
- between a positioned box
1381
- and any of its anchors,
1382
- because it can be used in many different ways.
1383
- Authors must not rely solely on a <em> visual</em> connection
1384
- implied by the positioning
1385
- to link elements together semantically;
1386
- without additional help,
1387
- the elements often have <em> no</em> meaningful DOM relationship,
1388
- making them difficult or impossible to use in non-visual user agents,
1389
- like screen readers.
1390
-
1391
- Many features on the web platform,
1392
- both existing and upcoming,
1393
- allow establishing such connections explicitly,
1394
- so that non-visual user agents can also benefit.
1395
-
1396
- For example, the Popover API in HTML
1397
- automatically links the invoker button
1398
- to the popover element,
1399
- including automatically adjusting tabbing order;
1400
- it <em> also</em> establishes the invoker button
1401
- as the [=implicit anchor element=] for the popover,
1402
- making it easy to use Anchor Positioning as well.
1403
-
1404
- In more general cases,
1405
- ARIA features such as
1406
- the <a href="https://w3c.github.io/aria/#aria-details"><code>aria-details</code></a>
1407
- or <a href="https://w3c.github.io/aria/#aria-describedby"><code>aria-describedby</code></a> attributes
1408
- on an anchor element
1409
- can provide this information
1410
- in a slightly more manual fashion;
1411
- in concert with the <{html-global/role}> attribute on the positioned element,
1412
- non-visual user agents
1413
- can tell their users about the relationship between the elements
1414
- and let them automatically navigate between them.
1415
-
1416
-
1417
-
1418
1375
<!-- Big Text: a-size()
1419
1376
1420
1377
███▌ ███▌ ████ █████▌ █████▌ ██ ██
@@ -2331,6 +2288,60 @@ using existing JS APIs (such as {{Element/getBoundingClientRect()}}).
2331
2288
-->
2332
2289
2333
2290
2291
+ <!-- Big Text: a11y
2292
+
2293
+ ███▌ █▌ █▌ █ ▐▌
2294
+ ▐█ ▐█ ██▌ ██▌ ▐▌ █
2295
+ █▌ █▌ █ █▌ █ █▌ █ ▐▌
2296
+ █▌ █▌ █▌ █▌ ▐▌█
2297
+ █████▌ █▌ █▌ █▌
2298
+ █▌ █▌ █▌ █▌ █▌
2299
+ █▌ █▌ █████▌ █████▌ █▌
2300
+ -->
2301
+
2302
+ Accessibility Implications {#accessibility}
2303
+ ==========
2304
+
2305
+ It's important to remember that Anchor Positioning
2306
+ does not automatically establish any semantic relationship
2307
+ between a positioned box
2308
+ and any of its anchors,
2309
+ because it can be used in many different ways.
2310
+ Authors must not rely solely on a <em> visual</em> connection
2311
+ implied by the positioning
2312
+ to link elements together semantically;
2313
+ without additional help,
2314
+ the elements often have <em> no</em> meaningful DOM relationship,
2315
+ making them difficult or impossible to use in non-visual user agents,
2316
+ like screen readers.
2317
+
2318
+ Many features on the web platform,
2319
+ both existing and upcoming,
2320
+ allow establishing such connections explicitly,
2321
+ so that non-visual user agents can also benefit.
2322
+
2323
+ For example, the Popover API in HTML
2324
+ automatically links the invoker button
2325
+ to the popover element,
2326
+ including automatically adjusting tabbing order;
2327
+ it <em> also</em> establishes the invoker button
2328
+ as the [=implicit anchor element=] for the popover,
2329
+ making it easy to use Anchor Positioning as well.
2330
+
2331
+ In more general cases,
2332
+ ARIA features such as
2333
+ the <a href="https://w3c.github.io/aria/#aria-details"><code>aria-details</code></a>
2334
+ or <a href="https://w3c.github.io/aria/#aria-describedby"><code>aria-describedby</code></a> attributes
2335
+ on an anchor element
2336
+ can provide this information
2337
+ in a slightly more manual fashion;
2338
+ in concert with the <{html-global/role}> attribute on the positioned element,
2339
+ non-visual user agents
2340
+ can tell their users about the relationship between the elements
2341
+ and let them automatically navigate between them.
2342
+
2343
+
2344
+
2334
2345
<!-- Big Text: cssom
2335
2346
2336
2347
███▌ ███▌ ███▌ ███▌ █ █
0 commit comments