Skip to content
AITroveRead. Build. Understand.
Reading list
Make this comfortable

HTML object fallback: offer an alternate route to embedded files

Last updated: 5 Oct 20267 min read
tutorial
IntermediateBy AITrove Editorial

An object element can embed a resource and provide child content as fallback when the resource cannot be used.

When the element earns its place

A quality team embeds a local PDF inspection sheet on a case page. The fallback link gives the same file to browsers that cannot display the embedded document. Keep the download link outside the object too if the team must always be able to save the file; fallback content only appears under specific conditions. The server must send the right media type and authorize access to the case document.

html
<h2>Inspection sheet for case C-47</h2>
<object data="/documents/C-47-inspection.pdf" type="application/pdf" width="720" height="500">
  <p>Preview unavailable. <a href="/documents/C-47-inspection.pdf">Open the inspection sheet PDF</a>.</p>
</object>
<p><a href="/documents/C-47-inspection.pdf" download="C-47-inspection.pdf">Download the PDF</a></p>

Behavior boundary

An embedded PDF is a separate viewing experience with its own controls. Object does not turn PDF text into HTML headings, make it searchable by the application, or guarantee that every browser can render it.

Cost and operational limits

The PDF transfer dominates page cost; embedding it may start a large request before the user needs it. Consider a descriptive link first on slow or document-heavy pages.

Common Mistakes

  • Do not assume fallback text is always visible.
  • Do not omit a direct link when downloading is a core task.
  • Do not expose private files from an unchecked static path.

Connected lessons

html
media
Storage details