Press key to advance. Zoom in/out: Ctrl or Command + +/-.

HTML: Embeds


The iframe element

You can use HTML to embed other webpages in your own page using an iframe element pointing at a URL:

<iframe src=""
  width="500" height="300"></iframe>

Iframe embeds

The iframe element makes it easy for websites to become embeddable on other websites, and for users to share content that they've created on a site.

Most websites don't naturally look good when embedded at small sizes, so websites create special versions that are designed for embeddability, and the provide users with those URLs.

Iframe embeds: Docs

In its "Publish" dialog, Google Docs provides this HTML for embedding a presentation on your site:

width="410" height="342"></iframe>

Iframe embeds: Calendar

In settings, Google Calendar provides this HTML for embedding a calendar:

width="600" height="400"></iframe>

Iframe embeds: Social widgets

Many social widgets are implemented as tiny iframes.





How we used to do it

Using object/embed tags and plugins: webpage playing Flash video

The problem with that...

Try visiting on an iPad: webpage with blocked Flash video

The new way!

Using HTML5 tags that don't need plugins: webpage playing HTML5 video

Multimedia in HTML5

We now don't need plugins for many types of multimedia!