Path // www.yourhtmlsource.comReference → <FRAME> ELEMENT

<frame> element


DEPRECATED: The <frame> element is obsolete and should not be used in modern web development. It was used to define individual frames within a <frameset>. This element has been removed from the HTML specification and is not supported in HTML5. Use <iframe> for embedding content, or CSS Grid/Flexbox for layouts.

Clock This page was last updated on 2025-11-17



Historical Syntax

The <frame> element was used inside a <frameset> to define each frame:

<frameset cols="200,*">
  <frame src="navigation.html" name="nav">
  <frame src="content.html" name="main">
</frameset>

Historical Attributes

These attributes were used with the frame element but are now obsolete:

  • src — URL of the document to display in the frame
  • name — Name of the frame for targeting links
  • scrolling — Whether to display scrollbars (yes, no, auto)
  • noresize — Prevented user from resizing the frame
  • frameborder — Whether to display a border
  • marginwidth — Left and right margins in pixels
  • marginheight — Top and bottom margins in pixels
  • longdesc — URL to a long description of the frame

Problems with Frames

Frames were deprecated for many important reasons:

  • Accessibility Issues — Screen readers and assistive technologies have significant difficulty navigating framed content
  • SEO Problems — Search engines cannot properly index framed sites, and links point to framesets rather than content
  • Bookmarking Broken — Users cannot bookmark specific content because the URL stays the same regardless of which pages are loaded in frames
  • Navigation Confusion — Browser back/forward buttons don’t work intuitively with frames
  • Printing Issues — Printing framed pages is problematic and confusing
  • Mobile Incompatibility — Frames don’t work well on mobile devices
  • Maintenance Complexity — Multiple HTML files must be maintained for a single page view

Modern Alternatives

For page layouts:

  • CSS Grid — Create complex two-dimensional layouts with modern CSS
  • CSS Flexbox — Build flexible one-dimensional layouts
  • Semantic HTML — Use <header>, <nav>, <main>, <aside>, <footer>

For embedding content:

  • <iframe> — Embed external documents with proper security controls
  • Single Page Applications (SPAs) — Use JavaScript frameworks for dynamic content loading
  • AJAX/Fetch API — Load content dynamically without page reloads
  • Server-side includes — Include content at the server level

Example of Modern Layout (CSS Grid):

<style>
  .layout {
    display: grid;
    grid-template-columns: 200px 1fr;
    grid-template-rows: auto 1fr auto;
    min-height: 100vh;
  }
</style>

<div class="layout">
  <header>Header</header>
  <nav>Navigation</nav>
  <main>Main Content</main>
  <footer>Footer</footer>
</div>

This approach is more accessible, SEO-friendly, and easier to maintain than frames ever were.

  • <frameset> — Deprecated container for frame elements
  • <noframes> — Deprecated fallback for non-frame browsers
  • <iframe> — Modern inline frame (recommended alternative)
  • <header> — Page or section header
  • <nav> — Navigation section
  • <main> — Main content area