Embedded Content
Embed maps, documents, and external pages with safe, accessible iframe boundaries.
An iframe places another browsing context inside a page. It is powerful but can add performance, privacy, and security costs, so use it only when direct integration is not practical.
A responsible iframe
map.html
<iframe
src="https://maps.example.com/embed/location"
title="Map showing the workshop location"
width="800"
height="450"
loading="lazy"
referrerpolicy="strict-origin-when-cross-origin"
sandbox="allow-scripts allow-same-origin"
></iframe>
The title names the embedded experience. Intrinsic dimensions reserve space. sandbox removes capabilities, then allows back only what the embed requires.
Other embedding choices
Use object rarely for documents with fallback content. Prefer native audio, video, and img elements for media because their semantics and controls are clearer.
document.html
<object data="/guide.pdf" type="application/pdf" width="800" height="600">
<p><a href="/guide.pdf">Download the guide as a PDF</a>.</p>
</object>
Keep this
Give embeds a title and fallback, restrict permissions, reserve space, and treat every third-party origin as a separate trust boundary.
学习位置已保存在此设备上。