In the past, when discussing the division of web pages into different sections, one of the preferred HTML tools was the frameset element. This element allowed developers to divide the page into multiple segments and for each section, a different HTML document was loaded. However, over time and with the advancement of web technologies, the use of frames has significantly decreased and is currently recognized as an outdated and obsolete method.
However, the reason for this topic is not only its obsolescence. The issues that this element created during loading time, as well as problems related to SEO and accessibility, led most developers to shift towards newer technologies. For instance, nowadays, using CSS and JavaScript can easily design page structures without needing frames for layout.
Framesets are composed of two elements known as frame and frameset. Frames allow you to load different content in varying regions of a single page. For this reason, at that time, developers could create complex layouts using frames. However, with new web systems, this task has become much easier and more convenient.
Even though the frameset element is not officially recognized in HTML5 anymore, understanding it can help you realize the problems faced in the past and how web design has progressed towards more functional structures. In fact, the goal of this article is to familiarize you with this element and explain why you should steer clear of it.
Example Frameset Code
<html>
<head>
<title>Frameset Page</title>
</head>
<frameset cols="50%,50%">
<frame src="page1.html">
<frame src="page2.html">
</frameset>
</html>Description of the Example Code
<html>
This tag denotes the start of an HTML document.
<head>
This tag represents the header section of the HTML document including information about the page.
<title>Frameset Page</title>
The title of the page is specified which will be visible in the browser's title bar.
</head>
This tag ends the header section.
<frameset cols="50%,50%">
This tag indicates that the page will be divided into two columns, each taking 50% of the width of the page.
<frame src="page1.html">
This frame will load the first page named page1.html.
<frame src="page2.html">
This frame will load the second page named page2.html.
</frameset>
This tag ends the frameset division.
</html>
This tag signifies the end of the HTML document.