diff --git a/packages/documentation-site/patternfly-docs/content/developer-resources/accessibility-development.md b/packages/documentation-site/patternfly-docs/content/developer-resources/accessibility-development.md
index 31722b48e1..6dc5ed85c9 100644
--- a/packages/documentation-site/patternfly-docs/content/developer-resources/accessibility-development.md
+++ b/packages/documentation-site/patternfly-docs/content/developer-resources/accessibility-development.md
@@ -73,6 +73,23 @@ There are 2 main categories of accessible icons:
For **non-interactive icons**, include `.pf-v5-screen-reader` text near the icon. Depending on the component, this text might not be a direct sibling to the icon element.
+For example, in the alert component, the icon label text is adjacent to the message:
+
+ ```
+ {
+
+
+
+
+
+
+ {{#> screen-reader}}Success:{{/screen-reader}} Success alert title
+
+
+
+ }
+ ```
+
#### Images
All images should have alt text so that assistive technology can provide an image description. When an image contains words that are important to understanding the content, the alt text should include those words. This allows the alt text to communicate the same message as the image itself.
@@ -81,8 +98,6 @@ All images should have alt text so that assistive technology can provide an imag
The exception to this practice is when images are primarily for presentation purposes and are not essential pieces of content. To signify that an image should be skipped by a screen reader, set the value of the alt attribute to an empty string: `alt=””`.
-For example, in the alert component, the icon label text is adjacent to the message. This way, when `role="alert"` is added to `.pf-v5-c-alert__body` for dynamically displayed alerts, the type of message is announced along with the message text.
-
#### Trapping focus
The recommended interaction pattern for components like the modal or popover is to trap focus within the component's modal element when it becomes visible.
@@ -103,7 +118,7 @@ When `tabIndex` is added, you should either add `role='region'` and an `aria-lab
Some screen reader users navigate page elements via an element list or rotor menu, and the default label for these scrollable elements will be driven by whatever text content exists inside the container. This generated label may not be suitable to describe the region's purpose, and would likely be better described with a simple `aria-label`.
-Example:
+For example:
```html noLive