WCAG 2.2 AA updates to content and addition of aria labelling

src/components/breadcrumbs/_guidance.hbs

@@ -11,7 +11,7 @@ layout: blank-layout.hbs
 	<li>reflect the names of the parent-level pages ensuring you use the same labels and casing as the main IA</li>
 </ul>
 
-<p><strong>Parent page</strong><br>Starts with the "Home" page and links users to parent-level pages in the IA</p>
+<p><strong>Parent page</strong><br>Starts with the "Home" page and links users to parent-level pages in the IA.</p>
 <p><strong>Icon</strong><br>The chevrons between the names shows the visual hierarchy between pages.</p>
 <p><strong>Current page</strong><br>Indicates the current page the user is viewing.</p>
 <p><strong>Ellipsis</strong><br>Provides a clickable option to expand and reveal the full breadcrumb path for mobile users.</p>

src/components/hero-banner/_guidance.hbs

@@ -22,7 +22,7 @@ layout: blank-layout.hbs
 <p>Do not use:</p>
 <ul>
   <li>to replace titles on content pages, instead use H1 typography styles</li>
-  <li>for sites or products where the primary navigation of your users is via search, consider Hero Search</li>
+  <li>for sites or products where the primary navigation of your users is via search, consider <a href="/components/hero-search/index.html" aria-label="Hero search component">Hero Search</a></li>
 </ul>
 
 <h2>Building heros</h2>

src/docs/content/about/what-is-design-system.hbs

@@ -8,16 +8,16 @@ meta-index: true
 ---
 
 <p>The NSW Design System is a single source of truth for the design and development of digital products and services in NSW Government. Our mission is to help teams build products and services that meet user needs and deliver great user experiences.</p>
-<p>Our <a href="/docs/content/design/getting-started.html">design guidelines</a> and <a href="/docs/content/develop/getting-started.html">development documentation</a> guide you on how to use the NSW Design System. Embracing a code first approach, all parts of the design system have been built in alignment to deliver simple and consistent solutions.</p>
+<p>Our <a href="/docs/content/design/getting-started.html" aria-label="Link to get started from a designers's standpoint with the NSW Design System">design guidelines</a> and <a href="/docs/content/develop/getting-started.html" aria-label="Link to get started from a developer's standpoint with the NSW Design System">development documentation</a> guide you on how to use the NSW Design System. Embracing a code first approach, all parts of the design system have been built in alignment to deliver simple and consistent solutions.</p>
 <p>Building from a single, best practice base ensures consistency with how our users engage and interact with NSW Government digitally. Resulting in easy to use products and services.</p>
 
 <h2>Benefits</h2>
 
 <h3>Build faster and at scale</h3>
-<p>Save time and money with an <a href="/docs/content/about/our-ecosystem.html">ecosystem</a> that is made to work together. The design system features a library of styles, components and templates, and well as advice and guidance for how and when to use each one. Delivered in ready to go UI and code kits, say goodbye to building from scratch.</p>
+<p>Save time and money with an <a href="/docs/content/about/our-ecosystem.html" aria-label="Link to information about NSW Design System system ecosystem information">ecosystem</a> that is made to work together. The design system features a library of styles, components and templates, and well as advice and guidance for how and when to use each one. Delivered in ready to go UI and code kits, say goodbye to building from scratch.</p>
 
 <h3>Out-of-the-box brand and accessibility compliance</h3>
-<p>Understand, apply and meet brand standards, with features required for brand compliance indicated with a 🔹 blue diamond. Supporting the <a href="https://www.nsw.gov.au/branding" target="_blank">NSW Government Brand Framework</a>, the Design System can be used by (and bring value) to any brand classification. Our Design System has been updated to align with WCAG 2.2 level AA standards, providing components designed to support accessibility and inclusivity.</p>
+<p>Understand, apply and meet brand standards, with features required for brand compliance indicated with a 🔹 blue diamond. Supporting the <a href="https://www.nsw.gov.au/branding" aria-label="Link to the NSW Branding team website" target="_blank">NSW Government Brand Framework</a>, the Design System can be used by (and bring value) to any brand classification. Our Design System has been updated to align with WCAG 2.2 level AA standards, providing components designed to support accessibility and inclusivity.</p>
 <p>While these components are built to meet accessibility guidelines, achieving compliance for your product will depend on how they are integrated and used. Accessibility is influenced by your implementation choices including content creation, customisation and interaction design.</p>
 
 <p>To maximise compliance:</p>
@@ -27,11 +27,11 @@ meta-index: true
 <li>Regularly review and update your product to maintain accessibility.</li>
 </ul>
 
-<p>For additional support, explore our <a href="https://www.digital.nsw.gov.au/delivery/accessibility-and-inclusivity-toolkit/courses" target="_blank">digital accessibility training resources</a>. Alternatively, contact <a href="mailto:[email protected]">our team</a> for implementation advice.</p>
+<p>For additional support, explore our <a href="https://www.digital.nsw.gov.au/delivery/accessibility-and-inclusivity-toolkit/courses" aria-label="Link to the Accessibility and Inclusivity Toolkit on the Digital NSW website" target="_blank">digital accessibility training resources</a>. Alternatively, contact <a href="mailto:[email protected]">our team</a> for implementation advice.</p>
 
 <h3>Design System Updates for WCAG 2.2 Compliance</h3>
 <p>We've updated the components in the NSW Design System to achieve compliance with WCAG 2.2 Level AA. Please review your digital products to determine if adjustments are needed to align with these updates.</p>
-<p>For detailed explanations of each <a href="https://www.w3.org/WAI/standards-guidelines/wcag/new-in-22/" target="_blank">WCAG 2.2 success criterion</a>, visit the W3C website.</p>
+<p>For detailed explanations of each <a href="https://www.w3.org/WAI/standards-guidelines/wcag/new-in-22/" aria-label="Link to WCAG 2.2 AA criteria on the WCAG website" target="_blank">WCAG 2.2 success criterion</a>, visit the W3C website.</p>
 
 <div class="nsw-section nsw-section--white nsw-block nsw-p-x-sm nsw-p-top-sm">
 <div class="nsw-table nsw-table--valign-middle">
@@ -47,55 +47,55 @@ meta-index: true
     </tr>
     <tr>
       <td>
-        <p><a href="/components/accordion/index.html" target="_blank">Accordion</a></p>
+        <p><a href="/components/accordion/index.html" aria-label="Link to accordion component detail page on the NSW Design System" target="_blank">Accordion</a></p>
       </td>
       <td>
         <p>Target size (minimum)</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/breadcrumbs/index.html" target="_blank">Breadcrumbs</a></p>
+        <p><a href="/components/breadcrumbs/index.html" aria-label="Link to breadcrumbs component detail page on the NSW Design System" target="_blank">Breadcrumbs</a></p>
       </td>
       <td>
         <p>Target size (minimum)</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/card-carousel/index.html" target="_blank">Card carousel</a></p>
+        <p><a href="/components/card-carousel/index.html" aria-label="Link to card carousel component detail page on the NSW Design System" target="_blank">Card carousel</a></p>
       </td>
       <td>
-        <p>Target size (minimum), Dragging Movements</p>
+        <p>Target size (minimum), Dragging movements</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/footer/index.html" target="_blank">Footer</a></p>
+        <p><a href="/components/footer/index.html" aria-label="Link to footer component detail page on the NSW Design System" target="_blank">Footer</a></p>
       </td>
       <td>
         <p>Target size (minimum)</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/hero-banner/index.html" target="_blank">Hero banner</a></p>
+        <p><a href="/components/hero-banner/index.html" aria-label="Link to hero banner component detail page on the NSW Design System" target="_blank">Hero banner</a></p>
       </td>
       <td>
         <p>Target size (minimum)</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/hero-search/index.html" target="_blank">Hero search</a></p>
+        <p><a href="/components/hero-search/index.html" aria-label="Link to hero search component detail page on the NSW Design System" target="_blank">Hero search</a></p>
       </td>
       <td>
         <p>Target size (minimum), Redundant entry</p>
       </td>
     </tr>
     <tr>
       <td>
-        <p><a href="/components/in-page-nav/index.html" target="_blank">In-page navigation</a></p>
+        <p><a href="/components/in-page-nav/index.html" aria-label="Link to in-page nav component detail page on the NSW Design System" target="_blank">In-page navigation</a></p>
       </td>
       <td>
         <p>Target size (minimum)</p>
@@ -106,7 +106,7 @@ meta-index: true
 </div>
 </div>
 
-<p>Keep an eye on this page for more updates, and <a href="https://mailchi.mp/707ce8dec373/get-updated-by-email-govuk-design-system" target="_blank">sign up to our mailing list</a> to hear from us about future events and updates.</p>
+<p>Keep an eye on this page for more updates, and <a href="https://mailchi.mp/707ce8dec373/get-updated-by-email-govuk-design-system" aria-label="Link to sign up to the NSW Design System's mailing list" target="_blank">sign up to our mailing list</a> to hear from us about future events and updates.</p>
 
 <h3>Consistent code and design language</h3>
 <p>When using our foundations, components and themes, get access to fully synchronised UI and code kits for both designers and developers. This means everyone uses the same atomic components, with extended guidance also bridging the gap to help avoid design drift.</p>
@@ -118,4 +118,4 @@ meta-index: true
 <h3>Questions</h3>
 <p>If you have any questions or would like to chat to us further about using the NSW Design System reach out to us at <a href="mailto:[email protected]">[email protected].</a></p>
 <h3>Report issues</h3>
-<p>View and raise issues and bugs through our <a href="https://github.com/digitalnsw/nsw-design-system/issues" target="_blank">Issues tracker</a> on Github or via <a href="https://community.digital.nsw.gov.au/c/components/report-a-bug/27" target="_blank">Report a bug</a> on the Community.</p>
+<p>View and raise issues and bugs through our <a href="https://github.com/digitalnsw/nsw-design-system/issues" aria-label="Link to view the current and/or resolve issues on Github for the NSW Design System" target="_blank">Issues tracker</a> on Github or via <a href="https://community.digital.nsw.gov.au/c/components/report-a-bug/27" aria-label="Link to engage with the NSW Design System community and report a bug" target="_blank">Report a bug</a> on the Community.</p>