Document Structure Elements

Explore HTML Document Structure Elements, that define the foundational layout and structure of any web page.

Loading...
Document Structure Elements

Document Structure Elements organize the layout and hierarchy of an HTML page, making it easier for browsers and search engines to understand your content. They improve SEO by providing semantic meaning to different parts of the page.

Common elements:

html

The <html> element contains all the information and content of the web page.

<!DOCTYPE html>
<html lang="en">
 <head>
  <!-- Meta information about the page -->
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>HTML Elements</title>
 </head>
 <body></body>
</html>

The <html> element includes both opening (<html>) and closing (</html) tags.

The <head> HTML element consists of the information about the HTML document, i.e. title of the page, character set, version of HTML, styles, scripts, and other meta information.

<!DOCTYPE html>
<html lang="en">
 <head>
  <!-- Metadata and external links (like stylesheets) -->
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>HTML Elements</title>
 </head>
 <body></body>
</html>

The <head> HTML element includes both opening (<head>) and closing (</head>) tags.

title

The <title> HTML element is used to define the title of the HTML document, and it is shown in the browser's title bar or in the page's tab.

Note: The title must be text-only.

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>HTML Elements</title>
 </head>
 <body></body>
</html>

The <title> HTML element includes both opening (<title>) and closing (</title>) tags.

body

The <body> HTML element represents the content of an HTML document.

<!DOCTYPE html>
<html lang="en">
 <head>
  <meta charset="UTF-8" />
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
  <title>HTML Elements</title>
 </head>
 <body>
  <!-- Everything you want to display on the web page goes into the body part -->
 </body>
</html>

There can be only one <body> element in a document.

The <body> HTML element includes both opening (<body>) and closing (</body>) tags.