HTML Meta Tags

HTML meta tags provide metadata about an HTML document. Metadata will not be displayed on the page but will be used by browsers, search engines, and other web services.

Common Meta Tag Attributes

The meta tag can contain various attributes to define the metadata for the HTML document. Below are some common attributes:

Important

Meta tags should be placed within the <head> section of the HTML document.

Try yourself 
        
            <!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Html Tutorial</title>
</head>
<body>
    <h1>Hello world!</h1>
</body>
</html>
Attribute Description Example
name Specifies the name of the metadata. Common values include description, keywords, and author.
Try yourself 
        
            <meta name="author" content="John Doe">
content Provides the value associated with the name or http-equiv attribute.
Try yourself 
        
            <meta name="description" content="This is a description of the webpage.">
http-equiv Provides an HTTP header for the information/value of the content attribute. Common values include content-type and refresh.
Try yourself 
        
            <meta http-equiv="refresh" content="30">
charset Specifies the character encoding for the HTML document.
Try yourself 
        
            <meta charset="UTF-8">
viewport Controls the layout on mobile browsers. It is used to set the width and scaling of the viewport.
Try yourself 
        
            <meta name="viewport" content="width=device-width, initial-scale=1.0">

Examples of Meta Tags

Here are some examples of commonly used meta tags in HTML documents:

Example: Description Meta Tag
Try yourself 
        
            <meta name="description" content="Learn about HTML Meta Tags, their attributes, and how they are used to provide metadata about an HTML document.">

This example provides a brief description of the webpage's content, which can be used by search engines.

Example: Keywords Meta Tag
Try yourself 
        
            <meta name="keywords" content="HTML, Meta Tags, Metadata, HTML Tutorial">

This example provides a list of keywords relevant to the content of the webpage, which can be used by search engines.

Example: Author Meta Tag
Try yourself 
        
            <meta name="author" content="John Doe">

This example specifies the author of the HTML document.

Example: Charset Meta Tag
Try yourself 
        
            <meta charset="UTF-8">

This example specifies the character encoding for the HTML document.

Example: Viewport Meta Tag
Try yourself 
        
            <meta name="viewport" content="width=device-width, initial-scale=1.0">

This example sets the width and initial scale of the viewport, making it responsive on mobile devices.

Important Notes

Here are some important notes and best practices when using the meta tags: