From a test result to the affected element
The Accessibility Inspector connects a plugin finding with its location on your website. Find a hard-to-recognise link, read the explanation and temporarily preview a possible improvement without editing HTML.
The Inspector is available on every plan. Opening it, navigating findings and viewing saved fixes uses no AI allowance. Only a new AI generation uses your available allowance. An automated test or preview does not replace a complete manual WCAG evaluation.
Open and navigate the Inspector
- Open Accessibility Test in the plugin and expand a saved result.
- Choose Open Inspector to browse affected elements. The Inspector action beside a finding opens that specific location.
- Use the element numbers, previous/next controls or overview. One element can have several findings.
- Read Finding first. The element card above it helps identify the location.
On desktop, choose a docking position and drag the designated edge to resize. Phones use a bottom panel. Hide the Inspector for more space and restore it when needed; this preserves an active preview. Use Tab to reach controls and Enter or Space to operate buttons and expandable sections.
Understand the element card
| Field | Meaning and next step |
|---|---|
| Selected element | Text or a description identifying the location, such as an image alternative. A description from a saved result may differ from today’s content. |
| Icon and type | Identify a link, image, heading or button. A written type accompanies the icon. |
| Visibility | Whether the current element can be seen and highlighted. Visible does not mean accessible. |
| DOM path | The element’s technical address within the loaded page, useful when sharing a finding with your developer. It is not a website address. |
| Description | Helps identify the element; it is not a guaranteed transcript of a screen reader announcement. |
| Role | The element’s function, such as link or button. Technical values remain unchanged across languages. |
| Size | Current width and height in pixels. Size alone does not establish usability. |
| Accessibility tree | An estimate of availability to assistive technology, with the limitations explained below. |
Expand DOM path and details when you need these fields. Use the copy icon to copy the path and watch for the confirmation.
What is the accessibility tree?
Browsers provide assistive technologies such as screen readers with a simplified representation of the page, including names, roles and states of controls.
Included (best effort) means the plugin estimates that an element is available, based on the loaded page. It does not read the browser’s actual accessibility tree. This is neither proof of a correct announcement nor of full keyboard operation.
Excluded (best effort) is not automatically a failure. Decoration or content inside a closed menu may appropriately be hidden. A needed link or active control must remain accessible. Check the relevant function with a keyboard and, where appropriate, a screen reader.
WCAG requires names, roles and relevant states of controls to be available programmatically. This Inspector field provides orientation, not a separate WCAG result. W3C explanation of WCAG 4.1.2: Name, Role, Value
When the location is unclear
| Situation | What to do |
|---|---|
| Hidden | Open the relevant menu, tab or dialog yourself. The Inspector does not automatically open intentionally closed controls. |
| Visible context only | The target has no visible box of its own. The highlight identifies a visible child area for orientation; compare the description and finding. |
| Not found | The page may have changed. Run a new Accessibility Test and open the Inspector from that result. |
| Multiple matches | Compare the element text and surrounding paragraph. Choose a preview target only when you can identify it confidently; identical text or first position alone is insufficient. |
| Whole-page finding | There is no individual target. Review the structure described by the finding. |
| Invalid or expired context | Refresh the result list and reopen the Inspector from there. Retest if the page has changed. |
Check a suggestion with AI Element Fix
Choose Generate AI Element Fix. The plugin uses the finding and available bounded element context. Review the recommended solution before making changes.
- Why is this important? explains the impact on visitors.
- Code and preview shows current and, when available, suggested markup. Long lines scroll horizontally and can be copied.
- The verification section explains how to check the change.
A preview changes only your current browser view. You can undo it; navigating to another element also removes it. Hiding and restoring the Inspector preserves it. Nothing is saved to WordPress by a preview.
Some suggestions cannot be previewed safely. If preview or checkable code is unavailable, read the explanation there. Review the context, retest if necessary or share the instructions with your developer. Do not change arbitrary attributes just to remove a test warning.
Typical findings and WCAG
A link relies on colour: Permanent underlining can make it recognisable without colour. Contrast against its background still needs checking; contrast between link and surrounding text is a different measurement. WCAG 1.4.1: Use of Color
A heading does not fit the structure: Review its section and preceding headings. Choose its level by meaning, not font size. Returning to a higher-level section is not inherently wrong. WCAG 1.3.1: Info and Relationships
A button has no meaningful name: Add an appropriate label explaining its action, then check the screen reader experience. A role does not replace a name. WCAG 4.1.2: Name, Role, Value
Apply and verify a permanent change
- Find where the element is maintained: content, block, page builder, template or another plugin.
- Apply the reviewed change there. Copying a suggestion alone changes nothing on the website.
- Check desktop and phone layouts, keyboard operation and, where appropriate, a screen reader. Preserve clear labels, visible focus and functionality.
- Run another Accessibility Test. A cleared finding confirms only that automated check; also review the surrounding user experience.
Related: Accessibility Test · Explanation & Solution and AI Element Fix