Beginners Guide to Meta Tags in SEO and How to Use Them Effectively

SEO
The current approach to optimizing sites for search engines seems paradoxical. To show your content to people, you need to attract the attention of... machines. To do this, use meta tags, which are inserted in the HTML code of the site. We tell you which of them are most important, which you should use very carefully, and which are out of use.

Beginners Guide to Meta Tags in SEO and How to Use Them Effectively

What Are Meta Tags in SEO?

Meta tags or metadata are small pieces of code that control the actions of search engines and browsers. They contain key commands about how a page is indexed, how it is displayed, and how it is redirected to other links. If you want your site to rank highly in search engines and keep the attention of visitors, each page should have metadata for SEO.

Tags are placed in the first section of the HTML code, labeled <head>. Usually, they are written in the <meta name=”AAA” content=”BBB”> format. AAA — the name of the function used. BBB — a specific command for the search engine or browser.

Tags are not displayed on the page. However, the user can read metadata if they access the source code of your site. Therefore, you should not view them as a way of communicating encrypted messages and jokes — it is very easy to view tags. In addition, you should not write unnecessary content in the <head> header. While this won’t affect indexing or ranking, extra pieces of code may seem suspicious to search engines, increasing the risk of being blocked. 

Why Are SEO Metatags Important? 

Among the metadata are features that directly affect a site’s search engine ranking. If you forget about them or make a mistake, you will automatically miss your chance to rank on the first page of Google. There is a reverse example: some commands make your site unwanted by search engines.

Another group of SEO meta tags affects the user experience (UX). An error in this section will not make you an exile among search engines, but it will worsen the perception of the content. As a result, the visitor will close the page or click the “Back” button faster. In turn, this will lead to a lower ranking. It is a sort of time bomb, which can be hidden in your code.

Tags are an auxiliary tool to ensure that search engines perceive the site correctly. However, they cannot be considered the fundamental basis of SEO. Much more depends on keyword research and the creation of a mass of authoritative links. In addition, metadata also change over time. Some features have lost their importance, while others have gained value. Therefore, it’s essential to keep an eye on the algorithms of popular search engines to always stay up to date.

While meta tags alone won’t drive your site to the top of the rankings, using them incorrectly can throw you off that pedestal. That’s why it’s important to understand each feature, how to use them, SEO best practices, and common mistakes. 

The Most Crucial SEO Metatags 

In modern website optimization, every page should contain metadata. But it’s difficult and unreliable to place them manually on large resources — there is a high probability that you will miss several sections, lowering your overall ranking. Therefore, we recommend using popular tools for automating SEO tagging, such as Yoast, SERPSim, and Ahrefs.

Тег Title 

The title of a page that appears in search results as a link to your site. It is directly used to rank pages, so it is created according to strict rules:

  1. Title tag content should be no longer than 60 characters with spaces. It is also desirable to keep a minimum of 40 characters. Too short and long pieces of text will impair the effectiveness of your SEO strategy.
  2. The text should catch the user’s attention but not abuse it. Intrigue is welcome, and blatant clickbait will be perceived as spam with the corresponding result.
  3. Be sure to include the most important keyword in the heading. However, avoid over spamming. If possible, don’t use the same word twice in the heading.
  4. The title should match the visitor’s intent. If it misleads people, your site’s ranking will inevitably decrease.

Google experts say that every site page should have a unique title that matches its content and target action. Copying the Title can cause some pages to be excluded from search engine indexing.

Practical tips

  1. Make sure that your page has an appropriate SEO tag. If it’s missing, Google will automatically lower its position in the ranking. And even if it somehow makes it to the top of search results, the system itself will select the text fragment it needs. As you can understand, this will not be in your favor, because the preferences of people and robots are too different.
  2. Check the number of Title tags. If you accidentally left more than one title, the system will again make its own decision.
  3. Check the length of the text. The optimal length is 40-60 characters with spaces. If the text is shorter or longer, Google will perceive it as insufficiently informative or too vague.
  4. Check your resource with a specialized crawler. For example, Ahrefs’ Site Audit shows duplicate titles that are hard to spot when you visually view the code. 

Adding Title to the page

The following code snippet is included in the <head> section:

<title>Example of a good site title for a search engine.</title>

Almost all CMSs, including WordPress, Wix, and Squarespace, have a suitable function.

Description Tag 

It is the description of the page, which gives the user details about its content. This website meta tag often includes a call to action, which motivates the user to click a link, read an offer, and take targeted action.

Unlike the Title, the Description is not used in search engine rankings, so you can be a little more creative. However, mistakes in using this tag can have adverse effects on optimization. For example, if you deliberately mislead a user, they will quickly close your site and are unlikely to return. This kind of widespread user behavior will indicate poor UX. In the long run, this will lower the site’s ranking.

Practical tips

  1. The optimal length of the Description is 140-160 characters with spaces. A too short tag is suspicious. A too long one does not fit, so only part of it will be shown in the search results. And as you know, if you remove a few words from a phrase, it can be misrepresented.
  2. Write briefly and precisely. Use a keyword and focus on the user’s intent. Take this element of the code as seriously as keyword research.
  3. Make a unique tag for each page. Although Google doesn’t include this point as a mandatory optimization requirement, multiple repetitions can be perceived as spam and content theft. The results range from lower rankings to a complete ban.
  4. Avoid blatant clickbait. The time for such blatant tools expired with the Web 1.0 era. Their effectiveness is lower than the risk of being banned.

Adding Description to the page 

The following line is included in the original section of the site:

<meta name=”description” content=”Your description meta tag must match page content and apply to users intent. Keep it short, simple, and catchy but avoid any risky clickbaits”>

Robots Tag 

The most important tag for SEO. It contains instructions for search engines to index the page, the need for link analysis, and the use of additional tools. Curiously, in most cases, it is simply not used. Its absence equals the maximum level of permissions — the system will index both this section of the site and the URLs to which it links.

Tag Robots has two functions, each of which can contain two opposite values: index — a signal to index the page, noindex — a ban; follow — confirmation of the quality of links on the page and permission to explore them, nofollow — restriction.

You should understand how to combine these commands. For example, the combination of noindex and follow will prohibit indexing the section of the site but allow the processing of pages to which it links. The search engine can process URLs even if the links also have a noindex tag. 

Practical tips

  1. If the page should be involved in the site ranking, remove the tag Robots or uncheck the appropriate checkbox in the CMS. It is much better than giving permission manually — the risk of making a mistake is much less.
  2. Do not block the indexing of links in the robots.txt file if there are pages with this tag behind them. The search engine will get the wrong command, which will cause confusion.
  3. Be sure to check the presence and value of the Robots tag after your design is complete. Don’t forget to specify the correct commands. This is especially true if you were opening a test version of the page to pre-check it before final publication. 

Adding Robots to the page

If you’re not going to block indexing, just delete the tag — it’s easier and more reliable.

In other cases, attach the following snippet to the code:

<meta name=”robots” content=”noindex, follow”>

The noindex and nofollow values can be reduced to one common command:

<meta name=”robots” content=”none”>

In most CMS, you can access this feature in the Advanced section. 

Googlebot Tag

It is essentially a specific Robots Google meta tag. It allows you to set limits only for one search engine, ignoring its competitors, such as Bing and DuckDuckGo. The need to use it may be related to addressing different target audiences.

If Robots and Googlebot tags conflict, Google search automatically uses more stringent restrictions. For example, between follow and nofollow, the engine will choose the latter option. Googlebot can also use specific commands:

  • nosnippet — banning a snippet of text from being quoted in search results;
  • max-snippet:xx — the maximum length of such a quote in characters with spaces;
  • nositelinkssearchbox — disabling the search box within your site;
  • nontranslate — limitation on automatic translation;
  • nopagereadaloud — disabling text-to-audio translation.

Practical tips 

  1. As in the case of Robots, if you allow a search engine to freely index the page and examine the links, delete the tag immediately.
  2. Avoid conflicting metadata in Googlebot and the Robots.txt file, which can lead to lower rankings and incorrectly show your site in search results.
  3. Only use the tag when you’re 100% sure about what you’re doing. Don’t disable “extra” features without the need. 

Adding Googlebot to the page

Add the following snippet to your HTML code to control indexing:

<meta name=”googlebot” content=”noindex, follow “>

Or:

<meta name=”googlebot” content=”nosnippet”>

Use the following syntax to disable certain features:

<meta name=”google” content=”nositelinkssearchbox “>

Viewport Tag

Instructions on how to show the page on screens of different sizes and resolutions. Google recognizes that this meta tag in HTML for SEO directly affects search engine rankings. It shows that the site is mobile-friendly, which now accounts for more than 60% of all traffic.

The Viewport tag has a double meaning. If it is not used, users by default view the desktop version of the content. Very often, it is not comfortable to read on a small screen, resulting in a high bounce rate. At the same time, it negatively affects the overall rating of the site.

It is worth noting that the mere presence of the Viewport tag does not guarantee the correct display of content. To avoid errors, you should use CSS markup, avoid large objects of fixed size, and thoroughly test the product on different devices. 

Practical tips

  1. Include this tag on all pages to demonstrate their compatibility with mobile devices. This will positively affect your site’s ranking.
  2. If you’re not 100% sure of your actions and their implications, use only standard variables for the Viewport tag.
  3. Use the Mobile Usability report in Google Search Console to verify that your content is displayed correctly. 

Adding Viewport to a page

The function with standard variables looks like this:

<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>

The command width=device-width means that the content is adapted to the actual screen width and resolution. initial-scale=1.0 allows you to set the initial viewing scale on a scale of 0.0 to 1.0, that is, from 0 to 100% in increments of 1%.

Refresh Redirect Tag 

The black-hat HTML meta tag in SEO. Its use automatically reduces the position of the page in Google and Bing search engines. Experts recommend avoiding this element by using modern alternatives. A similar attitude has developed toward the Keywords tag. Its use reduces Google’s ranking and results in an automatic ban in Bing.

The Refresh Redirect tag is used to redirect the request to another page after a certain time. The problem is that it was usually used to redirect users to sites with malicious content or spam. Therefore, modern versions of browsers may not process this command. 

Practical tips

  1. Refuse the Refresh Redirect tag.
  2. Use a 301 or 302 HTTP redirect if you need to redirect the user to the current version of the site. 

Adding Refresh Redirect to a page

If you feel like experimenting with the effect of this tag, you can add the following line to the header:

<meta http-equiv=”refresh” content=”N;url=”https://aaabbb.xyz/”>

N — number of seconds until redirection, url=”https://aaabbb.xyz/ — page URL that will be opened in the user’s browser.

Charset Tag 

It is one of the most crucial meta data in SEO for sites with complex and varied content. It defines the set of characters that will be used to display text. It should definitely be inserted in the code if you are using quotes in non-Latin alphabets.

Without the Charset tag, the browser will automatically replace unfamiliar characters with similar ones it picks up based on the encoding. This almost always leads to errors that impair the UX and are negatively perceived by search engines. The result is a significant decrease in SEO effectiveness.

Even if you are sure that all the text on the site is in Latin characters, you should insert a link to the Unicode UTF-8 character set. You can also use an alternative through ISO-8859-1. Specific character sets are selected on an individual basis. It is important to clarify whether they are supported by popular browsers.

Practical tips 

  1. Place a Charset tag on each page. This will indirectly influence your position on Google and other popular search engines.
  2. Opt for the Unicode UTF-8 set. Statistics show that it is used on 90% of English-language resources.
  3. Choose the correct syntax according to the HTML version. 

Adding Charset to the page

Before you start working with the tag, you need to define the HTML version. It is easy. HTML5 necessarily uses the <!doctype html> identifier. Previous versions don’t have it. The code in the modern HTML5 development environment comes with the following line:

<meta charset=”UTF-8″>

Previous versions, including HTML4, use the equivalent:

<meta http-equiv=”Content-Type” content=”text/html;charset=UTF-8″>

If you need to use a different character set, just specify its code in the variable tag:

<meta charset=”ISO-8859-1″>

SEO Metadata Optimization Checklist 

Knowing what are meta tags in SEO, what they mean, and how to use them correctly will help you get your site on top of search results. To succeed, always check the code of the pages according to the following checklist:

  1. Title is pasted, it is unique, contains the keyword, and meets the user’s intent. Its length is from 40 to 60 characters with spaces.
  2. Description is interesting, it accurately describes the content on the page. The text length is from 140 to 160 characters with spaces. It does not contain risky clickbait.
  3. Robots and Googlebot allow you to index the page and learn content through links if that is your intent. Pages with these tags are not blocked by the Robots.txt file.
  4. Viewport and Charset are present on every page. If you are not familiar with their syntax, leave the standard variable values.
  5. Refresh Redirect and Keywords are missing from your code. They are considered a sign of black-hat SEO and, therefore, automatically lower the site’s ranking and put you at risk of being banned.

Also, remember about other technical optimization tools that do not relate to metadata. Break text into blocks separated by headings. Use alternative text for images and other types of multimedia content. Check the site for double pages and choose among them the canonical version.

However, even with a handy checklist, manual checking will be long, time-consuming, and not always effective. Therefore, we recommend using functional SEO services. For example, the Ahrefs crawler quickly collects information about all the pages of the site, highlights errors, and gives recommendations for fixing them. 

Meta Tags in Technical Optimization: Summary 

HTML meta tags in SEO are a supporting tool that gives permission for the site to be indexed by search engines, briefly characterizes the content on the page, and allows you to display your content correctly. It is essential to remember the importance of each element because writing the code correctly increases the chances of a site reaching the top, while mistakes create the risk of decreasing rankings or even being blocked. But tags are not the essence of SEO or even its most important part. Remember that the success of a website depends on complex optimization, including keyword research, content structuring, link building, and other activities.

FAQ

What are SEO meta tags?

They are short pieces of code required for interaction with search engines and browsers. They determine whether content should be indexed and create rules for displaying it.

Why are meta tags important for SEO?

An error in the tags can lead to a UX decrease, lower site ranking in search results, or even to its banning. The success of your project depends on filling them in correctly.

How do search engines use meta tags?

Metadata gives search engines permission to index a page. If the relevant feature is disabled or conflicts with another piece of code, your site will not be displayed in search results.

Kyryk Oleksandr
SEO Consultant

Subscribe for updates

Categories