---
title: "HTML – Meta Tags"
url: https://khanwaseem.com/blog/course/html-meta-tags
author: "khan Waseem"
published: 2023-09-20
updated: 2023-09-20
topics: ["course", "HTML Tutorial"]
description: "Explore HTML meta tags for better web SEO. Learn how to use charset, viewport, and description meta tags effectively for improved search engine visibility."
---

# HTML – Meta Tags

HTML meta tags are essential elements in the head section of a web page that provide information about the page itself and play a crucial role in how search engines and social media platforms understand and display your content. These tags are not visible on the web page but serve various purposes:

**1. <meta charset=”UTF-8″>:** This meta tag specifies the character encoding used in the document, ensuring that text is displayed correctly. UTF-8 is a widely accepted encoding that supports a vast range of characters from different languages.

**2. <meta name=”viewport” content=”width=device-width, initial-scale=1.0″>**: This meta tag is crucial for responsive web design. It sets the viewport width to the device width and ensures that the page scales appropriately on various screen sizes, improving the user experience on mobile devices.

**3. <meta name=”description” content=”Your page description here”>**: The meta description tag provides a concise summary of the web page’s content. It’s often displayed in search engine results, helping users understand what the page is about. It should be brief (under 160 characters) and enticing to encourage click-throughs.

**4. <meta name=”keywords” content=”keyword1, keyword2, keyword3″>**: Although less influential today, the meta keywords tag used to specify relevant keywords related to the page’s content. However, most search engines now rely on content analysis rather than these keywords.

**5. <meta name=”author” content=”Author Name”>**: This tag identifies the author of the web page’s content, which can be valuable for credibility and attribution.

**6. <meta name=”robots” content=”index, follow”>**: The meta robots tag instructs search engine crawlers on how to interact with the page. “index” allows indexing in search results, and “follow” permits following links on the page. Other directives like “noindex” and “nofollow” can be used to control indexing and crawling behavior.

**7. <meta name=”og:title” content=”Title”>**: These Open Graph meta tags are used for social media sharing. They control how the page’s title and description appear when shared on platforms like Facebook, Twitter, and LinkedIn.

**8. <meta name=”og:image” content=”URL to an image”>**: Another Open Graph meta tag, this one specifies the image that should accompany the page when shared on social media.

**9. <meta name=”og:url” content=”URL of the page”>**: This Open Graph tag defines the canonical URL of the page for social media platforms to reference when shared.

**10. <meta name=”twitter:card” content=”summary”>**: Twitter-specific meta tag that defines the card type for Twitter cards, which determine how tweets with the page’s URL appear on Twitter.

These meta tags help improve the accessibility, search engine ranking, and social media sharing of web pages by providing valuable information about the content and how it should be presented to users and search engines.

### Related posts:

[CSS – @ Rules](https://blog.khanwaseem.com/css-rules/)
[HTML – Attributes](https://blog.khanwaseem.com/html-attributes/)
[CSS – Media Types](https://blog.khanwaseem.com/css-media-types/)
[What is DSA? Understanding Data Structures and Algorithms](https://blog.khanwaseem.com/what-is-dsa/)

Powered by [YARPP](https://yarpp.com).