XFrames


XFrames was an XML format draft for embedding HTML pages into one page which handles the layout without the problems of HTML frames. The frames technique was especially popular for navigation bars. While HTML frames are still supported for legacy websites, today’s websites assemble pages by other means.

Differences from HTML frames

Traditional HTML frames, introduced with HTML 4.0, were useful for their ability to combine several distinct web pages into a single view. However, several problems arose from the implementation and as such, frames were removed from the W3C XHTML 1.1 standard. XFrames was supposed to address some of the following problems existent in HTML frames:
  • a web browser's “back” button failing to work intuitively
  • the failure to bookmark or favorite specific documents on the web page easily as well as the inability to send an individual a reference to a specific document or collection
  • getting trapped in a frameset
  • the production of different results at times when a web page containing frames is reloaded
  • the "Page Up" and "Page Down" keys being difficult to use due to the pointer focus being on another frame within the page
  • security vulnerabilities caused by the fact that a user has no way of knowing the original source of each framed document
  • Since frames are not supported by all agents, and the necessary </code> content is not popularly implemented, agents that do not support frames fail to render pages correctly and at the same time prevent any <a href="/wiki/Search_engine_optimization">search engine optimization</a>.</li></ul>XFrames overcomes the bookmarking problem by encoding the population of <a href="/wiki/The_frames">the frames</a> into the URI, thus making it possible to bookmark/add a favorite of <a href="/wiki/A_page">a page</a> successfully.<br><h2>XFrames implementation</h2>Similar to other <a href="/wiki/Markup_languages">markup languages</a>, XFrames supported a <a href="/wiki/Number_of_elements">number of elements</a> and respective attributes. The following is a simple demonstration for the proposed implementation of <a href="/wiki/A_frames">a frames</a> web page:<br><syntaxhighlight lang="xml"><br><frames xmlns="http://www.w3.org/2002/06/xframes/"><br> <head><br> <title>Home Page</title><br> <style type="text/css"><br> #header <br> #footer <br> #nav <br> </style><br></head><br> <group compose="vertical"><br> <frame xml:id="header" source="banner.xhtml"/><br> <group compose="horizontal"><br> <frame xml:id="main" source="news.xhtml"/><br> <frame xml:id="nav" source="nav-menu.xhtml"/><br> </group><br> <group compose="vertical"><br> <frame xml:id="footer" source="disclaimer.xhtml"/><br> </group><br> </group><br></frames><br></syntaxhighlight><br>The <code><frames></code> element acts as the containing <a href="/wiki/Element_of">element of</a> the collection of frames. This collection is what is being referred to as the 'frameset' of a web page. Similarly to <a href="/wiki/XHTML">XHTML</a> and <a href="/wiki/HTML">HTML</a> markup, the <code><head></code> element contains metadata primarily used for <a href="/wiki/Search_optimization">search optimization</a> and document description. The contained <code><style></code> element is used to include any content and layout styling. <code><group></code> groups a single or several frame elements together and can be styled accordingly. If no group style is specified, the <code>compose</code> attribute should be used to specify how the grouped frame elements are to be composed. Lastly, the <code><frame></code> element acts as the placeholder for the content of a web page specified by <a href="/wiki/URL">URL</a> through the <code><a href="/wiki/Source">source</a></code> attribute.<br> </article> </main> <aside> <div class="sidebar-widget"><div class="sidebar-header"><h3>Books</h3></div><ul class="top-10-list"><li><a href="/wiki/Project_Hail_Mary"><span class="rank">1</span> Project Hail Mary <span class="pop-tag">36,266</span></a></li><li><a href="/wiki/Wuthering_Heights"><span class="rank">2</span> Wuthering Heights <span class="pop-tag">19,402</span></a></li><li><a href="/wiki/Gregg_shorthand"><span class="rank">3</span> Gregg shorthand <span class="pop-tag">13,480</span></a></li><li><a href="/wiki/I_Am_Legend_(novel)"><span class="rank">4</span> I Am Legend (novel) <span class="pop-tag">12,851</span></a></li><li><a href="/wiki/The_Count_of_Monte_Cristo"><span class="rank">5</span> The Count of Monte Cristo <span class="pop-tag">9,073</span></a></li><li><a href="/wiki/Dungeon_Crawler_Carl"><span class="rank">6</span> Dungeon Crawler Carl <span class="pop-tag">7,267</span></a></li><li><a href="/wiki/Hamlet"><span class="rank">7</span> Hamlet <span class="pop-tag">7,090</span></a></li><li><a href="/wiki/Tales_of_Dunk_and_Egg"><span class="rank">8</span> Tales of Dunk and Egg <span class="pop-tag">6,985</span></a></li><li><a href="/wiki/Frankenstein"><span class="rank">9</span> Frankenstein <span class="pop-tag">6,907</span></a></li><li><a href="/wiki/Bridgerton_(novel_series)"><span class="rank">10</span> Bridgerton (novel series) <span class="pop-tag">6,598</span></a></li></ul></div><div class="sidebar-widget"><div class="sidebar-header"><h3>Films</h3></div><ul class="top-10-list"><li><a href="/wiki/The_Bride!"><span class="rank">1</span> The Bride! <span class="pop-tag">61,211</span></a></li><li><a href="/wiki/Hoppers_(film)"><span class="rank">2</span> Hoppers (film) <span class="pop-tag">54,919</span></a></li><li><a href="/wiki/XXX_(film_series)"><span class="rank">3</span> XXX (film series) <span class="pop-tag">52,230</span></a></li><li><a href="/wiki/Project_Hail_Mary_(film)"><span class="rank">4</span> Project Hail Mary (film) <span class="pop-tag">48,295</span></a></li><li><a href="/wiki/The_Super_Mario_Galaxy_Movie"><span class="rank">5</span> The Super Mario Galaxy Movie <span class="pop-tag">40,974</span></a></li><li><a href="/wiki/XXX:_Return_of_Xander_Cage"><span class="rank">6</span> XXX: Return of Xander Cage <span class="pop-tag">37,559</span></a></li><li><a href="/wiki/XXX_(2002_film)"><span class="rank">7</span> XXX (2002 film) <span class="pop-tag">37,019</span></a></li><li><a href="/wiki/Scream_7"><span class="rank">8</span> Scream 7 <span class="pop-tag">34,665</span></a></li><li><a href="/wiki/Hamnet_(film)"><span class="rank">9</span> Hamnet (film) <span class="pop-tag">31,978</span></a></li><li><a href="/wiki/With_Love_(2026_film)"><span class="rank">10</span> With Love (2026 film) <span class="pop-tag">30,723</span></a></li></ul></div><div class="sidebar-widget"><div class="sidebar-header"><h3>Programming Languages</h3></div><ul class="top-10-list"><li><a href="/wiki/Python_(programming_language)"><span class="rank">1</span> Python (programming language) <span class="pop-tag">4,412</span></a></li><li><a href="/wiki/C_(programming_language)"><span class="rank">2</span> C (programming language) <span class="pop-tag">4,342</span></a></li><li><a href="/wiki/Scratch_(programming_language)"><span class="rank">3</span> Scratch (programming language) <span class="pop-tag">3,453</span></a></li><li><a href="/wiki/C++"><span class="rank">4</span> C++ <span class="pop-tag">2,263</span></a></li><li><a href="/wiki/JavaScript"><span class="rank">5</span> JavaScript <span class="pop-tag">2,167</span></a></li><li><a href="/wiki/Rust_(programming_language)"><span class="rank">6</span> Rust (programming language) <span class="pop-tag">2,041</span></a></li><li><a href="/wiki/YAML"><span class="rank">7</span> YAML <span class="pop-tag">1,620</span></a></li><li><a href="/wiki/Java_(programming_language)"><span class="rank">8</span> Java (programming language) <span class="pop-tag">1,614</span></a></li><li><a href="/wiki/R_(programming_language)"><span class="rank">9</span> R (programming language) <span class="pop-tag">1,588</span></a></li><li><a href="/wiki/Go_(programming_language)"><span class="rank">10</span> Go (programming language) <span class="pop-tag">1,457</span></a></li></ul></div><div class="sidebar-widget"><div class="sidebar-header"><h3>TV Series</h3></div><ul class="top-10-list"><li><a href="/wiki/One_Piece_(2023_TV_series)"><span class="rank">1</span> One Piece (2023 TV series) <span class="pop-tag">83,678</span></a></li><li><a href="/wiki/Paradise_(2025_TV_series)"><span class="rank">2</span> Paradise (2025 TV series) <span class="pop-tag">53,522</span></a></li><li><a href="/wiki/Young_Sherlock_(British_TV_series)"><span class="rank">3</span> Young Sherlock (British TV series) <span class="pop-tag">43,978</span></a></li><li><a href="/wiki/Bridgerton"><span class="rank">4</span> Bridgerton <span class="pop-tag">40,936</span></a></li><li><a href="/wiki/Love_Story_(2026_TV_series)"><span class="rank">5</span> Love Story (2026 TV series) <span class="pop-tag">39,425</span></a></li><li><a href="/wiki/DTF_St._Louis"><span class="rank">6</span> DTF St. Louis <span class="pop-tag">39,351</span></a></li><li><a href="/wiki/The_Pitt"><span class="rank">7</span> The Pitt <span class="pop-tag">35,417</span></a></li><li><a href="/wiki/Rooster_(TV_series)"><span class="rank">8</span> Rooster (TV series) <span class="pop-tag">30,705</span></a></li><li><a href="/wiki/A_Knight_of_the_Seven_Kingdoms_(TV_series)"><span class="rank">9</span> A Knight of the Seven Kingdoms (TV series) <span class="pop-tag">30,437</span></a></li><li><a href="/wiki/Ted_(TV_series)"><span class="rank">10</span> Ted (TV series) <span class="pop-tag">28,091</span></a></li></ul></div><div class="sidebar-widget"><div class="sidebar-header"><h3>Video Games</h3></div><ul class="top-10-list"><li><a href="/wiki/Resident_Evil_Requiem"><span class="rank">1</span> Resident Evil Requiem <span class="pop-tag">34,490</span></a></li><li><a href="/wiki/Wordle"><span class="rank">2</span> Wordle <span class="pop-tag">32,742</span></a></li><li><a href="/wiki/Pokémon_Pokopia"><span class="rank">3</span> Pokémon Pokopia <span class="pop-tag">29,773</span></a></li><li><a href="/wiki/Crimson_Desert"><span class="rank">4</span> Crimson Desert <span class="pop-tag">13,194</span></a></li><li><a href="/wiki/Roblox"><span class="rank">5</span> Roblox <span class="pop-tag">11,340</span></a></li><li><a href="/wiki/Pokémon_(video_game_series)"><span class="rank">6</span> Pokémon (video game series) <span class="pop-tag">9,154</span></a></li><li><a href="/wiki/Resident_Evil_Village"><span class="rank">7</span> Resident Evil Village <span class="pop-tag">8,614</span></a></li><li><a href="/wiki/Minecraft"><span class="rank">8</span> Minecraft <span class="pop-tag">8,370</span></a></li><li><a href="/wiki/Marathon_(2026_video_game)"><span class="rank">9</span> Marathon (2026 video game) <span class="pop-tag">8,337</span></a></li><li><a href="/wiki/Resident_Evil_7:_Biohazard"><span class="rank">10</span> Resident Evil 7: Biohazard <span class="pop-tag">7,886</span></a></li></ul></div> </aside> </div> <footer> <div class="footer-content"> <div class="footer-info"> <p>&copy; 2026 <a href="https://owiki.org" class="cc-link">OWIKI.org</a>.</p> <p>Content is available under <a href="/wiki/Creative_Commons" class="cc-link">Creative Commons Attribution-ShareAlike 4.0</a> unless otherwise noted.</p> </div> <div class="footer-system"> <p>Status: <span class="status-online">ONLINE</span></p> <p>Version: <span class="protocol-id">1.05</span></p> </div> </div> </footer> <script> const menuToggle = document.getElementById('mobile-menu'); const navLinks = document.getElementById('nav-links'); menuToggle.addEventListener('click', () => { navLinks.classList.toggle('active'); }); </script> </body> </html>