HTML Meta Data

HTML Meta Tags are snippets of code that provide information about a web page to search engines and browsers. They are located in the head section of an HTML document, and are not visible to users when they view the page.

There are several different types of meta tags, but some of the most common include:

  • meta charset: Specifies the character encoding used by the document. This is typically set to UTF-8 to support a wide range of characters.
  • meta name="description": Provides a brief summary of the content of the page. This information is often displayed in search engine results as a snippet.
  • meta name="keywords": Specifies a list of keywords relevant to the page. This tag used to be more important for search engine optimization (SEO), but it is now considered less important.
  • meta name="viewport": Determines how the page is displayed on mobile devices. This tag specifies the width of the viewport and allows the page to be scaled to fit the screen.
  • meta name="author": Specifies the author of the page.
  • meta http-equiv: Allows for additional HTTP header information to be included in the tag. Common uses include specifying the content type or setting a refresh rate for the page.

Here's an example of how to use some of these meta tags in an HTML document:

<!DOCTYPE html>
    <html>
    <head>
      <meta charset="UTF-8">
      <meta name="description" content="This is a sample page.">
      <meta name="viewport" content="width=device-width, initial-scale=1.0">
      <title>My Page</title>
    </head>
    <body>
      <h1>Welcome to my page</h1>
      <p>This is some sample content.</p>
    </body>
    </html>

In this example, we've included the meta charset tag to specify the character encoding, the meta name="description" tag to provide a brief summary of the page content, and the meta name="viewport" tag to ensure that the page displays correctly on mobile devices.