Update ARIA11 (#1023)

Fixes #919 

Also:
* Update and addition of links
* Remove `role=application` (no landmark region)
* Adding `role=region`
* Adding the test for meaningful labeling

---------

Co-authored-by: JAWS-test2 <>
Co-authored-by: Kenneth G. Franqueiro <[email protected]>
Co-authored-by: Scott O'Hara <[email protected]>
Co-authored-by: Patrick H. Lauke <[email protected]>
Co-authored-by: Mike Gower <[email protected]>
Co-authored-by: Mike Gower <[email protected]>

Author: 5 people

techniques/aria/ARIA11.html

@@ -20,19 +20,19 @@ <h1>Using ARIA landmarks to identify regions of a page</h1>
 </p>
       <p>Landmarks also can help sighted keyboard-only users navigate to sections of a page using a <a href="https://www.tpgi.com/improving-access-to-landmark-navigation/">browser plugin</a>. 
 </p>
-      <p>Landmarks are inserted into the page using the role attribute on an element that marks the section. The value of the attribute is the name of the landmark. These role values are listed below. For HTML mappings of landmark roles, refer to the <cite>Rules of ARIA attribute usage by HTML element</cite> table in the <a href="https://www.w3.org/TR/html-aria/">ARIA In HTML recommendation</a>.</p>
+      <p>Landmarks are inserted into the page using the role attribute on an element that marks the section. The value of the attribute designates the type of landmark. These role values are listed below. For HTML mappings of landmark roles, refer to the <cite>Rules of ARIA attribute usage by HTML element</cite> table in the <a href="https://www.w3.org/TR/html-aria/">ARIA In HTML recommendation</a>.</p>
       <ul>
-         <li><code class="language-html">banner</code>: A region that contains the prime heading or internal title of a page.</li>
-         <li><code class="language-html">navigation</code>: A region that contains navigation links links to other pages or different parts of the same page.</li>
+         <li><code class="language-html">banner</code>: A region that contains mostly site-oriented content, such as the logo or a site-specific search tool.</li>
+         <li><code class="language-html">navigation</code>: A region that contains navigation links to other pages or different parts of the same page.</li>
          <li><code class="language-html">main</code>: A region that contains a page's main content.</li>
-         <li><code class="language-html">region</code>: A region that contains a perceivable section of the page containing content that is sufficiently important for users to be able to navigate to the section. A <code class="language-html">region</code> landmark isn't exposed as a landmark region unless it has an accessible name.</li>
-         <li><code class="language-html">form</code>: A region of the document that represents a collection of form-associated elements, some of which can represent editable values that can be submitted to a server for processing.</li>
+         <li><code class="language-html">region</code>: A region that contains a perceivable section of the page containing content that is sufficiently important for users to be able to navigate to the section. A <code class="language-html">region</code> landmark isn't exposed as a landmark region unless it has an accessible name, often provided using <code class="language-html">aria-label</code> or <code class="language-html">aria-labelledby</code>.</li>
+         <li><code class="language-html">form</code>: A region of the document that represents a collection of form-associated elements, some of which can represent editable values that can be submitted to a server for processing. A <code class="language-html">form</code> landmark isn't exposed as a landmark region unless it has an accessible name.</li></li>
          <li><code class="language-html">search</code>: A region of the page containing search functionality.</li>
          <li><code class="language-html">complementary</code>: Any section of the document that supports the main content, yet is separate and meaningful on its own.</li>
          <li><code class="language-html">contentinfo</code>: A region that contains information about the parent document such as copyrights and links to privacy statements.</li>
       </ul>
 
-      <p>There are cases when a particular landmark role could be used more than once on a page, such as on primary and secondary blocks of navigation. In these cases, identical roles should be labeled using a valid technique for labelling regions.</p>
+      <p>There are cases when a particular landmark role could be used more than once on a page, such as on primary and secondary blocks of navigation. In these cases, identical roles should be named using a valid technique for labeling regions.</p>
 
       <p>Landmarks should supplement native semantic markup such as HTML headings, lists and other structural markup. Landmarks are interpretable by WAI-ARIA-aware assistive technologies and are not exposed by browsers directly to users.</p>
 
@@ -112,12 +112,13 @@ <h3>Procedure</h3>
             <li>Examine each element with a <a href="https://www.w3.org/TR/wai-aria/#landmark_roles">landmark role</a>.</li>
             <li>Examine whether the correct element has been used to mark up content. For example: a <code class="language-html">navigation</code> role has been used to mark up a section with navigation links, or the <code class="language-html">main</code> role is used to contain the page's main content.</li>
             <li>If a landmark region needs to have an accessible name to be exposed as a landmark, check to see that there is an accessible name.</li>
+            <li>If the same type of landmark appears multiple times on the page, check that each one is given a unique and meaningful accessible name.</li>
          </ol>
       </section>
       <section class="results" id="expected-test-results">
          <h3>Expected Results</h3>
          <ul>
-            <li>#1, #2, and #3 are true.</li>
+            <li>#1, #2, #3, and #4 are true.</li>
          </ul>
       </section>
    </section>
@@ -126,6 +127,8 @@ <h2>Related Techniques</h2>
       <ul>
          <li><a href="../general/G1">G1</a></li>
          <li><a href="../general/G124">G124</a></li>
+         <li><a href="ARIA13">ARIA13</a></li>
+         <li><a href="ARIA20">ARIA20</a></li>
          <li><a href="../html/H69">H69</a></li>
          <li><a href="../html/H100">H100</a></li>
          <li><a href="../client-side-script/SCR28">SCR28</a></li>
@@ -134,13 +137,13 @@ <h2>Related Techniques</h2>
    <section id="resources"><h2>Resources</h2>   
       <ul>
          <li>
-            <a href="https://www.w3.org/TR/wai-aria-practices/">WAI-ARIA Authoring Practices</a> 
+            <a href="https://www.w3.org/WAI/ARIA/apg/practices/landmark-regions/">WAI-ARIA Authoring Practices, Landmark Regions</a> 
          </li>
          <li>
-            <a href="https://www.w3.org/TR/wai-aria/#usage_intro">Accessible Rich Internet Applications (WAI-ARIA), Using WAI-ARIA Roles</a>
+            <a href="https://www.w3.org/WAI/tutorials/page-structure/regions/">W3C Web Accessibility Tutorials, Page Regions</a>
          </li>
          <li>
-            <a href="https://www.w3.org/TR/wai-aria/#states_and_properties">Accessible Rich Internet Applications (WAI-ARIA), Supported States and Properties</a>
+            <a href="https://www.w3.org/TR/wai-aria/#landmark_roles">Accessible Rich Internet Applications (WAI-ARIA), Landmark Roles</a>
          </li>
          <li>
             <a href="https://www.tpgi.com/improving-access-to-landmark-navigation/">Improving access to landmark navigation</a>