The <meta> tag in HTML is used to provide metadata about the webpage.
Metadata is information about the document that is not displayed on the page but helps browsers, search engines, and social media understand and handle the page properly.
Common Uses of <meta>
-
Character Encoding
- Specifies the character set for the document.
<meta charset="UTF-8"> -
Viewport Settings
- Controls layout on mobile devices for responsive design.
<meta name="viewport" content="width=device-width, initial-scale=1.0"> -
Page Description
- Provides a summary for search engines (SEO).
<meta name="description" content="This is an example webpage."> -
Keywords
- Optional keywords for SEO (less important today).
<meta name="keywords" content="HTML, CSS, JavaScript"> -
Author
- Specifies the author of the document.
<meta name="author" content="John Doe"> -
Refresh or Redirect
- Refresh page or redirect after a certain time.
<meta http-equiv="refresh" content="5;url=https://example.com"> -
Social Media / Open Graph Tags
- Helps control how content appears when shared.
<meta property="og:title" content="Example Page"> <meta property="og:description" content="Description for social media.">
Example
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Learn the purpose of meta tags in HTML">
<meta name="author" content="John Doe">
<title>Meta Tag Example</title>
</head>
💡 In Short:
The
<meta>tag provides hidden information about the page for browsers, SEO, and social media, helping the page render correctly and be discoverable.
