Simple Guide to Meta Tags for SEO Beginners

What are meta tags?

Meta tags are the important Page-level HTML tags defined inside the head tags in an HTML Document. These tags control the crawling, indexation, online presence of a website and webpages in Search engine results.

These tags are also majorly used to provide information about your site to search engines and users.

Google also uses another method called inline directives to control your site’s online presence.

Why Meta tags?

These Meta tags are important in Search Engine Optimization (SEO) to improve page positions and overall user experience.

Meta tags are added to a page in two ways:

Inline directives
Page-Level Meta Directives

Inline directives:

Addition of data-nosnippet HTML attribute to HTML Tags like span div, the section can exclude parts of the HTML Page from snippets.

<p>  <span data-nosnippet>This part will not be show in snippets</span> </p>

Page-level Meta Directives:

Page-Level Meta Directives offer website owners an easy way to provide the much important information about a page to search engines. These Meta tags are added to a webpage in between <head>…</head> tags.

Example:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Title of the Page</title>
    <meta name="Description" CONTENT="Summary of Page">
    <meta name="google-site-verification" content="site-verification-code"/>
    <meta name="robots" content="noindex,nofollow">
  </head>
</html>

Important Meta Tags in SEO:

Title Tag:

Title of the page in less than 60 characters.

Syntax:

<title>Title of Your Page <title>

Meta description:

Explains the synopsis or summary of the webpage content in less than 160 characters.

Syntax:

<meta name="description" content="replace it with your content">

Meta Author:

Author of the webpage

Syntax:

<meta name="author" content="your author name">

Meta Language:

Language in which it is written.

Syntax:

<meta name="language" content="Language code">

Meta Viewport:

Tells the browser how to display a webpage on different kinds of devices based on their viewport size. This indicates the mobile-friendliness of a site.

syntax:

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

Meta robots:

These Meta robots directives provide a great way for website owners to control the webpage indexation and appearance in SERPs. It also provides directives to pass or not to pass link authority to other pages.

syntax:

<meta name="robots" content="index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1" />

Some Important Meta Robots Directives:

INDEX, FOLLOW:

This is the default combination of meta directives, and there is no need to mention it explicitly.

INDEX: This Directive tells search engines to index and crawl the page.

FOLLOW: This Directive tells search engines to pass the link authority to other links on the page.

Syntax: <meta name=”robots” content=”index, follow” />

NOINDEX, NOFOLLOW:

These directives indicate crawlers not to index the page and not to follow links on the page. It should be mentioned explicitly.

<meta name=”robots” content=”noindex, nofollow” />

Some Other less used meta directives:

NOIMAGEINDEX:

This Directive disables crawlers from indexing images on the page.

Syntax:

<meta name=”robots” content=”noimageindex” />

NOARCHIVE:

This meta directive prevents search engines from displaying the cached version of the page in the search engine results page(SERPs).

Syntax:

<meta name=”robots” content=”noarchive” />

NOTRANSLATE:

This directive prevents search engines from showing the translated version of a page.

<meta name=”robots” content=”notranslate” />

NOSNIPPET

This meta directive stops displaying video or text snippets of the page in search engine results.

Syntax:

<meta name=”robots” content=”nosnippet” />

Note: Generally, snippets of the webpage are taken from its meta description.

MAX-SNIPPET:

This Directive limits page’s text snippet to the specified maximum number of characters. Below syntax limits, page snippet text characters to 60.

Syntax:

<meta name="robots" content="max-snippet:60" />

MAX-SNIPPET:0

This directive directs search engines not to show page snippets. It is the same as NOSNIPPET Directive as mentioned above.
Syntax:

<meta name="robots" content="max-snippet:0" />

MAX-SNIPPET:-1:

It is a default meta directive that allows search engines to decide page snippets length as they intended.

Syntax:

<meta name="robots" content="max-snippet:-1" />

MAX-IMAGE-PREVIEW:

It allows website owners to specify the maximum image preview for a webpage with given three possible values standard, large, and none.

MAX-VIDEO-PREVIEW:

It allows website owners to specify the maximum for the preview length of videos on a webpage.

Google Special Tags :

NOSITELINKSSEARCHBOX:

This google meta directive prevents search engines from displaying direct sitelinks in SERPs.

Syntax:

<meta name="google" content="nositelinkssearchbox" />

NOPAGEREADALOUD:

Disallows Google Text-to-Speech (TTS) Services from reading out the webpages using TTS Service.

Syntax:

<meta name="google" content="nopagereadaloud" />

GOOGLE-SITE-VERIFICATION:

To verify the ownership of your website for the Google search console

Syntax:

<meta name="google-site-verification" content="..." />