Meta Tags in SEO : For Begginers

ABHINAV KRISHNA C S's photo
ABHINAV KRISHNA C S
·

4 min read

Meta Tags in SEO : For Begginers

Table of contents

Meta tags are HTML elements used to provide structured metadata about a web page. They play a crucial role in Search Engine Optimization (SEO) by helping search engines understand the content of a page, influencing how a site appears in search results, and improving click-through rates. This article will cover the various types of meta tags, their uses, and best practices, complete with code examples.

What Are Meta Tags?

Meta tags are snippets of text that describe a page's content; the meta tags don't appear on the page itself but only in the page's code. They exist in the HTML of a document, typically within the <head> section.

Key Meta Tags for SEO

  1. Title Tag

  2. Meta Description Tag

  3. Meta Keywords Tag

  4. Meta Robots Tag

  5. Viewport Meta Tag

  6. Open Graph Meta Tags

  7. Twitter Card Meta Tags

1. Title Tag

The title tag is one of the most important meta tags for SEO. It defines the title of a web page and is displayed on search engine results pages (SERPs) as the clickable headline for a given result.

Code Example:

<head>
    <title>Best Practices for Meta Tags in SEO</title>
</head>

Best Practices:

  • Keep it under 60 characters to ensure it's not truncated in search results.

  • Include primary keywords naturally.

  • Make it compelling to encourage clicks.

How it is displayed in google :

2. Meta Description Tag

The meta description tag provides a brief summary of a web page. Search engines often display this in search results below the title tag.

Code Example:

<head>
    <meta name="description" content="Learn about the best practices for using meta tags to improve your site's SEO and visibility in search engine results.">
</head>

Best Practices:

  • Keep it between 150-160 characters.

  • Include relevant keywords.

  • Make it persuasive to improve click-through rates.

How it is displayed in Google:

3. Meta Keywords Tag

Although the meta keywords tag has lost its significance for most major search engines, it can still be used for minor engines or for internal search purposes.

Code Example:

<head>
    <meta name="keywords" content="SEO, meta tags, search engine optimization, HTML">
</head>

Best Practices:

  • Use a few relevant keywords.

  • Avoid keyword stuffing.

4. Meta Robots Tag

The meta robots tag instructs search engine crawlers on how to index a page and whether to follow the links on the page.

Code Example:

<head>
    <meta name="robots" content="index, follow">
</head>

Best Practices:

  • index, follow: Allow indexing of the page and follow links.

  • noindex, nofollow: Prevent indexing of the page and don't follow links.

  • Use this tag to control which pages search engines should or shouldn't index.

5. Viewport Meta Tag

The viewport meta tag is essential for responsive web design. It helps control how a webpage is displayed on different devices.

Code Example:

<head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>

Best Practices:

  • Use width=device-width to match the screen's width.

  • Use initial-scale=1.0 to set the initial zoom level.

6. Open Graph Meta Tags

Open Graph meta tags are used to control how content is displayed when shared on social media platforms like Facebook.

Code Example:

<head>
    <meta property="og:title" content="Best Practices for Meta Tags in SEO">
    <meta property="og:description" content="Learn about the best practices for using meta tags to improve your site's SEO and visibility in search engine results.">
    <meta property="og:image" content="https://example.com/image.jpg">
    <meta property="og:url" content="https://example.com/meta-tags-seo">
</head>

Best Practices:

  • Ensure all necessary Open Graph tags are included.

  • Use high-quality images for the og:image tag.

7. Twitter Card Meta Tags

Twitter card meta tags enhance the appearance of shared content on Twitter.

Code Example:

htmlCopy code<head>
    <meta name="twitter:card" content="summary_large_image">
    <meta name="twitter:title" content="Best Practices for Meta Tags in SEO">
    <meta name="twitter:description" content="Learn about the best practices for using meta tags to improve your site's SEO and visibility in search engine results.">
    <meta name="twitter:image" content="https://example.com/image.jpg">
</head>

Best Practices:

  • Choose the appropriate card type (e.g., summary, summary_large_image).

  • Ensure the image and text are compelling.

Conclusion

Meta tags are a fundamental part of on-page SEO. Properly optimized meta tags can significantly enhance a site's visibility in search engine results, improve click-through rates, and ensure a better user experience. By understanding and implementing these meta tags correctly, webmasters can ensure their sites are well-optimized for search engines and social media platforms.