Skip to main content

HTML Head Element

The <head> element is used to define the header section of a web page, which contains information about the document that is not displayed on the page itself.

The <head> element is placed between the <html> tag and the <body> tag.

As an example:

<!DOCTYPE html>
<html>
  <head>
    <!-- metadata and links to external resources -->
  </head>
  <body>
    <!-- visible content -->
  </body>
</html>

The <head> element usually contains one or more of the following tags:

  • <title>: This tag is used to specify the title of the document, which is displayed in the browser's title bar and used by search engines to display the page title in search results.

As an example:

<head>
  <title>My Website - Home</title>
</head>
  • <meta>: This tag is used to provide metadata about the document, such as the character set, keywords, description, author, and other information that may be used by search engines or other applications.

As an example:

<head>
  <meta charset="UTF-8" />
  <meta name="description" content="This is my website." />
  <meta name="keywords" content="web development, HTML, CSS, JavaScript" />
  <meta name="author" content="John Doe" />
</head>
  • <link>: This tag is used to link to external resources, such as stylesheets, icons, or other documents.

As an example:

<head>
  <link rel="stylesheet" type="text/css" href="styles.css" />
  <link rel="shortcut icon" type="image/png" href="favicon.png" />
</head>
  • <script>: This tag is used to include JavaScript code within the document.

As an example:

<head>
  <script src="scripts.js"></script>
</head>
only metadata in head

The <head> element should only contain metadata and links to external resources. All visible content should be placed within the <body> element.