Cover Image for HTML meta Tag
89 views

HTML meta Tag

The HTML <meta> tag is used to provide metadata about an HTML document. It contains information about the document itself, such as character encoding, viewport settings, authorship, keywords, and more.

Here’s an example of how the <meta> tag can be used:

HTML<span role="button" tabindex="0" data-code="<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="This is a website about coding tutorials."> <meta name="keywords" content="HTML, CSS, JavaScript, coding, tutorials"> <meta name="author" content="John Doe"> <title>Coding Tutorials</title> </head> <body> <!– Content of the webpage goes here –> </body>
<!DOCTYPE html>
<html>
     <head>
          <meta charset="UTF-8">
          <meta name="viewport" content="width=device-width, initial-scale=1.0">
          <meta name="description" content="This is a website about coding tutorials.">
          <meta name="keywords" content="HTML, CSS, JavaScript, coding, tutorials">
          <meta name="author" content="John Doe">
          <title>Coding Tutorials</title>
     </head>
    <body>
           <!-- Content of the webpage goes here -->
    </body>
</html>

In the above example, several <meta> tags are used within the <head> section of an HTML document. Here’s a breakdown of each <meta> tag:

  • <meta charset="UTF-8">: Specifies the character encoding for the HTML document, ensuring proper rendering of special characters.
  • <meta name="viewport" content="width=device-width, initial-scale=1.0">: Defines the viewport settings for responsive design, adjusting the layout based on the device’s screen size.
  • <meta name="description" content="This is a website about coding tutorials.">: Provides a brief description of the webpage’s content for search engines and social media.
  • <meta name="keywords" content="HTML, CSS, JavaScript, coding, tutorials">: Specifies relevant keywords or phrases that relate to the webpage’s content for search engine optimization (SEO).
  • <meta name="author" content="John Doe">: Indicates the author or creator of the webpage.

These <meta> tags help search engines, browsers, and other tools understand and process information about the webpage. They provide essential metadata for search engine optimization, accessibility, and proper rendering on different devices.

It’s important to note that <meta> tags do not have a visible effect on the webpage’s content. Instead, they provide metadata that aids in search engine indexing, social media sharing, and other behind-the-scenes processes.

The usage of <meta> tags can vary depending on the specific requirements of your webpage. You can include additional <meta> tags for specific purposes, such as specifying the language, setting refresh intervals, or defining Open Graph metadata for better social media sharing.

Properly utilizing <meta> tags enhances the overall usability, accessibility, and visibility of your HTML documents.

YOU MAY ALSO LIKE...

The Tech Thunder

The Tech Thunder

The Tech Thunder


COMMENTS