Iframe accessible name is duplicated
| Field | Value |
|---|---|
| Rule code | Iframe_Name_Duplicate |
| WCAG conformance level | A |
| WCAG success criterion | 4.1.2 Name, Role, Value |
| Must be fixed at source | No |
Description
We detected an iframe with a duplicated accessible name in one or more additional elements. Iframe and Frame HTML tags must identify themselves with a concise and unique title attribute or ARIA attribute equivalents. If accessible names are reused throughout the page, it will not be certain in announcement which element is being focused on.
How to fix
Iframe and Frame elements should have a concise and unique accessible name, generally provided by the title attribute or ARIA equivalents like aria-label or aria-labelledby. This ensures that users can differentiate between different frames on a page when using assistive technologies.
We detected that an accessible name is being reused (duplicated) across multiple frames or iframes. To resolve this issue, assign a unique and descriptive accessible name to each frame or iframe on your page.
Example:
Avoid using the same accessible name for different iframes unless they serve the exact same purpose.
<!-- Good example -->
<iframe title="Navigation Menu" src="menu.html"></iframe>
<iframe title="Main Content" src="content.html"></iframe>
<!-- Bad example -->
<iframe title="Frame" src="menu.html"></iframe>
<iframe title="Frame" src="content.html"></iframe>