Group 1: Banner and Image audit on the website (#2897)

Co-authored-by: Kristin Bradley <[email protected]>

Author: andgen404

website/docs/components/dropdown/partials/guidelines/overview.md

@@ -1,4 +1,4 @@
-A dropdown is a flexible component that displays a list of actions or options to the user. It should not be confused with [Select](/components/form/select), which is used in forms as a way for the user to make a selection from a list.
+A dropdown is a flexible component that displays a list of actions or options to the user. It should not be confused with the [Select](/components/form/select), which is used in forms as a way for the user to make a selection from a list.
 
 !!! Info
 

website/docs/components/form/select/partials/guidelines/guidelines.md

@@ -1,11 +1,3 @@
-!!! Info
-
-**This component uses a native HTML element**
-
-It's not possible to customize options within this component as it is a native HTML element and uses browser defaults to render it. Find more information [on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select).
-
-!!!
-
 ## Usage
 
 ### When to use

website/docs/components/form/select/partials/guidelines/overview.md

@@ -1 +1,9 @@
-A Select is a form element that provides users with a way to select amongst a set of options.
+A Select is a form element that provides users with a way to select amongst a set of options.
+
+!!! Info
+
+**This component uses a native HTML element**
+
+It's not possible to customize options within this component as it is a native HTML element and uses browser defaults to render it. Find more information [on MDN](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select).
+
+!!!

website/docs/components/reveal/partials/guidelines/guidelines.md

@@ -45,6 +45,11 @@ The Reveal component should be used for hiding and showing simple content. For c
 
 ## Spacing
 
+!!! Info
+
+In cases where surrounding elements already have margin or padding added, you may want to reduce or remove the spacing entirely.
+!!!
+
 - When using the Reveal to contain information related to a single element within a group or section, we recommend leaving 8px between the Reveal and the element it relates to.
 
 ![Reveal example within a section](/assets/components/reveal/spacing-guidance-single-element.png =591x*)
@@ -53,9 +58,4 @@ The Reveal component should be used for hiding and showing simple content. For c
 
 ![Reveal example underneath a section](/assets/components/reveal/spacing-guidance-section.png =591x*)
 
-- If you need to adjust the spacing, always ensure it is slightly tighter compared to the spacing between other elements and components in the group, section, or page.
-
-!!! Info
-
-In cases where surrounding elements already have margin or padding added, you may want to reduce or remove the spacing entirely.
-!!!
+- If you need to adjust the spacing, always ensure it is slightly tighter compared to the spacing between other elements and components in the group, section, or page.

website/docs/patterns/table-multi-select/partials/guidelines/guidelines.md

@@ -1,12 +1,12 @@
 The Helios Table [multi-select functionality](/components/table/table#multi-select) supports performing bulk actions and selection of one or more rows within a Table.
 
-![Example of Table multi-select in context](/assets/patterns/table-multi-select/multi-select-preview-image.png)
-
 !!! Info
 
 These guidelines are meant to assist teams in designing and building Tables that have bulk editing and selection functionality. Currently there aren’t Ember or Figma components to support these advanced patterns, but they can be composed using a combination of HDS components.
 !!!
 
+![Example of Table multi-select in context](/assets/patterns/table-multi-select/multi-select-preview-image.png)
+
 ## Selected count
 
 Display the **selected count** to communicate how many rows or results have been selected in the _entire_ data set. This includes Table rows that are outside of the current view in the Table (e.g., in a different page if using [Pagination](/components/pagination)), and should be represented using a numerical value.

website/docs/utilities/dialog-primitive/partials/code/how-to-use.md

@@ -47,6 +47,12 @@ The `DialogPrimitive` serves as the foundation for dialog derived components lik
 
 The `@titleTag` argument changes the HTML element that wraps the `DialogPrimitive::Header` tagline and "title" content. When organizing the content on a webpage, the heading levels should reflect the structure of the page. For example, if the `DialogPrimitive` is used as a Split Window, the value should be `"h2"`. 
 
+!!! Insight
+
+The default `@titleTag` value is `"div"` as the correct heading level (`h1–`h6) is dependent on the context in which it is used within a page. We strongly encourage consumers to set the appropriate `@titleTag` value to meet WCAG Success Criterion [1.3.1 Info and Relationships](https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html) as the visual experience should match what is presented to the user with assistive technology.
+
+!!!
+
 ```handlebars
 <div class="doc-dialog-primitive-grid-layout">
   <div class="doc-dialog-primitive-flex-layout">
@@ -79,9 +85,3 @@ The `@titleTag` argument changes the HTML element that wraps the `DialogPrimitiv
   </Hds::DialogPrimitive::Wrapper>
 </div>
 ```
-
-!!! Insight
-
-The default `@titleTag` is `"div"` because the correct value is dependent on the individual page. We strongly encourage consumers to update the `@titleTag` to meet WCAG Success Criterion [1.3.1 Info and Relationships](https://www.w3.org/WAI/WCAG22/Understanding/info-and-relationships.html) as the visual experience should match what is presented to the user with assistive technology.
-
-!!!