Frames must have a title

How to fix the problem?

A <frame> or <iframe> without a title cannot be announced properly by screen readers. Without a title it is hard for screen reader users to switch between frames on a page.

Use one of the following options to fix the issue:

Option 1: Add a title attribute

Add the title attribute:

<iframe src="/news-item.html" 
  title="New accessibility tool launched"></iframe>

Option 2: Use aria-label

<iframe src="/news-item.html" 
  aria-label="New accessibility tool launched"></iframe>

Option 3: Use aria-labelledby

<div id="iframe-label">New accessibility tool launched:</div>

<iframe src="/news-item.html" 
  aria-labelledby="iframe-label"></iframe>

What is a good title?

Make sure to add a descriptive title to the frame. An effective way to come up with a title is by imagining yourself describing the content of the frame out loud to someone.

Make sure each frame title is unique on the page. Screen readers allow users to switch between frames. It is not possible to distinguish frames if they have the same name.

Why is this important?

Screen reader users can navigate between frames using a list of frame titles. Without a title, the frame is announced with no label, making it impossible to know what content it contains. Duplicate or missing titles prevent users from choosing the correct frame.