chore: Update branch with latest update/skipto changes and submodule updates

Author: w3cgruntbot

ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/combobox/examples/combobox-autocomplete-list/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/118'>View issues related to this example</a></p>        <p>Page last updated: 29 April 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/118'>View issues related to this example</a></p>        <p>Page last updated: 22 October 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -210,7 +210,7 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
                 Note: Because transparent borders are visible on some systems with operating system high contrast settings enabled, transparency cannot be used to create a visual difference between the element that is focused and other elements.
                 Instead of using transparency, the focused element has a thicker border and less padding.
                 When an element receives focus, its border changes from zero to two pixels and padding is reduced by two pixels.
-                When an element loses focus, its border changes from two pixels to zero and padding is increased by two pixels.
+                When an element loses focus, its border changes from two pixels to two and padding is increased by two pixels.
               </li>
             </ul>
           </li>

ARIA/apg/patterns/disclosure/examples/disclosure-faq.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/disclosure/examples/disclosure-faq/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/132'>View issues related to this example</a></p>        <p>Page last updated: 10 June 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/132'>View issues related to this example</a></p>        <p>Page last updated: 22 October 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -117,38 +117,46 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         <div role="separator" id="ex_start_sep" aria-labelledby="ex_start_sep ex_label" aria-label="Start of"></div>
         <div id="ex1">
           <h3>Parking <abbr title="Frequently Asked Questions">FAQ</abbr>s</h3>
-          <ul class="faq">
-            <li>
+          <dl class="faq">
+            <dt>
               <button type="button" aria-expanded="false" aria-controls="faq1_desc">What do I do if I have a permit for an assigned lot, but can't find a space there?</button>
+            </dt>
+            <dd>
               <div id="faq1_desc" class="desc">
                 Park at the nearest available parking meter without paying the meter and call 999-999-9999 to report the problem.
                 We will note and approve your alternate location and will investigate the cause of the shortage in your assigned facility.
               </div>
-            </li>
-            <li>
+            </dd>
+            <dt>
               <button type="button" aria-expanded="false" aria-controls="faq2_desc">What do I do if I lose my permit or if my permit is stolen?</button>
+            </dt>
+            <dd>
               <div id="faq2_desc" class="desc">
                 You should come to the Parking office and report the loss.
                 There is a fee to replace your lost permit.
                 However, if your permit was stolen, a copy of a police report needs to be submitted along with a stolen parking permit form for a fee replacement exemption.
               </div>
-            </li>
-            <li>
+            </dd>
+            <dt>
               <button type="button" aria-expanded="false" aria-controls="faq3_desc">Is there free parking on holidays?</button>
+            </dt>
+            <dd>
               <div id="faq3_desc" class="desc">
                 All facilities are restricted from 2:00 am - 6:00 am on all days.
                 No exceptions are made for any holiday or recess except those officially listed as a <q>Holidays</q> in the calendar.
                 Please note: 24-hour rental spaces, 24-hour rental lots, and disabled parking is enforced at all times.
               </div>
-            </li>
-            <li>
+            </dd>
+            <dt>
               <button type="button" aria-expanded="false" aria-controls="faq4_desc">Do all parking facilities have the same enforcement rules?</button>
+            </dt>
+            <dd>
               <div id="faq4_desc" class="desc">
                 Some parking facility restrictions differ from others.
                 Be sure to take note of the signs at each lot entrance.
               </div>
-            </li>
-          </ul>
+            </dd>
+          </dl>
         </div>
         <div role="separator" id="ex_end_sep" aria-labelledby="ex_end_sep ex_label" aria-label="End of"></div>
       </section>
@@ -157,8 +165,10 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         <h2>Accessibility Features</h2>
         <ul>
           <li>
-            The semantic structure of the FAQ list is conveyed with native <code>ul</code> and <code> li</code> elements.
-            To ensure the list structure is communicated to assistive technologies, a <code>button</code> element containing the question and a <code>div</code> element containing answer are children of an <code>li</code> element.  NOTE: The <code>button</code> actions are used to hide and show the <code>div</code> element with the answer.
+            The semantic structure of the FAQ is conveyed with native <code>dl</code>, <code>dt</code> and <code>dd</code> elements.
+            To ensure the list structure is communicated to assistive technologies, instead of applying a button role to the <code>dt</code> element, a <code>button</code> element is contained within the <code>dt</code> element.
+            Similarly, each <code>div</code> element containing answer content that can be shown or hidden by the button is a child of a <code>dd</code> element.
+            Since all the <code>dd</code> elements are present in the DOM even if some answers are hidden, the <code>dl</code> structure is always complete.
           </li>
           <li>To help people with visual impairments identify the disclosure as interactive and make it easier to perceive that clicking either the disclosure button or its label changes the expanded state, when a pointer hovers over the button or its label, the background color changes, a border appears, and the cursor changes to a pointer.</li>
           <li>

ARIA/apg/patterns/disclosure/examples/disclosure-image-description.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/disclosure/examples/disclosure-image-description/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/132'>View issues related to this example</a></p>        <p>Page last updated: 10 June 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/132'>View issues related to this example</a></p>        <p>Page last updated: 22 October 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG

ARIA/apg/patterns/landmarks/examples/search.html

@@ -65,30 +65,11 @@ <h2>Design Patterns</h2>
               </ul>
               <div class="tab-content">
                 <div id="tabpanel2" aria-labelledby="tab2" role="tabpanel" class="tab-pane active">
-                  <p>Use the HTML <code>search</code> element to define a <code>search</code> landmark.</p>
-                  <h3>HTML Example</h3>
-                  <br>
-                  <search>
-                    <input type="search" size="20" aria-label="search text"><input type="submit" value="Search">
-                  </search>
-                  <br>
-                  <div class="code">
-                    <strong>&lt;search&gt;</strong>
-                    <br>
-                    <br>
-                    &nbsp;&nbsp;&lt;input type="search" aria-label="search text" size="20"&gt;
-                    <br>
-                    <br>
-                    &nbsp;&nbsp;&lt;input type="submit" value="Search"&gt;
-                    <br>
-                    <br>
-                    <strong>&lt;/search&gt;</strong>
-                    <br>
-                  </div>
+                  <p>There is no HTML element that defines a <code>search</code> landmark, see the ARIA techniques for defining a <code>search</code> landmark.</p>
                 </div>
                 <div id="tabpanel1" aria-labelledby="tab1" role="tabpanel" class="tab-pane">
                   <p>A <code>role="search"</code> attribute is used to define a <code>search</code> landmark.</p>
-                  <h3>ARIA Example</h3>
+                   <h3>ARIA Example</h3>
 
                   <form role="search">
 
@@ -109,7 +90,7 @@ <h3>ARIA Example</h3>
                     &lt;/form&gt;
                     <br>
                   </div>
-                </div>
+               </div>
               </div>
             </section>
           </main>

ARIA/apg/patterns/slider-multithumb/examples/slider-multithumb.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/slider-multithumb/examples/slider-multithumb/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/124'>View issues related to this example</a></p>        <p>Page last updated: 12 February 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/124'>View issues related to this example</a></p>        <p>Page last updated: 12 December 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG

ARIA/apg/patterns/slider/examples/slider-temperature.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/slider/examples/slider-temperature/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/124'>View issues related to this example</a></p>        <p>Page last updated: 3 June 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/124'>View issues related to this example</a></p>        <p>Page last updated: 22 October 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -125,9 +125,9 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
             <div id="id-temp-label" class="label">Temperature</div>
 
             <svg role="none" class="slider-group" width="145" height="360">
+              <text class="temp-value" x="28" y="35">25°C</text>
+              <rect class="rail" x="60" y="47" width="8" height="300" rx="5" aria-hidden="true" ></rect>
               <g role="slider" id="id-temp-slider" aria-orientation="vertical" tabindex="0" aria-valuemin="10.0" aria-valuenow="25.0" aria-valuetext="25.0 degrees Celsius" aria-valuemax="38.0" aria-labelledby="id-temp-label">
-                <text class="temp-value" x="28" y="35">25°C</text>
-                <rect class="rail" x="60" y="47" width="8" height="300" rx="5" aria-hidden="true" ></rect>
                 <text class="value" x="94" y="150">25°C</text>
                 <rect class="focus-ring" x="35" y="170" width="105" height="24" rx="12" ></rect>
                 <rect class="thumb" x="35" y="145" width="48" height="14" rx="5" ></rect>

ARIA/apg/patterns/treegrid/examples/treegrid-1.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/treegrid/examples/treegrid-1/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/117'>View issues related to this example</a></p>        <p>Page last updated: 18 March 2025</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/orgs/w3c/projects/117'>View issues related to this example</a></p>        <p>Page last updated: 22 October 2024</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG

ARIA/apg/practices/grid-and-table-properties/grid-and-table-properties-practice.md

@@ -158,7 +158,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
   aria-rowcount tells assistive technologies the actual size of the grid
   is 463 rows even though only 4 rows are present in the markup.
 -->
-<table role="grid" aria-rowcount="463" aria-label="Student roster for history 101">
+<table role="grid" aria-rowcount="463">
+  aria-label="Student roster for history 101"
   <thead>
     <tr aria-rowindex="1">
       <th>Last Name</th>
@@ -279,8 +280,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
             In this example, the first two columns with the student name are shown, but the score columns have been scrolled to show columns 10 through 13.
             Columns 3 through 9 are not visible so are not in the DOM.
           </p>
-          <pre><code>&lt;table role=&quot;grid&quot; aria-rowcount=&quot;463&quot; aria-colcount=&quot;13&quot;
-  aria-label=&quot;Student grades for history 101&quot;&gt;
+          <pre><code>&lt;table role=&quot;grid&quot; aria-rowcount=&quot;463&quot; aria-colcount=&quot;13&quot;&gt;
+  aria-label=&quot;Student grades for history 101&quot;
   &lt;!--
     aria-rowcount and aria-colcount tell assistive technologies
     the actual size of the grid is 463 rows by 13 columns,

ARIA/apg/practices/landmark-regions/landmark-regions-practice.md

@@ -72,45 +72,58 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
       <section>
         <h2>HTML Sectioning Elements</h2>
-        <p> The following HTML sectioning elements create ARIA landmark regions.</p>
+        <p>
+          Several HTML sectioning elements automatically create ARIA landmark regions.
+          So, in order to provide assistive technology users with a logical view of a page, it is important to understand the effects of using HTML sectioning elements.
+          [[HTML-ARIA]] contains more information on HTML element role mapping.
+        </p>
         <div class="table-wrap"><table class="widget-features">
           <caption>
-            Landmark roles generated by HTML sectioning elements
+            Default landmark roles for HTML sectioning elements
           </caption>
           <thead>
             <tr>
               <th>HTML Element</th>
-              <th>Implied Landmark Role</th>
+
+              <th>Default Landmark Role</th>
             </tr>
           </thead>
+
           <tbody>
             <tr>
               <td><code>aside</code></td>
+
               <td><code>complementary</code></td>
             </tr>
+
             <tr>
-              <td><code>footer</code> if it is in the context of a <code>body</code> element</td>
-              <td><code>contentinfo</code></td>
+              <td><code>footer</code></td>
+
+              <td><code>contentinfo</code> when in context of the <code>body</code> element</td>
             </tr>
+
             <tr>
-              <td><code>header</code> if it is in the context of a <code>body</code> element</td>
-              <td><code>banner</code></td>
+              <td><code>header</code></td>
+
+              <td><code>banner</code> when in context of the <code>body</code> element</td>
             </tr>
+
             <tr>
               <td><code>main</code></td>
+
               <td><code>main</code></td>
             </tr>
+
             <tr>
               <td><code>nav</code></td>
+
               <td><code>navigation</code></td>
             </tr>
+
             <tr>
-              <td><code>section</code> if it has an accessible name provided by <code>aria-labelledby</code> or <code>aria-label</code></td>
-              <td><code>region</code></td>
-            </tr>
-            <tr>
-              <td><code>search</code></td>
-              <td><code>search</code></td>
+              <td><code>section</code></td>
+
+              <td><code>region</code> when it has an accessible name using <code>aria-labelledby</code> or <code>aria-label</code></td>
             </tr>
           </tbody>
         </table></div>
@@ -411,7 +424,7 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
             <li>If a page includes more than one <code>region</code> landmark, each should have a unique label (see <a href="#aria_lh_step3">Step 3</a> above).</li>
 
-            <li>The <code>region</code> landmark can be used to identify content that named landmarks do not appropriately describe.</li>
+            <li>The <code>region</code> landmark can be used identify content that named landmarks do not appropriately describe.</li>
           </ul>
 
           <section>
@@ -444,12 +457,11 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
           <section>
             <h4>HTML Technique</h4>
-
-            <p>Use the HTML <code>search</code> element to define a <code>search</code> landmark.</p>
+            <p>There is no HTML element that defines a <code>search</code> landmark.</p>
 
             <h4>ARIA Technique</h4>
 
-            <p>If the HTML <code>search</code> element technique is not being used, use a <code>role=&quot;search&quot;</code> attribute to define a <code>search</code> landmark.</p>
+            <p>The <code>role=&quot;search&quot;</code> attribute defines a <code>search</code> landmark.</p>
           </section>
 
           <section>