embed

 embed  is code (usually just HTML like an iframe, sometimes with JS) for showing content from another website on your website or inside a post that is included by viewer’s browser and typically has some interactive aspect (more than just a static image / audio / video file).

Why
There are lots of reasons to embed content (transclude if you fancy yourself a fancy hypertexter) from another website into your posts. E.g. some common use-cases:


 * Embedding a tweet as a pull-quote or citation
 * Add a CC-licensed image from Flickr to your post to illustrate a point

How to

 * At a minimum, just use the recommended iframe or similar markup recommended by the person (or service) publishing the original content you want to embed.


 * If you want to explicitly mark up your embeds for discovery, indexing, etc., use h-cite to to indicate the presence of the embed, with at least a  on the element that does the literal embedding of the content, e.g. img or iframe.


 * If you use an  tag to embed, be sure to provide accessible alternative text in its   attribute (see MDN docs, dev opera article) as it’s better for alt text than the   attribute which has other presentational effects.

(actual minimal HTML + h-cite example would be good here)

WARNING:
 * DO NOT use properties like  or   on an embedding element without wrapping it in an h-cite. Doing so associates that content directly with your own , which presumably lists you as a  , thereby erroneously claiming that you took and/or own the content being embedded which is unlikely if you are embedding it from another site.

Examples
Good and interesting examples of embedding

The Guardian
When The Guardian embeds a TikTok video, they show a consent banner in place of the embed, that allows you to opt-in to load that specific TikTok video.



BBC
When the BBC embeds a Tweet (and media from other sites [citation required]), they show a consente banner. You must opt in to load the third-party embedded media before it renders on the page.



tracking
When you embed a resource from a silo inside a post on your site, your are exposing people using your site to being tracked by that silo.

Instagram

 * AVOID Instagram’s embed code because adding it will lower your page ranking due to norobots from IG https://www.seroundtable.com/google-warns-about-instagram-embeds-indexing-28036.html
 * ^^^ more details: https://twitter.com/glenngabe/status/1160881702211936256
 * "Via @johnmu: Switch from normal embedded images to Instagram embeds & see a big drop in image search traffic? That's because IG uses iframes & the meta robots tag using noimageindex. That's a big problem. John tested this & I just ran a quick test too: https://www.youtube.com/watch?v=zm7mn2sGuyw&t=29m38s" @glenngabe August 12, 2019

Twitter
(stub)

As of 2022-??? Twitter tweet embeds show awkward empty blocks when the tweet is deleted.