Iframes

An iframe embeds one HTML page inside another:

<iframe
  src="https://example.com/map/"
  title="Map of the harbor cycle route"
  width="800"
  height="500"
  loading="lazy"
></iframe>

The embedded page has its own document, URL, scripts, and styles. Your page does not absorb its content as normal HTML.

Always provide a useful title. Screen-reader users need it to decide whether to enter the embedded document.

Iframes can be expensive because the browser may load an entire application. Lazy-load below-the-fold embeds when appropriate.

If you embed content you do not control, consider the sandbox attribute. An empty sandbox applies strong restrictions:

<iframe src="/preview/" title="Page preview" sandbox></iframe>

You can selectively allow capabilities, but every exception increases what the embedded page can do. Only grant what it needs.

Many sites prevent embedding with HTTP security headers. If an iframe stays blank or reports an error, the remote site may not allow it.

Quick check

Result

You got of right.

Try again