Are iframes that have no meaningful content hidden?


Ensure that screen readers aren’t reading out iframes to users when there’s no meaningful content in the iframe.

Why this matters

Sometimes iframes contain javascript or other information (such as decorations) that people using screen readers don’t need to hear. We don’t want to waste their time and they don’t want it wasted.

How to implement

Ensure that each <iframe> that should be hidden has a hidden attribute or has a CSS display:none property set.

For additional reading, see Hush Sweet iFrame by HTML Accessibility.

How to test

Manual testing

  • Inspect the code for each iframe that should be hidden and confirm that it has an aria-hidden attribute or has a CSS display:none property set.
  • Note that hiding the iframe does not invalidate the need to test Do all iFrames have unique titles? because if the “hidden” state changes due to a bug, the iframe will need to have a title.

Automated testing

No automated testing for this issues exists at this time. (An HTML validator might be able to tell you if the aria-hidden attribute was declared incorrectly but can’t programmatically identify that the <iframe> should be hidden.