Embedded frame with no title

WCAG 4.1.2, 2.4.1 (A) · EN 301 549 9.4.1.2

There is an <iframe> with no title attribute.

Why it matters

Screen readers can list the frames on a page. With no title they show up as "frame", "frame", "frame", and the person has to enter each one to find out which is the video, which the map and which the chat widget.

Thirty seconds per frame to fix, and it appears in every audit report.

How to fix it

Add a title describing what the frame contains. If the iframe is an invisible tracking pixel, mark it aria-hidden="true" as well as hiding it.

<iframe src="https://www.youtube.com/embed/xyz"></iframe>

<iframe src="https://www.youtube.com/embed/xyz"
        title="Video: how to choose your size"></iframe>

On your platform

• Shopify

  If the video comes from a theme block, edit the template under Online Store › Themes › Edit code and add the title to the iframe.

• WooCommerce

  YouTube embeds added with the block editor inherit the block title; check any added by hand as custom HTML.

Related

• Image button with no alternative text
• Form fields with no label
• Buttons with no name
• Links with no name