How and When to Use IFrames

Inline frames include content from external sources on your pages

Inline frames, usually just called iframes, are the only type of frame allowed in HTML5. These frames are essentially a section of your page that you "cut out." In the space that you have cut out of the page, you can then feed in an external webpage.

In essence, an iframe is another browser window set inside your web page. You see code iframes commonly used on websites that need to include external content like a Google map or a video from YouTube. Both of those popular websites use iframes in their embed code.

How to Use the IFRAME Element

Browser Window
filo / Getty Images

The element uses the HTML5 global elements as well as several other elements. Four are also attributes in HTML 4.01:

  • the URL for the source of the frame,
  • the height of the window,
  • the width of the window, and
  • the name of the window.

Three are new in HTML5:

  • Srcdoc: The HTML for the source of the frame. This attribute takes precedence over any URL in the src attribute.
  • Sandbox: A list of features that should be allowed or disallowed in the frame window.
  • Seamless: Tells the user agent that the iframe should be rendered like it is invisibly part of the parent document.

To build a simple iframe, set the source URL and the width and height in pixels:

<iframe src="https://www.example.com" width="200" height="200"></iframe>

Use a percentage rather than a stipulated size in pixels for a responsive website whose sizing should change with different screen sizes.

Iframe Browser Support

The iframe element is supported by all modern desktop and mobile browsers. However, some browsers don't yet respond consistently to the three new HTML5 attributes for this element.

Iframes and Security

The iframe element, by itself, is not a security risk to you or your site visitors. Iframes have gotten a bad reputation because they can be used by malicious websites to include content that can infect a visitor's computer without them seeing it on the page, by incorporating links pointing to the invisible iframe, and those scripts set off malicious code.

Some computer viruses inject an invisible iframe into your web pages, effectively turning your website into a botnet.

Your site visitors are only as safe as the content of all the sites you link to. If you have reason to think a site is untrustworthy, don't link to it in any fashion.