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

Fix mentions to HTML to Platform Accessibility APIs Implementation Guide #3995

Merged
merged 2 commits into from
Sep 13, 2024
Merged
Show file tree
Hide file tree
Changes from all 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
3 changes: 0 additions & 3 deletions techniques/aria/ARIA5.html
Original file line number Diff line number Diff line change
Expand Up @@ -85,9 +85,6 @@ <h3>A slider</h3>
<li>
<a href="https://www.w3.org/TR/wai-aria/#states_and_properties">Accessible Rich Internet Applications (WAI-ARIA), Supported States and Properties</a>
</li>
<li>
patrickhlauke marked this conversation as resolved.
Show resolved Hide resolved
<a href="https://www.w3.org/TR/html-aapi/#html-element-to-accessibility-api-role-mapping-matrix">HTML to Platform Accessibility APIs Implementation Guide: HTML Element to Accessibility API Role Mapping Matrix</a>
</li>
<li>
<a href="https://www.w3.org/WAI/ARIA/apg/">WAI-ARIA Authoring Practices Guide</a>
</li>
Expand Down
2 changes: 1 addition & 1 deletion techniques/aria/ARIA6.html
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,7 @@ <h3>Providing a label for Math</h3>

<ul>
<li>
<a href="https://www.w3.org/TR/html-aapi/#html-element-to-accessibility-api-role-mapping-matrix">HTML to Platform Accessibility APIs Implementation Guide: HTML Element to Accessibility API Role Mapping Matrix</a>
<a href="https://www.w3.org/TR/html-aam-1.0/">HTML Accessibility API Mappings 1.0</a>
</li>
<li>
<a href="https://www.w3.org/WAI/ARIA/apg/">WAI-ARIA Authoring Practices Guide</a>
Expand Down
2 changes: 1 addition & 1 deletion techniques/aria/ARIA8.html
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
<p>Technologies that support <a href="https://www.w3.org/TR/wai-aria/">Accessible Rich Internet Applications (WAI-ARIA)</a>. </p>
</section><section id="description"><h2>Description</h2>
<p>The objective of this technique is to describe the purpose of a link using the <code class="language-html">aria-label</code> attribute. The <code class="language-html">aria-label</code> attribute provides a way to place a descriptive text label on an object, such as a link, when there are no elements visible on the page that describe the object. If descriptive elements are visible on the page, the <code class="language-html">aria-labelledby</code> attribute should be used instead of <code class="language-html">aria-label</code>. Providing a descriptive text label lets a user distinguish the link from links in the Web page that lead to other destinations and helps the user determine whether to follow the link. In some assistive technologies the <code class="language-html">aria-label</code> value will show in the list of links instead of the actual link text.</p>
<p>Per the <a href="https://www.w3.org/TR/accname/">Accessible Name and Description Computation</a> and the <a href="https://www.w3.org/TR/html-aapi/#accessible-name-and-description-calculation">HTML to Platform Accessibility APIs Implementation Guide</a>, the <code class="language-html">aria-label</code> text will override the text supplied within the link. As such the text supplied will be used instead of the link text by assistive technology. Due to this it is recommended to start the text used in <code class="language-html">aria-label</code> with the text used within the link. This will allow consistent communication between users.</p>
<p>Per the <a href="https://www.w3.org/TR/accname/">Accessible Name and Description Computation</a> and the <a href="https://www.w3.org/TR/html-aam-1.0/#accessible-name-and-description-computation">Accessible Name and Description Computation</a> in the HTML Accessibility API Mappings 1.0, the <code class="language-html">aria-label</code> text will override the text supplied within the link. As such the text supplied will be used instead of the link text by assistive technology. Due to this it is recommended to start the text used in <code class="language-html">aria-label</code> with the text used within the link. This will allow consistent communication between users.</p>
</section><section id="examples"><h2>Examples</h2>
<section class="example">
<h3>Describing the purpose of a link in HTML using aria-label.</h3>
Expand Down
4 changes: 2 additions & 2 deletions techniques/aria/ARIA9.html
Original file line number Diff line number Diff line change
Expand Up @@ -7,14 +7,14 @@
<p>The concatenation of strings can be useful for different reasons. In example 1, an input is nested within the context of a full sentence. The desired screen reader output is "Extend time-out to [ 20 ] minutes - edit with autocomplete, selected 20". Since the <code class="language-html">id</code> of the text input is included in the string of <code class="language-html">id</code>s referenced by aria-labelledby, the value of the input is included in the concatenated name at the right position.</p>
<p>Another application of <code class="language-html">aria-labelledby</code> is when there is no space to provide a visible label next to the input, or when using native labels would create unnecessary redundancy. Here, the use <code class="language-html">aria-labelledby</code> makes it possible to associate visible elements on the page as name for such inputs. This is demonstrated in example 2 where table column and row headings are concatenated into names for the text input elements inside the table.</p>
<div class="note">
<p>The <a href="https://www.w3.org/TR/html-aapi/#accessible-name-and-description-calculation">ARIA accessible name and description calculation</a> specifies that the string specified in <code class="language-html">aria-labelledby</code> should replace rather than add to the content of the element that carries the property. So adding the <code class="language-html">aria-labelledby</code> property to a native label should replace the text content inside that label unless the label itself is referenced as part of the sequence of <code class="language-html">id</code>s in <code class="language-html">aria-labelledby</code>.</p>
<p>The <a href="https://www.w3.org/TR/html-aam-1.0/#accessible-name-and-description-computation">Accessible Name and Description Computation</a> specifies that the string specified in <code class="language-html">aria-labelledby</code> should replace rather than add to the content of the element that carries the property. So adding the <code class="language-html">aria-labelledby</code> property to a native label should replace the text content inside that label unless the label itself is referenced as part of the sequence of <code class="language-html">id</code>s in <code class="language-html">aria-labelledby</code>.</p>
</div>
</section><section id="examples"><h2>Examples</h2>
<section class="example">
<h3>A time-out input field with concatenated name</h3>

<p>A text input allows users to extend the default time before a time-out occurs.</p>
<p>The string "Extend time-out to" is contained in a native <code class="language-html">label</code> element and is associated with the input with the input by id="timeout-duration" . This label is associated with this input using the for/id association only on user agents that don't support ARIA. On user agents that support ARIA, the for/id association is ignored and the name for the input is provided only by <code class="language-html">aria-labelledby</code>, per the <a href="https://www.w3.org/TR/html-aapi/#accessible-name-and-description-calculation">accessible name and description calculation</a> in the HTML to Platform Accessibility APIs Implementation Guide.</p>
<p>The string "Extend time-out to" is contained in a native <code class="language-html">label</code> element and is associated with the input with the input by id="timeout-duration" . This label is associated with this input using the for/id association only on user agents that don't support ARIA. On user agents that support ARIA, the for/id association is ignored and the name for the input is provided only by <code class="language-html">aria-labelledby</code>, per the <a href="https://www.w3.org/TR/html-aam-1.0/#accessible-name-and-description-computation">Accessible Name and Description Computation</a> in the HTML Accessibility API Mappings 1.0.</p>
<p>The <code class="language-html">aria-labelledby</code> attribute on the text input references three elements: (1) the <code class="language-html">span</code> containing the native label, (2) the text input containing the default text '20' (recall that this input is not labelled with the for/id associated label text), and (3) the string 'minutes' contained in a <code class="language-html">span</code>. These elements should be concatenated to provide the full name for the text input</p>
<pre xml:space="preserve"><code class="language-html">&lt;div&gt;
&lt;span id="timeout-label"&gt;
Expand Down
3 changes: 0 additions & 3 deletions techniques/failures/F65.html
Original file line number Diff line number Diff line change
Expand Up @@ -36,9 +36,6 @@ <h3>Missing text alternative</h3>
</ul></section><section id="resources"><h2>Resources</h2>

<ul>
<li>
<a href="https://www.w3.org/TR/html-aapi/#accessible-name-and-description-calculation">HTML to Platform Accessibility APIs Implementation Guide: Accessible Name and Description Calculation</a>
</li>
<li>
<a href="https://www.w3.org/TR/accname/">Accessible Name and Description Computation</a>
</li>
Expand Down