Update search.mdx

Have updated several sections of the form to improve guidance and provide more accurate info.

Information updated includes:

Placeholder text
Icon position
Clear seach icon
Accessibility

The placeholder text on the 'don't' guidance needs to include: "Search first name, last name, email, role, location"and if possible is long enough to show truncation happening.

For the clear search icon, we have two examples we can show. One from Chrome and one from Safari. They're in the Figma file.

Thanks

aries-site/src/pages/components/search.mdx

@@ -27,14 +27,14 @@ Many search best practices extend "behind the scenes," such as how query strings
 
 ### Placeholder
 
-Placeholder text should only contain the text "Search".
+Placeholder text should ideally be brief and to the point.
 
 <BestPracticeGroup>
   <Example
     height="small"
     bestPractice={{
       type: 'do',
-      message: 'Search placeholder only contains the text "Search".',
+      message: 'Make the placeholder text concise.',
     }}
   >
     <SearchPlaceholder />
@@ -43,7 +43,7 @@ Placeholder text should only contain the text "Search".
     height="small"
     bestPractice={{
       type: 'dont',
-      message: `Don’t use specific attributes or descriptors in the search placeholder.`,
+      message: `Avoid lengthly placeholder text and avoid truncation.`,
     }}
   >
     <SearchPlaceholder bestPractice={false} />
@@ -64,15 +64,26 @@ Placeholder text should only contain the text "Search".
 
 ### Accessibility
 
-Search inputs should be accessible. Ensure users have the ability to return results using their keyboard as well as clicking a button.
+Search inputs should be accessible. Ensure users have the ability to return results using their keyboard or by clicking a button.
 
-Inputs should always be accompanied by labels for accessibility. An icon may serve as a label if:
+All search inputs should specify `type="search"`
 
-1. The icon meaning is well understood.
-2. Has an 'aria-labelledby' attribute.
+If the search input is within a form then the placeholder should be used instead of a label. If the search input is outside of a form use an`aria-label` in addition to a placeholder.
 
 For additional detail, see [ARIA form hints](https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/forms/Basic_form_hints) and ['aria-labelledby'](https://www.w3.org/WAI/tutorials/forms/labels/#using-aria-labelledby).
 
+## Icons
+
+### 'Search' icon placement
+
+The search icon may be placed either to the right or left of the input field. Icon position is controlled via the [reverse](https://v2.grommet.io/textinput?theme=hpe#reverse) property
+
+Place the icon in the position that most helps people to scan the page and identify the search field. Working as a visual aid, the search icon is best seen before the placeholder 'search’ text is. When deciding where to place the icon, consider where the search bar is located and how the user might be scanning the page (for example, in an F pattern from left to right). The search icon is not itself interactive.
+
+### 'Clear search' icon
+
+The search input uses the browser's native ’clear’ icon, which may differ visually from other HPE icons.
+
 ## Variants
 
 Visual and functional extensions for Search.