Head Tag In HTML

The <head> tag in HTML is a container element that provides meta information about the document, such as the title of the page, the character set being used, CSS stylesheets, and other metadata.

Here's what you need to know about the HTML <head> tag:

  1. The<head> tag must be placed within the <html> tag and appears before the <body> tag.

  2. The <head> tag can contain the following elements:

    • <title>: Specifies the title of the document, which is displayed in the browser's title bar or tab.
    • <meta>: Provides metadata about the document, such as the character set, keywords for search engines, and a description.
    • <link>: Links to external resources, such as CSS stylesheets, favicon, and more.
    • <script>: Includes scripts such as JavaScript, which can manipulate the content of the page.
    • <style>: Defines styles for the document, such as font size and color.

  3. The <meta> tag is used to specify metadata about the document. The most common attributes used with the <meta> tag are charset, name, content, and http-equiv.

    • charset attribute specifies the character encoding for the document.
    • name attribute is used to provide information about the document, such as keywords, description, and more.
    • content attribute provides the value for the information specified in the name attribute.
    • http-equiv attribute is used to send header information to the server, such as redirecting the page, refreshing the page, and more.

  4. The <link> tag is used to link to external resources, such as CSS stylesheets and favicon. The most commonly used attributes are rel, type, and href.

    • rel attribute specifies the relationship between the current document and the linked resource.
    • type attribute specifies the type of the linked resource, such as text/css for CSS stylesheet.
    • href attribute specifies the URL of the linked resource.

  5. The <script> tag is used to include scripts in the document, such as JavaScript. The src attribute is used to specify the source URL of the script.

  6. The <style> tag is used to define styles for the document, such as font size, color, and more. The styles are specified within the <style> tag and can be applied to elements throughout the document.

Here's an example of the HTML <head> tag in use:

<html>
<head>
    <meta charset="UTF-8">
    <meta name="description" content="A tutorial on the HTML head tag">
    <meta name="keywords" content="HTML, head, tag, tutorial">
    <title> HTML Head Tag Tutorial </title>
    <link rel="stylesheet" type="text/css" href="styles.css">
</head>
<body>
    ...
</body>
</html>

In this example, the <head> tag contains the following elements:

  • <meta> with charset attribute specifying the character encoding
  • <meta> with name and content attributes specifying the description and keywords for the document.
  • <title> element with the title of the document.
  • <link> element linking to a CSS stylesheet.

  • It's important to note that the information in the <head> tag is not displayed on the page itself, but provides important information and resources for the document.

    Overall, the <head> tag is a crucial part of any HTML document, providing metadata and resources that help browsers and search engines understand the content of the page. By using the elements and attributes within the <head> tag, you can enhance the accessibility and search engine optimization of your website.