From 6055f05003794b27c12bd13bf340ab34cfb04b2b Mon Sep 17 00:00:00 2001 From: Barb Denney Date: Thu, 31 Oct 2024 10:48:21 -0600 Subject: [PATCH] Update breadcrumbs.md Changed 'that' to the 'the' in the placement section --- src/_components/breadcrumbs.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/_components/breadcrumbs.md b/src/_components/breadcrumbs.md index 2c48029ad..86f8c58d3 100644 --- a/src/_components/breadcrumbs.md +++ b/src/_components/breadcrumbs.md @@ -63,7 +63,7 @@ Start with "VA.gov home". Clearly indicate that the home page is the VA.gov home * The breadcrumb should be placed below the header and above the main content. * The placement of the breadcrumb must be consistent from page to page. -* Spacing for the breadcrumb is built in to the component and should be consistent throughout all layouts. The correct spacing is specified in that images below: +* Spacing for the breadcrumb is built in to the component and should be consistent throughout all layouts. The correct spacing is specified in the images below: {% include component-example.html alt="Breadcrumbs have 20px / 2.5 spacing units above and 32px / 4 spacing units below at a mobile breakpoint." file="/images/components/breadcrumbs/breadcrumbs-spacing-mobile.png" caption="Breadcrumbs have 20px or 2.5 spacing units above and 32px or 4 spacing units below at a mobile breakpoint." %} @@ -95,4 +95,4 @@ To use React Router with this component [follow these instructions](https://desi ### Additional accessibility guidance for VA -* **Make current page a link.** Use a link for the current page for robustness. While it may sound counterintuitive to link to the current page in this component, it makes sense to include this as a link so screen readers voice the current page link whether the user navigates by element or by tabbing. Making the current page a link rather than text makes it a focusable and clickable element. It also follows [WAI-ARIA Authoring Practices Guide (APG) guidances](https://www.w3.org/WAI/ARIA/apg/patterns/breadcrumb/examples/breadcrumb/) which states that an `a` element with `aria-current="page"` should represent the current page. \ No newline at end of file +* **Make current page a link.** Use a link for the current page for robustness. While it may sound counterintuitive to link to the current page in this component, it makes sense to include this as a link so screen readers voice the current page link whether the user navigates by element or by tabbing. Making the current page a link rather than text makes it a focusable and clickable element. It also follows [WAI-ARIA Authoring Practices Guide (APG) guidances](https://www.w3.org/WAI/ARIA/apg/patterns/breadcrumb/examples/breadcrumb/) which states that an `a` element with `aria-current="page"` should represent the current page.