Meta Tags in 2024: Why are they Important in SEO?

Ashok Sharma

Jan 10, 2024

min read

Meta Tag Definition: What Are Meta Tags?

Meta tags are part of the HTML tags that describe your page content to search engines and website visitors. The Meta tags appear only in the page's code and anyone can check them via source code (Ctrl+U).

In short, Meta tags are key things for all search engines that appear in the HTML code of a website page and tells the search engine what the page is about, and they are the first impression and point of contact for all search engines.

Meta tags added in the <head> section of an HTML web page and they are the “Legally” Hide Words on Your Pages for Search Engines.

Every platform has different solutions for adding Meta tags, just like WordPress has free plugins to choose from. I personally recommend the All in One SEO Pack and Yoast SEO plugins. Both are popular and you can choose any according to your need.

Do Meta Tags matter for SEO in 2024?

Yes, they do, but not all Meta tags can help you in 2024.

In my experience, if you want to rank high in Google in 2024 then you also need to focus on high-quality content and user satisfaction. The main goal of this post is to explain which Meta tags are good to go with and which are simply dead and have no use.

(See below: There are a few tags, we can call them the bad Meta tags and we should simply ignore them.)

John Mueller

Youtube

Meta Tags can affect the way that users see your site in the search results and whether or not they actually click through to your site.

John Mueller

Youtube

Meta Tags can affect the way that users see your site in the search results and whether or not they actually click through to your site.

John Mueller

Youtube

Meta Tags can affect the way that users see your site in the search results and whether or not they actually click through to your site.

How to check Meta tags on a site

If you want to check the Meta tags for any page, just right-click anywhere on the page and select “View Page Source”. You can also use tools like SEMrush (specifically the SEMrush Audit Tool), and Screaming Frog to check the Meta tags on any site.

The Most Important Meta Tags For SEO in 2024

I personally focus on the 8 major Meta tags which can improve the optimization of your startup business or running website.

I am sharing my opinions about them all below:

Title tag
Meta description
Canonical Tag
Alternative text (Alt) Tag
Robots meta tag
Social Media Meta Tags (Open Graph and Twitter Cards)
Responsive Design Meta Tag

Title tag

The Title tag is the very first HTML element that specifies your web page for search engines and to visitors. The Title element supports all browsers including Chrome, Firefox, Safari etc.

Always add your Title tag in the <head> section of your site.

<head>
  <title>This is Title Sample</title>
</head>

Optimal length for the Title tag: Google typically shows 55-64 characters (keep it under 60).

Title tag optimization is important for search engines and visitors. It shows up in the SERP and in Browser Tabs.

Browser Tab Title Tag shown below for Templatemonster post:

Screenshot showing how the page title appears in the browser.

SERP Title Tag shown below for Moti Hamou - Online Marketing Expert:

Screenshot showing how page titles appear in Google search results.

Key Points to write a good Title tag:

Add “modifiers” to your title tag (How to |The current year | Review |Best | Tips | Top |Find | Buy | Easy)
Embed long tail keywords in title tags
Add numbers to your title (9 Important HTML tags for your website to improve your SEO)
Start your title tag with your main targeted keyword
Don't stuff your keywords
Every page should have a unique title tag

Meta description

A Meta Description is an HTML element that summarizes your web page. Search engines typically show the Meta description in search results below your Title tag.

Code sample

<head>
  <meta name="description" content="This is a meta description sample. We can add up to 160 characters.">
</head>

Google does not use the Meta description as a ranking signal; still, it has a massive effect on your Google CTR because it shows up in search results.

In December 2017, Google increased the length of snippets in search results. Now Google confirms it shortened search results snippets after expanding them last December.

What will be the optimum length for Meta Description?

Danny Sullivan

Twitter

There is no fixed length for snippets. Length varies based on what our systems deem to be most useful.” He added, “Google will not state a new maximum length for the snippets because the snippets are generated dynamically.

The new average length of the description snippet field on desktop is at around 160 characters, down from around 300+ characters.

Mobile characters for the search results snippets are now down to an average of 130 characters.

Google-generated Description in search results

Key Points to write a good Meta Description tag:

Don't put emphasis on the number of characters, as Google might pull Meta description text from your content based on a user's query.
Do not add duplicate Meta Descriptions
Add clear Call-to-action (CTA) in your descriptions like Apply today, Check-out, Contact us today etc. See these CTA keywords for marketing campaigns
Add your targeted keywords in descriptions
Strategically provide solutions to a problem
Write for your users and encourage them to click with specific and relevant content
Add any discounts or offers you’ve going on
Show empathy while writing your Meta Descriptions Canonical Tag

The Canonical tag is an HTML link tag with “rel=canonical” attribute that is used if you have a single page URL that has the same content with other multiple page URLs.

By implementing the Canonical tag in the code, we are telling search engines that this URL is the main page and avoid indexing other duplicate page URLs.

A canonical tag Syntax:

<link rel="canonical" href="http://example.com/" />

Where should we choose a canonical URL?

Multiple URLs:

http://www.example.com
https://www.example.com
http://example.com
http://example.com/index.php

Google sees all the above URLs as duplicate versions of the Homepage. And to fix this problem, the canonical tag (rel=canonical) was invented.

Session ID URLs:

These are the automatic system-generated URLs and commonly generated due to the tracking URLs, breadcrumb links and permalinks in CMS

http://example.com/properties/villa-331-luxury-rental?partnerID=18

http://example.com/target.php?session_id=rj3ids98dhpa0mcf3jc89mq1t0

Mobile URL:

When using a special URL (m. example.com) for the mobile version of your website.

SEMrush itself has 2 versions - one is a mobile version and the other is a desktop version. For the mobile and desktop version, SEMrush is using the following canonical tag:

<link rel="canonical" href="https://www.semrush.com/" />

Screenshot from page HTML source that shows the canonical tag.

Alternative text (Alt) Tag

The Alt tag is important for any images, as search engines cannot read them, so you need to add proper Alt text to the images so the search engine can consider them.

Syntax for Alt Text:

<img src=”http://example.com/xyz.jpg” alt=”xyz” />

Key points to consider while creating alt-tags for images:

All images should have informative filenames
Alt text needs to be short clear and to the point
Always use the original, right type of image, as this is an essential step towards success
Create an image sitemap
Use 50-55 characters (up to 16 words) in the alt text
Use an optimal file size without degrading its quality for faster page loading speed

Robots Meta tag

The Robots Meta tag is an HTML tag that provides instructions to web crawlers on whether to index or noindex a web page.

The Robots Meta tag has four main values for search engine crawlers:

FOLLOW –The search engine crawler will follow all the links in that web page
INDEX –The search engine crawler will index the whole web page
NOFOLLOW – The search engine crawler will NOT follow the page and any links in that web page
NOINDEX – The search engine crawler will NOT index that web page

The Robots Meta tag syntax:

<meta name=”robots” content=”noindex, nofollow”> - Means not to index or not to follow this web page. 
<meta name=”robots” content=”index, follow”> - Means index and follow this web page

Note: The robots Meta tag should be placed in the <head> section of your web page.

Social Media Meta Tags (Open Graph and Twitter Cards)

Open Graph Tags:

Open Graph Meta tags are designed to promote integration between Facebook, LinkedIn, Google and the website URLs that you shared on these platforms.

Here is a sample of how Open Graph tags look like in standard HTML:

<meta property="og:type" content="article" /> 
<meta property="og:title" content="TITLE OF YOUR POST OR PAGE" /> 
<meta property="og:description" content="DESCRIPTION OF PAGE CONTENT" /> 
<meta property="og:image" content="LINK TO THE IMAGE FILE" /> 
<meta property="og:url" content="PERMALINK" /> 
<meta property="og:site_name" content="SITE NAME"

Twitter Cards:

Twitter cards work in a similar way to Open Graph, except you add these special Meta tags only for Twitter. Twitter will use these tags to enhance the display of your page when shared on their platform.

Here is a sample of how a Twitter card looks like in standard HTML:

<meta name="twitter:title" content="TITLE OF POST OR PAGE"> 
<meta name="twitter:description" content="DESCRIPTION OF PAGE CONTENT"> 
<meta name="twitter:image" content="LINK TO IMAGE"> 
<meta name="twitter:site" content="@USERNAME"> 
<meta name="twitter:creator" content="@USERNAME">

How both Social Media Meta Tags look like:

Screenshot with how Twitter cards appear in the webpages' HTML source.

Header tags

A Header tag is used for headings creations, i.e. by using these we can apply font changes.

The heading elements are H1, H2, H3, H4, H5, and H6 with H1 being the highest (or most important) level and H6 the least.

Here is an example of how we can use header tags taken from SEMrush:

<h1> 9 Tips for Boosting the Speed of your Shopify Website </h1> 
<p>Paragraph of content</p> <p>another paragraph of content</p> 
<h2>Performance Analysis</h2> 
<p>Paragraph of content</p> 
<h3>Analyzes the Mobile and Desktop Performance with PageSpeed Insights</h3>

Responsive Design Meta Tag

The final important Meta tag is the Responsive Design Meta tag, which we call “Viewport Meta Element”. By using the viewport meta tag we can control layout for web pages on mobile browsers.

This viewport element is included in the head section of your web page.

Syntax:

<meta name="viewport" content="width=device-width,initial-scale=1">

If you want to learn more about this responsive design Meta tags, head over to this nicely written post.

Note: Do not use this responsive Meta tag if your website pages are not responsive, as it will make the user experience worse.

Meta Tags to ignore

Finally, there are a few tags - we can call them bad Meta tags and we should simply ignore them:

Keywords tag- Google does not use the keywords Meta tag in web ranking. - Source
Revisit after – This HTML tag is a command to robots to return to a page after a specific period. This tag is not followed by any major search engine and has no value in SEO. It is better to avoid this tag and leave it to the search engines to decide how to crawl your website. Syntax: <meta name="revisit-after" content="7 days" />
Expiration/date – This tag defines the expiration date of your page. Personally I would not recommend this, just remove this if you are using it. Syntax: <meta http-equiv="Expires" content="Fri, 28 January 2024 23:59:59 GMT">
Site verification- Just ignore this. You can verify your site using Google Search Console and Bing Webmaster tool.
Copyright- Every site puts their copyright in the footer, so you don't need a separate tag. A big NO for this tag.
Distribution – The "distribution" value is supposedly used to control who can access the document, typically set to "global". It's inherently implied that if the page is open (not password-protected, like on an intranet) that it's meant for the world. Go with it, and leave the tag off the page. - Source
Generator – Useless tag.
Cache control –This tag allows web publishers to define how often a page is cached. Generally, these are not required; we can simply use the HTTP header instead of this HTML tag.
The ODP Robots Meta Tag - Google no longer follows this Meta tag. -Source
Geo Meta Tag - Google does not use Geo Meta tags to rank pages. - Source

So these are the few HTML tags which we should consider or simply ignore. Now you can easily use the relevant HTML Meta tags intelligently.

Don’t forget to comment below and share your views on HTML Tags. Thanks for reading!

Note: The opinions expressed in this article are the views of the author, and not necessarily the views of Caphyon, its staff, or its partners.

Article by

Ashok Sharma

Ashok Sharma is a writer, blogger, Digital marketer and social media enthusiast. He helped businesses gain more traffic and online visibility through technical, strategic SEO and targeted PPC campaigns. Connect him on LinkedIn and follow him on Twitter for a quick chat.