Skip to main content

Why are the <head> and <body> tags needed?

The <head> and <body> tags are the two main sections of an HTML document that separate the technical part of the page from its visible content. They work together, but perform different functions.


<head>: the "brain" of the page

The <head> section contains service information that is not displayed directly to the user, but is needed by the browser, search engines, and social networks.

Example:

html
<head> <meta charset="UTF-8"> <title>My site</title> <link rel="stylesheet" href="style.css"> <script src="script.js"></script> </head>

What can be inside <head>:

TagPurpose
<title>The page title (displayed on the browser tab)
<meta>Metadata: encoding, description, keywords
<link>Connecting external files (CSS, icons, etc.)
<style>Inline styles
<script>Connecting or embedding JS code
<base>The base path for all links on the page
<meta name="description">A description for SEO and snippets

Main function: It passes technical data to the browser and search engine: how to read the page, where to get the styles, what kind of content is inside.


<body>: the "body" of the page

This is the part that contains everything the user sees and interacts with: text, images, video, buttons, forms, and so on.

Example:

html
<body> <h1>Welcome!</h1> <p>This is my first site.</p> <img src="photo.jpg" alt="Photo"> </body>

Main function: It displays the visual content of the page: all the content available to the user.


How they work together

The browser first reads <head>: it gets instructions:

"What encoding? Where are the styles? What title? Which scripts to load?"

Then it moves on to <body> and builds the page's DOM tree: everything the user sees.


Summary:

SectionPurposeDisplayed to the user
<head>Metadata, styles, scripts, titleNo
<body>The main content (text, images, buttons)Yes

In simple terms: <head> is instructions for the browser, <body> is content for the person. Without <head>, the page would be unstructured; without <body>, it would be empty.

Short Answer

Interview ready
Premium

A concise answer to help you respond confidently on this topic during an interview.

Why are the <head> and <body> tags needed?: HTML Interview Question