Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

contextual role concept proposal #484

Closed
wants to merge 17 commits into from
Closed
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
65 changes: 65 additions & 0 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -210,6 +210,71 @@ <h3>Exposing HTML Features That Do Not Directly Map to Accessibility APIs</h3>
<abbr title="application programming interface">API</abbr> properties</a> in the [[core-aam-1.2]].
</p>
</section>
<section id="mapping_contextual">
<h3>Exposing HTML Features With Contextual Roles</h3>
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This heading may not accurately capture the intent of the section; particularly, the words "HTML Features" used to describe contextual roles and how they're treated. I don't know the best way to describe the new section but if you agree, some alternatives for your consideration: Contextual Roles, Treatment of Contextual Roles, Understanding Contextual Roles, Understanding Contextual Roles and Accessibility Ancestry

<p>
An element with a <STRONG>contextual role</STRONG> is one whose implicit WAI-ARIA role semantics are based on its ancestral <a>accessibility tree</a> relationship to
another element or elements. Or, an element whose computed role is reliant on whether the element has been provided an accessible name.
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
</p>
<p>
For instance, an element that is an <STRONG>accessibility child</STRONG> of its required <STRONG>accessibility parent</STRONG> would expose a computed role that was
appropriate for its related context. Where the same element with a contextual role might be used within another markup pattern and have a different accessibility parent,
and would therefore expose a computed role appropriate for that context.
Copy link
Collaborator

@cookiecrook cookiecrook May 17, 2023

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Word-smithing plus a few simple inline examples.

Suggested change
For instance, an element that is an <STRONG>accessibility child</STRONG> of its required <STRONG>accessibility parent</STRONG> would expose a computed role that was
appropriate for its related context. Where the same element with a contextual role might be used within another markup pattern and have a different accessibility parent,
and would therefore expose a computed role appropriate for that context.
For instance, an element that is an <STRONG>accessibility child</STRONG> of its required <STRONG>accessibility parent</STRONG> would expose a computed role for its given context, such as a list item (<code>li</code>) within an unordered list (<code>ul</code>). However, the same element might be used within a different markup pattern and could therefore expose different contextually-dependent computed roles, such as a labeled <code>section</code> element (role <code>region</code>) versus an unlabeled <code>section</code> element (role <code>generic</code>).

Can we think of a specific example that works for both? If so that'd be better than the sectioning content examples, which are less easy to understand and care about than a simple list.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@cookiecrook I like these suggestions so i'm going to largely pull them in - but I'm going to be changing the use of "accessible label" back to "name".

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@cookiecrook re: other examples.

What do you think about mentioning tbody here, per the whole rowgroup conversation? That'd be an example of a contextual role where it can be ignored until it is given a name or focusable.

Another example we could use in lieu of / in combination with the list item example is the summary of a details, where only under specific conditions is the summary an html-summary, and otherwise it would need to be a role=generic

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🤷 I could go either way. I don't think most authors give much thought to <tbody> etc, so I'm not sure it'd be super helpful as an example, but I also don't think it'd be harmful.

</p>
<p>
When the conditions for an element's contextual role are not met, it will commonly expose a computed role of `generic` or with a <STRONG>minimum role</STRONG>, if applicable.
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
</p>
<div class="note">
<p>Previously, the concept of a contextual role was loosely referred to as an element's "scoped" relationship to another element.</p>
</div>
<div class="example">
<p>
A <code>li</code> element has an implicit WAI-ARIA role mapping of <code>listitem</code> only when the element is an <STRONG>accessibility child</STRONG> of a
<code>menu</code>, <code>ol</code> or <code>ul</code> element that has not had its `list` role mapping suppressed.
</p>
<pre><code>&lt;ul>
&lt;li>...&lt;/li> &lt;!-- role=listitem -->
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
&lt;/ul>
&lt;article>
...
&lt;li>...&lt;/li> &lt;!-- not role=listitem -->
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
...</code></pre>
</div>
<div class="example">
<p>
An <code>aside</code> element has an implicit WAI-ARIA role mapping of <code>complementary</code> only when the element is an <STRONG>accessibility child</STRONG> of
the <code>body</code> or <code>main</code> elements, or if the <code>aside</code> has been provided an accessible name.
</p>
<pre><code>&lt;body>
...
&lt;main>
...
&lt;article>
&lt;aside>...&lt;/aside> &lt;!-- not role=complementary -->
...
&lt;aside aria-label=named>...&lt;/aside> &lt;!-- role=complementary -->
&lt;/article>
...
&lt;aside>...&lt;/aside> &lt;!-- role=complementary -->
&lt;/main>
&lt;aside>...&lt;/aside> &lt;!-- role=complementary -->
...
&lt;footer>
...
&lt;aside>...&lt;/aside> &lt;!-- not role=complementary -->
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
&lt;/footer></code></pre>
</div>

<div class="example">
<p>A <code>section</code> element has an implicit WAI-ARIA role mapping of <code>region</code> only when the element is provided an <STRONG>accessible name</STRONG>.</p>

<pre><code>&lt;section title="accessible name">...&lt;/section> &lt;!-- role=region -->
...
&lt;section aria-label="accessible name">...&lt;/section> &lt;!-- role=region -->
...
&lt;section>...&lt;/section> &lt;!-- not role=region --></code></pre>
scottaohara marked this conversation as resolved.
Show resolved Hide resolved
</div>
</section>
<section>
<h3>HTML Element Role Mappings</h3>
<ul>
Expand Down