Iframes embed content on a page, essentially by pulling content from one web page or HTML file into another. Iframes can be many different types of content from third-party advertisements to critical information.
Sighted users may not recognize whether an iframe is present, but they are able to scan the information within the iframe is relevant to them.
People using screen readers use the iframe’s title as an indicator of whether the content is relevant to them. Most screen readers will let users skip over iframe content with a keystroke, or skip between iframes with keystrokes, so ensuring the title is accurate and descriptive is critical.
The title will be used in two places: in the <iframe> title attribute, and in the <title> of the source page of the <iframe>. The JAWS screen reader uses the <title> of the source as the identifier unless it is missing, then it defaults to the <iframe title>.
Do
- Refer to Page Titles for title guidelines.
- Ask yourself, “How would I summarize this content if it was on a page by itself?” to help decide what makes the most sense.
- Be succinct. Use as few words as necessary.
- Ensure that the title describes the content of the iframe such that it can’t be confused with something else on the page. For example, naming every iframe on a video page “YouTube video” would require the user to play each video to tell them apart. Naming each of them with the content they contain makes scanning them much easier.
Do not
- Name iframes with generic phrases like “Iframe”.
- Name two or more iframes with the same name.