From 50294dca3cc9053491286acfbbc444abda5ab4af Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Sat, 12 Mar 2022 11:40:12 -0500 Subject: [PATCH 1/8] revise caption definition This change in the definition is related to the changes in `figure` and `figcaption` in HTML AAM: https://github.com/w3c/html-aam/pull/359 and introduces the idea that a `caption` may contain structured content - and in this PR - `aria-details` is referenced as a way authors should reference such content if within a `caption` Additionally, this PR extends the definition to allow `caption` to be used for purposes of naming/describing a `group` or `radiogroup`, which fills some gaps from the dropped `legend` role. If these updates are accepted, this would help pave the way to resolve #1696 as well. --- index.html | 46 +++++++++++++++++++++++++++++++++++++++------- 1 file changed, 39 insertions(+), 7 deletions(-) diff --git a/index.html b/index.html index f4fef22d7..56f8fa06f 100644 --- a/index.html +++ b/index.html @@ -1790,15 +1790,25 @@

Definition of Roles

caption
-

Visible content that names, and may also describe, a figure, table, grid, or treegrid.

+

Visible content that names, or describes a group, figure, table, grid, radiogroup, or treegrid.

When using caption authors SHOULD ensure:

    -
  • The caption is a direct child of a figure, table, grid, or treegrid.
    • -
  • The caption is the first child of a table, grid, or treegrid.
    • -
  • The caption is the first or last child of a figure.
    • +
  • The caption is a direct child of a group, figure, grid, radiogroup, table, or treegrid.
    • +
  • The caption is the first non-generic child of a group, radiogroup, grid, table, or treegrid.
    • +
  • The caption is the first or last non-generic child of a figure.
-

Authors SHOULD set aria-labelledby on the parent figure, table, grid, or treegrid to reference the element with role caption. However, if a caption contains content that serves as both a name and description for its parent, authors MAY instead set aria-labelledby to reference an element within the caption that contains a concise name, and set aria-describedby to reference an element within the caption that contains the descriptive content.

- +

If the caption represents an accessible name for its containing element, authors SHOULD specify aria-labelledby on the parent element to reference the element with role caption.

+ + 
+					<div role="radiogroup" aria-labelledby="name">
+				    <div role="caption">
+				      Choose your favorite fruit
+				    </div>
+				    <!-- ... -->
+
+ +

If a caption contains content that serves as both a name and description for its parent, authors MAY instead specify aria-labelledby to reference an element within the caption that represents the "name" of the parent element, and specify aria-describedby to reference an element within the caption that contains the descriptive content.

+ 
 					<div role="table" aria-labelledby="name" aria-describedby="desc">
 				    <div role="caption">
@@ -1810,6 +1820,24 @@ 
Definition of Roles

 				    </div>
 				    <!-- ... -->
+ +

If the caption represents a long-form description, or if the description contains semantic elements which are important in understanding the description, authors MAY instead specify aria-labelledby to reference an element within the caption that represents the "name" of the parent element, and specify aria-details to reference an element within the caption that contains the descriptive content.

+ + 
+					<div role="figure" aria-labelledby="name" aria-details="details">
+					  <!-- figure content here, such as a complex data viz SVG -->
+				    <div role="caption">
+				      <div id="name">Sales information for 20XX</div>
+				      <div id="details">
+				        This barchart represents the total amount of sales over the course
+								of five years. Sales information for last year can
+								be reviewed, or you can overlay 
+								information in this graphic.
+				      </div>
+				    </div>
+				    <!-- ... -->
+
+
@@ -1838,7 +1866,11 @@

Definition of Roles

- + From 40056f301c0d35b848c8dd60c38bb6174661d26e Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Sat, 12 Mar 2022 11:52:49 -0500 Subject: [PATCH 2/8] add in missing id to first example --- index.html | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/index.html b/index.html index 56f8fa06f..db753271e 100644 --- a/index.html +++ b/index.html @@ -1800,8 +1800,8 @@

Definition of Roles

If the caption represents an accessible name for its containing element, authors SHOULD specify aria-labelledby on the parent element to reference the element with role caption.

-					<div role="radiogroup" aria-labelledby="name">
-				    <div role="caption">
+					<div role="radiogroup" aria-labelledby="cap">
+				    <div role="caption" id="cap">
 				      Choose your favorite fruit
 				    </div>
 				    <!-- ... -->

From 753495c3ebf5b9f07624fe6946822e5d3e30132e Mon Sep 17 00:00:00 2001
From: Scott O'Hara 
Date: Sat, 12 Mar 2022 12:00:18 -0500
Subject: [PATCH 3/8] fix spacing issues

---
 index.html | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/index.html b/index.html
index db753271e..451460cc2 100644
--- a/index.html
+++ b/index.html
@@ -1830,9 +1830,9 @@ 
Definition of Roles

 				      <div id="name">Sales information for 20XX</div>
 				      <div id="details">
 				        This barchart represents the total amount of sales over the course
-								of five years. Sales information for last year can
-								be reviewed, or you can overlay 
-								information in this graphic.
+				        of five years. Sales information for last year can
+				        be reviewed, or you can overlay 
+				        information in this graphic.
 				      </div>
 				    </div>
 				    <!-- ... -->

From 4af5c88264aa773a2413e0739401e9c4070b66f5 Mon Sep 17 00:00:00 2001
From: Scott O'Hara 
Date: Mon, 4 Apr 2022 11:05:45 -0400
Subject: [PATCH 4/8] include additional example

---
 index.html | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/index.html b/index.html
index 451460cc2..ad525c0e7 100644
--- a/index.html
+++ b/index.html
@@ -1807,7 +1807,7 @@ 
Definition of Roles

 				    <!-- ... -->
-

If a caption contains content that serves as both a name and description for its parent, authors MAY instead specify aria-labelledby to reference an element within the caption that represents the "name" of the parent element, and specify aria-describedby to reference an element within the caption that contains the descriptive content.

+

If a caption contains content that serves as both a name and description for its parent, authors MAY instead specify aria-labelledby to reference an element within the caption that represents the "name" of the parent element, and specify aria-describedby to reference an element within the caption that represents the descriptive content.

 					<div role="table" aria-labelledby="name" aria-describedby="desc">
@@ -1838,6 +1838,20 @@ 
Definition of Roles

 				    <!-- ... -->
+

There may be instances where a caption contains only a description, without a suitable text string to serve as the accessible name for the parent element. In such instances, aria-label or aria-labelledby MAY be used to provide an accessible name, and the caption MAY be treated solely as descriptive content. + + 

+					<div role="figure" aria-label="Sales information" aria-details="details">
+					  <!-- figure content here, such as a complex data viz SVG -->
+				    <div role="caption" id="details">
+				      This barchart represents the total amount of sales over the course
+				      of five years. Sales information for last year can
+				      be reviewed, or you can overlay 
+				      information in this graphic.
+				    </div>
+				    <!-- ... -->
+
+
Characteristics:
Related Concepts:<caption> in [[HTML]]
<figcaption> in [[HTML]]		 + <caption> in [[HTML]]
+ <figcaption> in [[HTML]]
+ <legend> in [[HTML]] +
Required Context Role:
From 7a58493dbc32f74d6eb8ecb06bb5e02318915111 Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Thu, 28 Apr 2022 07:51:52 -0400 Subject: [PATCH 5/8] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index ad525c0e7..1f4a6985e 100644 --- a/index.html +++ b/index.html @@ -1830,7 +1830,7 @@

Definition of Roles

<div id="name">Sales information for 20XX</div> <div id="details"> This barchart represents the total amount of sales over the course - of five years. Sales information for last year can + of five years. <a href="...">Sales information for last year</a> can be reviewed, or you can overlay information in this graphic. </div> From cdc2951c6e820be4612752751ed384c6d89b5da8 Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Thu, 28 Apr 2022 07:52:17 -0400 Subject: [PATCH 6/8] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 1f4a6985e..ae25d89c0 100644 --- a/index.html +++ b/index.html @@ -1831,7 +1831,7 @@

Definition of Roles

<div id="details"> This barchart represents the total amount of sales over the course of five years. <a href="...">Sales information for last year</a> can - be reviewed, or you can overlay + be reviewed, or you can overlay <button aria-pressed="false">previous year</button> information in this graphic. </div> </div> From b1e44e3acaa02b044ac25389c54401494d86de9a Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Thu, 28 Apr 2022 07:52:25 -0400 Subject: [PATCH 7/8] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index ae25d89c0..3497ba2d1 100644 --- a/index.html +++ b/index.html @@ -1846,7 +1846,7 @@

Definition of Roles

<div role="caption" id="details"> This barchart represents the total amount of sales over the course of five years. Sales information for last year can - be reviewed, or you can overlay + be reviewed, or you can overlay <button aria-pressed="false">previous year</button> information in this graphic. </div> <!-- ... --> From f5705372fde7a8d014b44d7363904d605477a53d Mon Sep 17 00:00:00 2001 From: Scott O'Hara Date: Thu, 28 Apr 2022 07:52:34 -0400 Subject: [PATCH 8/8] Update index.html --- index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/index.html b/index.html index 3497ba2d1..154e42149 100644 --- a/index.html +++ b/index.html @@ -1845,7 +1845,7 @@

Definition of Roles

<!-- figure content here, such as a complex data viz SVG --> <div role="caption" id="details"> This barchart represents the total amount of sales over the course - of five years. Sales information for last year can + of five years. <a href="...">Sales information for last year</a> can be reviewed, or you can overlay <button aria-pressed="false">previous year</button> information in this graphic. </div>
Characteristics: