For publication / deploy on Tuesday August 1, 2023

ARIA/apg/patterns/accordion/examples/accordion.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/accordion/examples/accordion/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/8'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/8'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -67,10 +67,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/alert/examples/alert.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/alert/examples/alert/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/20'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/20'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -71,10 +71,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>
@@ -193,6 +191,16 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         </table></div>
       </section>
 
+      <section id="at-support">
+        <h2>Assistive Technology Support</h2>
+        <iframe class="support-levels-alert"
+          src="https://aria-at.w3.org/embed/reports/alert"
+          height="100"
+          allow="clipboard-write"
+          style="border-style: none; width: 100%;">
+        </iframe>
+      </section>
+
       <section>
         <h2>JavaScript and CSS Source Code</h2>
         <ul id="css_js_files">
@@ -217,16 +225,7 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
           sourceCode.make();
         </script>
       </section>
-
-      <section id="at-support">
-        <h2>Assistive Technology Support</h2>
-        <iframe class="support-levels-alert"
-          src="https://aria-at.w3.org/embed/reports/alert"
-          height="100"
-          allow="clipboard-write"
-          style="border-style: none; width: 100%;">
-        </iframe>
-      </section>
+
 
     </div>
 

ARIA/apg/patterns/alertdialog/examples/alertdialog.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/alertdialog/examples/alertdialog/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/20'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/20'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -69,10 +69,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/breadcrumb/examples/breadcrumb.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/breadcrumb/examples/breadcrumb/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/21'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/21'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -67,10 +67,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/button/examples/button.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/button/examples/button/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/14'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/14'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>
@@ -241,6 +239,25 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         </table></div>
       </section>
 
+      <section id="at-support">
+        <h2>Assistive Technology Support</h2>
+        <h3>Command Button</h3>
+        <iframe class="support-levels-command-button"
+          src="https://aria-at.w3.org/embed/reports/command-button"
+          height="100"
+          allow="clipboard-write"
+          style="border-style: none; width: 100%;">
+        </iframe>
+
+        <h3>Toggle Button</h3>
+        <iframe class="support-levels-toggle-button"
+          src="https://aria-at.w3.org/embed/reports/toggle-button"
+          height="100"
+          allow="clipboard-write"
+          style="border-style: none; width: 100%;">
+        </iframe>
+      </section>
+
       <section>
         <h2>JavaScript and CSS Source Code</h2>
 
@@ -267,24 +284,6 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
         </script>
       </section>
 
-      <section id="at-support">
-        <h2>Assistive Technology Support</h2>
-        <h3>Command Button</h3>
-        <iframe class="support-levels-command-button"
-          src="https://aria-at.w3.org/embed/reports/command-button"
-          height="100"
-          allow="clipboard-write"
-          style="border-style: none; width: 100%;">
-        </iframe>
-
-        <h3>Toggle Button</h3>
-        <iframe class="support-levels-toggle-button"
-          src="https://aria-at.w3.org/embed/reports/toggle-button"
-          height="100"
-          allow="clipboard-write"
-          style="border-style: none; width: 100%;">
-        </iframe>
-      </section>
     </div>
 
 </div>

ARIA/apg/patterns/button/examples/button_idl.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/button/examples/button_idl/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/14'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/14'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/carousel/examples/carousel-1-prev-next.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/carousel/examples/carousel-1-prev-next/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/10'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/10'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -70,10 +70,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/carousel/examples/carousel-2-tablist.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/carousel/examples/carousel-2-tablist/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/10'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/10'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/checkbox/examples/checkbox-mixed.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/checkbox/examples/checkbox-mixed/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/9'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/9'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/checkbox/examples/checkbox.md

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/checkbox/examples/checkbox/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/9'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/9'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

ARIA/apg/patterns/combobox/combobox-pattern.md

@@ -63,17 +63,20 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
       <section id="about">
         <h2>About This Pattern</h2>
         <p>
-          A <a href="https://w3c.github.io/aria/#combobox" class="role-reference">combobox</a> is an input widget with an associated popup that enables users to select a value for the combobox from a collection of possible values.
-          In some implementations, the popup presents allowed values, while in other implementations, the popup presents suggested values, and users may either select one of the suggestions or type a value.
+          A <a href="https://w3c.github.io/aria/#combobox" class="role-reference">combobox</a> is an input widget that has an associated popup.
+          The popup enables users to choose a value for the input from a collection.
           The popup may be a <a href="../listbox/">listbox</a>, <a href="../grid/">grid</a>, <a href="../treeview/">tree</a>, or <a href="../dialog-modal/">dialog.</a>
+        </p>
+        <p>
+          In some implementations, the popup presents allowed values, while in other implementations, the popup presents suggested values.
           Many implementations also include a third optional element -- a graphical <q>Open</q> button adjacent to the combobox, which indicates availability of the popup.
           Activating the <q>Open</q> button displays the popup if suggestions are available.
         </p>
         <p>
           The combobox pattern supports several optional behaviors.
           The one that most shapes interaction is text input.
           Some comboboxes allow users to type and edit text in the combobox and others do not.
-          If a combobox does not support text input, it is referred to as select-only, meaning the only way users can set a value is by selecting a value in the popup.
+          If a combobox does not support text input, it is referred to as select-only, meaning the only way users can set its value is by selecting a value in the popup.
           For example, in some browsers, an HTML <code>select</code> element with <code>size="1"</code> is presented to assistive technologies as a combobox.
           Alternatively, if a combobox supports text input, it is referred to as editable.
           An editable combobox may either allow users to input any arbitrary value, or it may restrict its value to a discrete set of allowed values, in which case typing input serves to filter suggestions presented in the popup.

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

@@ -12,7 +12,7 @@ permalink: /ARIA/apg/patterns/combobox/examples/combobox-autocomplete-both/
 
 sidebar: true
 
-footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/7'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/7'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>

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/w3c/aria-practices/projects/7'>View issues related to this example</a></p>        <p>Page last updated: 19 June 2023</p>      </div>    "
+footer: "      <div class='example-page-footer'>        <p><a href='https://github.com/w3c/aria-practices/projects/7'>View issues related to this example</a></p>        <p>Page last updated: 24 July 2023</p>      </div>    "
 
 # Context here: https://github.com/w3c/wai-aria-practices/issues/31
 type_of_guidance: APG
@@ -68,10 +68,8 @@ if (enableSidebar) document.body.classList.add('has-sidebar');
 
     <details id="support-notice">
       <summary>
-        <p>
-          The code in this example is not intended for production environments.
-          Before using it for any purpose, read this to understand why.
-        </p>
+        The code in this example is not intended for production environments.
+        Before using it for any purpose, read this to understand why.
       </summary>
       <p>This is an illustrative example of one way of using ARIA that conforms with the ARIA specification.</p>
       <ul>