Hackernoon logoHTML Meta Tags And Their Role in Enhancing Your Website's SEO [Explained] by@shahmeer

HTML Meta Tags And Their Role in Enhancing Your Website's SEO [Explained]

Shahmeer Khan Hacker Noon profile picture

@shahmeerShahmeer Khan

Tech writer sharing insights in a fun and informative way.

When it comes to meta tags and metadata, there is often confusion - novices and specialists, both optimize content within the HEAD tag with the META element. Let's see which metadata is really important for SEO optimization, and which can be ignored.

What are meta tags?

Meta tags are used to structure the accompanying data about the page.

Basically, meta tags are designed for robots, browsers, and specialized software so that they correctly "read" and process the information presented. But some meta tags are important to users as well.

For example, the contents of the Title are displayed in the page description on the browser tab, as well as a snippet title in search results.

Metadata is located in the HEAD section along with scripts, styles, and links.

Three groups of meta tags are widely used:

  • NAME

For marketers, site owners, SEO-professionals - those involved in search engine optimization sites and not related to professional development - it is important to remember and consider only the NAME attribute and the tags title, description, robots, keywords, viewport.

SEO Meta Tags


Formally, the title is not a meta tag, but it is placed in the HEAD section, therefore it is most often spoken about with the prefix "meta".

The title is the most important tag for SEO. Fill it out for all pages of the site!

Information from title is taken into account by search engines in determining the relevance of a document. It is not displayed on the page, but is always reflected in the search results, as well as as a title in the browser - this is a fundamental difference from the description (we will talk about it below), the information from which is displayed at the discretion of the search engine.

Title tag syntax:

<title> Page Title </title>

Display title length (characters with spaces):

  1. Google - up to 50-55;
  2. Yandex - up to 45-55.

The title bar has no length, but from an SEO perspective, it’s important that the first 45-50 characters have a complete thought. This will allow users from Yandex / Google search to easily understand what the page is about.

The title should be informative, accurately describe the content of the page, include the main keyword, but without spam.


The description is a meta description of the page. For SEO, this tag is one of the keys.


<meta name = "description" content = "Page Description">

Previously, Google and Yandex, when forming a snippet in the search results, displayed information from description. But the optimizers quickly realized that with the help of description it is possible to manipulate the output. In addition, many site owners dishonestly filled this meta tag: they inserted the first paragraph from the text, copied the title, or ignored it altogether.

As a result, Yandex stopped generating descriptions only on the basis of description - now the entire content of the page is taken into account.

Google still displays the description in the snippet - but on the condition that it is filled out qualitatively. Otherwise, relevant, in the opinion of Google, content from the page will be tightened.

But this does not mean that description has lost its relevance for SEO. Yandex and Google robots still crawl the content of the description and take it into account when determining the relevance of the document.

What is the length of the description meta tag?

You will not find a single word about the length of meta descriptions in the guides for Yandex and Google webmasters. Moreover, the displayed length of descriptions in snippets is constantly changing: for example, in 2017 Google expanded it to as many as 300 characters, and in 2018 it shortened it to 160.

Therefore, when determining the optimal length of the description meta tag, one has to rely on empirical data and common sense.

As of the beginning of 2020, the displayed snippet description length in the search results (in characters with spaces):

Google : desktop search - 135-175; mobile search - 100-120. You can track the average length of the title and description in Google using Google’s SERP - now it is 50 and 169 characters, respectively;

Yandex : desktop search - 160-260; mobile search - 100-160. After clicking on the “read more” link, the description can expand to more than 500 characters.

To make snippets informative, it is better to add the most important information in the first 100-120 characters of the description meta tag, rather than 160-170 - as is commonly believed.

The actual length of the description can exceed 300 and 500 characters - but it makes no sense to spend resources on increasing meta descriptions because users still will not see this information (search engines can perceive it as spam). Better direct your efforts to  SEO-optimization of the content and improving its quality.

How to write a description?

In order for the meta description to help promote the site, follow these rules:

Fill in a unique description for all site URLs (if it is not possible to place meta tags on all pages at once, start from the main page, catalogue pages, the most important products).

The description should be accurate and contain useful information. For example, when describing a product in an online store, indicate its characteristics, purpose, price. A phrase like “buy boots from us because we are the best” is excluded as a description;

do not turn description into a spam list (listing key phrases, especially in direct entry, is unacceptable).

“The presence of meta tags with substandard content may cause the page to be removed from the search results” - Yandex Help


Using this meta tag, you can enable or disable search robots from indexing pages and clicking on posted links.

The robots meta tag can take these values ​​(both Yandex and Google understand them):

  • index (or no index) - allowed (forbidden) page indexing;
  • follow (or no follow) - allowed (forbidden) indexing links 
  • all - an analogue of the simultaneous use of the index and follow;
  • none - an analogue of the simultaneous use of no index and no follow;
  • No archive - the search results will not display a link to a copy stored in the cache.

In addition, there are values ​​(directives) that only individual search engines understand. For example, only Google supports the following directives:

  • No snippet - prohibition of showing page description in search results;
  • max-snippet: [number] - an indication of the maximum description length in the snippet;
  • max-image-preview: [setting] - an indication of the maximum size of images that are displayed in the search results for this page;
  • max-video-preview: [number] - a limit on the duration of the video that is displayed in the search results
  • No translate - prohibition of displaying an option offering to translate a page in search results;
  • No image index - prohibition of indexing images on a page;
  • unavailable_after: [date/time] - prohibition of showing the page in the search results after the specified date and time.

The robots meta tag syntax is:

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

By changing the values ​​of the robots meta tag, you can control indexing, and search engines follow the instructions in this tag, unlike the directives in  robots.txt, which are advisory in nature.

Robots meta tag values ​​are understood by all search engines. You can also set indexing rules only for:

  1. Google - in this case, the Googlebot meta tag is used instead of robots (you can specify the same values);
  2. Yandex - Yandex is indicated instead of robots.

If the robots meta tag is not registered, search engines by default index the page and click on the links to it. If conflicting values ​​are detected, the robots will select the positive one.

For example, if indexing is prohibited with one meta tag, and the second is allowed, then the robot will index the page.


At the dawn of the development of search engines, this meta tag played an important role in ranking. Interestingly, Yandex still takes into account the contents of this meta tag when determining whether a page matches search queries, although in fact, it does not affect keywords positions.

However, Yandex warns that if you fill it with explicit spam - a large number of keywords - this can lead to assimilation of the page or its exclusion from the index.

If you decide to fill out keywords, consider the syntax:

<meta name = "keywords" content = "key 1, key 2, key 3 ..." />

Do not enter more than 10 keywords. In addition, the prescribed keywords must be present in the text of the page.


This meta-tag became especially relevant after the search engines began to consider mobile adaptation as a ranking factor. In normal practice, the SEO specialist is unlikely to have to write this meta tag - this is the task of the template developers. But you still need to know about its existence.

So, if the site is adapted for viewing on mobile, a viewport meta tag of the following type will be registered in the HEAD section:

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

Here, the device-width value of the width attribute instructs the browser to adjust the window width to the width of the device screen. A value of 1 of the initial-scale attribute prohibits window scaling (for example, when the screen is rotated).

Check all meta tags on the site

For competent technical optimization of the site, you do not need to go into the jungle of meta-data. In order to be sure of the correctness of filling out the specified meta-data, I recommend conducting an SEO audit of the site which can be ordered from VFMSEO.

It is enough to know the basic html meta tags for SEO - description, robots, keywords (optional), meta tags for Open Graph markup, title tags, h1-h6, as well as know about the viewport tag. In 99% of cases, this is an exhaustive list of SEO tags.


Join Hacker Noon

Create your free account to unlock your custom reading experience.