Table of Contents
HTML meta-tag is used to represent the metadata about the HTML document. It helps search engines to know about the webpages. It specifies page description, keywords, copyright, language, author of the documents, etc.
The metadata does not display on the webpage, but it is read by search engines, browsers, and other web services which scan the site or webpage to know about the webpage.
How to add Meta Tags to Documents(Web page)
Metadata to are added to your web pages by placing <meta> tags inside the header of the document which is represented by <head> and </head> tags.
For Example
<head>
<meta name="description" content="Learn about Programming ,Design and Technology">
<meta name="keywords" content="Techarge, programming,design,technology">
<meta name="author" content="Anup Maurya">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>It can be used more than one times in a document on different pages.
Attributes
| Attribute | Value | Description |
|---|---|---|
| charset | character_set | Specifies the character encoding of an HTML page. |
| content | text | It contains the value of the attribute “name” and “http-equiv” in an HTML document, depending on context. |
| http-equiv | content-security-policy content-type default-style refresh | Provides an HTTP header for the information/value of the content attribute. |
| name | application-name author description generator keywords viewport | Specifies a name for the metadata |
| scheme | format/URL | It specifies the scheme in which metadata is described. (Not Supported in HTML5) |
Some Mostly used HTML <tags> are as follows:
<meta charset="utf-8">
It defines the character encoding. The value of charset is “utf-8” which means it will support to display any language
<meta name="keywords" content="HTML, Python,Java,JavaScript, Tutorials">
It specifies the list of keyword which is used by search engines.
<meta name="description" content="Free Online tutorials">
It defines the website description which is useful to provide relevant search performed by search engines.
<meta name="author" content="authorname">
It specifies the author of the page. It is useful to extract author information by Content management system automatically.
<meta name="refresh" content="50">
It specifies to provide instruction to the browser to automatically refresh the content after every 50sec (or any given time).
<meta http-equiv="refresh" content="50; url=https://techarge.in">
In the above example we have set a URL with content so it will automatically redirect to the given page after the provided time.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
It specifies the viewport to control the page dimension and scaling so that our website looks good on all devices. If this tag is present, it indicates that this page is mobile device supported.
Example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="description" content="Learn about Programming ,Design and Technology">
<meta name="keywords" content="Techarge, programming,design,technology">
<meta name="author" content="Anup Maurya">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="refresh" content="50; url=https://techarge.in">
</head>
<body>
<h1>Example of Meta tag</h1>
<p>This example shows the use of meta tag within an HTML document</p>
</body>
</html>