iFrame (Inline Frame)

Example

<iframe src="https://www.youtube.com/embed/VIDEO_ID" title="Product demo" loading="lazy"></iframe>

Good practice

• Add a title attribute, so screen reader users know what the frame contains.
• Lazy-load iFrames further down the page with loading="lazy", because each one can load a lot of extra code.
• Set a size or aspect ratio to avoid layout shifts.
• Consider privacy: embedded services can set cookies, so some need consent in the EU; privacy-friendly embed options exist for YouTube and maps.
• Think about security: the sandbox attribute limits what embedded content can do, and security headers can stop other sites from framing your pages.

iFrames and SEO

Google may index content inside an iFrame, but it usually credits it to the page it comes from, not to your page. Put the content you want to rank for directly in your own HTML, and use iFrames for embeds.

iFrame example

A clinic embeds a booking widget from a scheduling service in its contact page with an iframe. The widget loads inside the page, so patients can book without leaving the site. The clinic adds a title attribute, sets a fixed height to avoid layout jumps and lazy-loads the frame. It also checks that the page includes a normal text and phone alternative for people who cannot use the widget.

iFrame and SEO: what to remember

• Content inside an iframe belongs to the page it comes from, not to your page, so do not put important text there.
• Search engines may index the framed page on its own, if it is public.
• Heavy embeds slow the page. Load them when needed.
• Embedded services can set cookies and need consent in some regions.

iFrame mistakes

• Putting your main content in an iframe.
• Letting a third-party iframe cause layout shifts.
• Embedding something that others can use to hijack clicks, with no sandbox limits.
• Missing title attributes, which hurts accessibility.

iFrame FAQs

Are iframes bad for SEO?

Not by themselves, but content inside them does not count as part of your page. See cumulative layout shift and page speed.

What can I use instead?

Native embeds, a link, or a script from the provider. See JavaScript and HTML.