Meta tags are snippets of code that inform search engines essential details about your net page, resembling how they need to show it in search outcomes. They additionally inform net browsers the way to show it to guests.

Every net page has meta tags, however they’re solely seen within the HTML code.

In this information, you’ll learn to use, and to not use, the six most essential meta tags for web optimization:

  1. Meta title
  2. Meta description
  3. Meta robots
  4. Meta refresh redirect
  5. Meta charset
  6. Meta viewport

This is the page title that Google and most different search engines present in search outcomes.

Title tag in Google’s search outcomes.

Sidenote.

Google doesn’t at all times present the title tag. It typically exhibits one thing completely different.

Why it’s essential for web optimization

Google explains it finest:

Titles are important to giving customers a fast perception into the content material of a outcome and why it’s related to their question. It’s usually the first piece of knowledge used to determine which outcome to click on on, so it’s essential to make use of high-quality titles in your net pages.

Best practices

  • Write a novel title tag for every page;
  • Be temporary, however descriptive;
  • Avoid generic and obscure titles;
  • Use sentence case or title case;
  • Create one thing click-worthy—not clickbait;
  • Match search intent;
  • Include your goal key phrase the place it is sensible;
  • Keep it beneath 60 characters.

Recommended studying: How to Craft the Perfect web optimization Title Tag (Our 4-Step Process)

How so as to add a title tag to your page

Paste the code under into the <head> part of your page:

<title>This is the title of the page.</title>

If you’re utilizing WordPress, set up an web optimization plugin like Yoast. You ought to see a spot to set the title tag on the page or publish editor.

1580973311 555 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Adding a title tag in WordPress with Yoast.

Other CMS’ like Squarespace and Wix have comparable performance built-in.

How to search out and repair widespread title tag errors

There are 4 widespread points with title tags:

  1. Too lengthy/brief. Google says to “avoid unnecessarily long or verbose titles” whereas conserving them “descriptive and concise.”
  2. Doesn’t exist. Google says that each page ought to have a title tag.
  3. Multiple title tags on one page. Search engines might show an undesirable title tag if there’s a couple of on a page.
  4. Duplicate titles throughout a number of pages. Google says that “it’s important to have distinct, descriptive titles for each page on your site.”

To test a page for the primary two points, plug the URL right into a free software like SERPSim.

If it doesn’t pull a title again, then you should add one.

1580973311 715 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

If the pixel size rely is pink, then it wants shortening.

1580973311 118 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

To test for duplicate and a number of title tags, crawl your web site with Marketing Media Wizard’ Site Audit.

From there, test the On page report for “Multiple title tag” errors:

1580973311 602 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Fix these by eradicating one of many tags from the affected pages.

Next, go to the Duplicate content material report and search for title tags with “Bad duplicate” errors:

1580973311 527 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Rewrite the title tags on affected pages to make them distinctive.

Note that this similar report additionally exhibits pages with title tags which are too lengthy, too brief, lacking, or empty.

1580973311 905 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

The meta description summarizes the page’s content material. Search engines usually use it for the snippet in search outcomes.

1580973312 177 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Meta description tag in Google’s search outcomes.

Sidenote.

 Google doesn’t at all times present the meta description you set. Sometimes they present a distinct snippet. 

Why it’s essential for web optimization

Google explains it finest as soon as once more:

A meta description tag ought to usually inform and curiosity customers with a brief, related abstract of what a selected page is about. They are like a pitch that convinces the person that the page is strictly what they’re in search of.

Meta descriptions, nevertheless, are not a direct rating issue. Google says:

Even although we typically use the outline meta tag for the snippets we present, we nonetheless don’t use the outline meta tag in our rating.

Best practices

  • Write a novel description for every page;
  • Try to summarize content material precisely;
  • Avoid generic descriptions;
  • Use sentence case;
  • Create one thing click-worthy, not clickbait;
  • Match search intent;
  • Include your goal key phrase the place it is sensible;
  • Keep it beneath 160 characters

Recommended studying: Boost your website traffic fast with a simple 5‑minute SEO task

How so as to add a meta description to your page

Paste the code under into the <head> part of your page:

<meta identify="description" content material="Place the meta description text here.">

If you’re utilizing WordPress, you are able to do this simply in Yoast.

1580973312 758 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Adding a meta description in WordPress with Yoast.

Other CMS’ like Squarespace and Wix have comparable performance.

How to search out and repair widespread meta description errors

The 4 widespread points with meta descriptions are the identical as these with title tags:

  1. Too lengthy/brief. Google says “there’s no limit on how long a meta description can be, but the search result snippets are truncated as needed, typically to fit the device width.”
  2. Doesn’t exist. Google says to “make sure that every page on your site has a meta description.”
  3. Multiple meta descriptions on one page. More than one tag might confuse search engines.
  4. Duplicate meta descriptions throughout a number of pages. Google says that it is best to “differentiate the descriptions for different pages.”

Check for the primary two errors on a page-by-page foundation with SERPSim or Yoast.

Crawl your web site with Marketing Media Wizard’ Site Audit and test the On page report back to test for the primary three errors throughout all pages.

1580973312 935 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Check the Duplicate content material report for duplicate meta descriptions throughout pages.

Use the identical fixes as with title tags.

The meta robots tag tells search engines if and the way they need to crawl your net pages.

Syntax

<meta identify=”robots” content material="index, follow">

Why it’s essential for web optimization

Using the incorrect attributes within the meta robots tag can have a catastrophic affect in your web site’s presence within the search outcomes. Your web optimization efforts depend on you understanding this tag and utilizing it successfully.

With that in thoughts, listed here are the values you need to use on this tag:

  • index: tells bots to index the page;
  • noindex: tells bots to not index the page;
  • observe: tells bots to crawl hyperlinks on the page, and that you just additionally vouch for them;
  • nofollow: tells bots to not crawl hyperlinks on the page, and that no endorsement is implied.

You can mix these in any of the next methods:

<meta identify=”robots” content material="noindex, nofollow">
<meta identify=”robots” content material="index, follow">
<meta identify=”robots” content material="noindex, follow">
<meta identify=”robots” content material="index, nofollow">

You may use <meta identify=”robots” content material="none">, which is identical as index, observe. Not setting a meta robots tag can be equal to index, observe.

Sidenote.

Google sees “nofollow” tags as hints, not directives. There are different attributes resembling noarchive, noimageindex, nosnippet, and so on. But as these are extra superior values, we’re not going to speak about them on this publish.

Best practices

  • Use meta robots tags solely whenever you wish to prohibit the way in which Google crawls a page;
  • Don’t block pages with meta robots tags in robots.txt;

Recommended studying: Robots Meta Tag & X‑Robots-Tag: Everything You Need to Know

How so as to add a meta robots tag to your page

Paste the suitable code above into the <head> part of your page.

In WordPress, use Yoast’s superior settings to set meta robots tags:

1580973312 213 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Meta robotic choices in Yoast.

Most CMS’ have comparable choices built-in.

How to diagnose and repair widespread meta robots errors

There are three widespread errors with meta robots:

  1. Noindexed pages blocked by robots.txt. This prevents Google from seeing the noindex robots tag, so they could nonetheless index the URL.
  2. Rogue meta noindex. This prevents Google from indexing the page, so it’ll get no natural site visitors.
  3. Rogue meta nofollow. This prevents Google from crawling the hyperlinks on the page, which could forestall the invention and indexing of essential content material. It additionally prevents the circulate of PageRank to these pages—which is probably not fascinating.

You can test for the primary two points utilizing the Coverage report in Google Search Console.

To discover listed pages that could be set to meta robots noindex, hit the “Valid with warnings” tab and search for “Indexed, though blocked by robots.txt” warnings:

1580973313 546 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Check the supply code of those pages for a meta robots noindex tag. Remove both the robots.txt block or meta robots noindex tag relying on what you’re attempting to do.

To discover rogue meta robots noindex tags, hit the “Excluded” tab and search for pages “Excluded by ‘noindex’ tag”:

1580973313 206 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Remove the robots meta tag from any pages that ought to be listed.

To discover pages with rogue meta robots nofollow tags, crawl the positioning with Marketing Media Wizard’ Site Audit and test the Indexability report for “Nofollow page” warnings.

1580973313 912 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Remove the tag until you particularly need search engines to not crawl the hyperlinks on the page.

Sidenote.

There are few points not coated right here, resembling having pages with noindex tags in your sitemap. To study extra about these points, try the Indexability report in Marketing Media Wizard’ Site Audit.

A meta viewport tag units the seen space of an online page. It is used to instruct the browser the way to render the page on completely different display screen sizes (i.e., desktop/pill/cell).

Why it’s essential for web optimization

Google says that the “presence of this tag indicates to Google that the page is mobile-friendly.” This issues as a result of Google ranks mobile-friendly net pages greater in cell search outcomes as of 2015.

Here’s what a page may appear like on cell with and with no meta viewport tag:

Many individuals possible hit the again button when the desktop model of a page masses on cell. It’s annoying and makes issues arduous to learn. This might ship damaging alerts to Google and inform them there’s one thing undesirable about your page.

Sidenote.

The viewport tag isn’t all that’s wanted to make a web site mobile-friendly. Your web site additionally must make use of responsive design. 

Best practices

  • Use meta viewport tag on all net pages;
  • Use the “standard” tag until you already know what you’re doing (see under)

How so as to add a meta viewport tag to your page

Paste the code under into the <head> part of your webpage:

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

Note that the content material attribute doesn’t must be set to width=device-width, initial-scale=1.0, however that is the most typical implementation—and the proper one for many pages.

How to diagnose and repair widespread meta viewport errors

Because most CMS’ and themes set the viewport mechanically, tag-related points are unusual on most fashionable web sites.

That stated, you’ll be able to test for points utilizing the Mobile Usability report in Google Search Console.

This exhibits pages with usability points on cell units. If this situation is even partly all the way down to the shortage of a viewport meta tag, it should present the “Viewport not set” error.

1580973313 368 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Fix this situation by including the suitable meta viewport tag to any affected pages.

IMPORTANT

Adding a meta viewport tag received’t repair underlying cell show points attributable to CSS kinds not written for various widths. If including a meta viewport tag doesn’t remedy issues, seek the advice of a developer.

Don’t use Google Search Console?

Meta viewport is sort of at all times set on the site-level and is often hardcoded into the theme.

Use Google’s Mobile-Friendly Test tool to test your homepage for a meta viewport tag.

1580973313 130 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

If the tag isn’t in your homepage, it in all probability isn’t anyplace else in your web site.

Note that that is removed from a foolproof technique, and it is best to at all times use Google Search Console if potential.

The meta charset tag units the character encoding for the online page. In different phrases, it tells the browser how the textual content in your net page ought to be displayed.

There are tons of of various character units, however the two most typical on the net are:

  • UTF‑8 — Character encoding for Unicode;
  • ISO-8859–1 — Character encoding for the Latin alphabet.

See a full checklist here.

Why it’s essential for web optimization

Using the incorrect character encoding could cause some characters to show incorrectly within the browser.

1580973313 196 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Example of characters displaying incorrectly as a consequence of charset points.

Character formatting points are dangerous for person expertise and might trigger your pages to look fairly damaged.

That can result in web optimization issues like:

  • People not eager to hyperlink to your page.
  • High bounce price, low time on page, and low dwell time.
  • Search engines not understanding your content material.

But let’s be actual about this:

Unless your page is severely damaged on account of charset points, which is unlikely, the affect goes to be fairly minimal.

Still, it’s price noting that Google recommends utilizing Unicode/UTF‑Eight the place potential.

Best practices

  • Use the meta charset tag on all webpages;
  • Use UTF‑Eight the place potential;
  • Use the proper syntax in your HTML model (see under).

How so as to add a meta charset tag to your net page

Paste the code under into the <head> part of your webpage:

<meta charset=UTF-8">

If you’re utilizing HTML4 or under, use this code as an alternative:

<meta http-equiv="Content-Type" content="textual content/html;charset=UTF-8">

If you’re uncertain which model of HTML you’re utilizing, test your supply code for <!doctype html>. If it’s there, you’re utilizing HTML5.

How to diagnose and repair widespread meta charset errors

Most web sites use both UTF‑Eight or ISO-8859–1 character encoding.

The former is preferable to the latter.

For that motive, it’s price checking for pages in your web site that don’t use UTF‑Eight encoding. You can do that in Marketing Media Wizard’ Site Audit. Go to the Page Explorer, then use these settings:

1580973314 220 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

If the search returns any outcomes, test every of them manually for character encoding points.

Switch to UTF‑Eight encoding if potential. That might remedy the problem, however not at all times. However, in the event you don’t set meta charset in any respect, the browser will likely be pressured to guess and will present rubbish textual content to customers. This article explains more.

A meta refresh tag tells the online browser to redirect the person to a distinct URL after a set period of time.

Why it’s essential for web optimization

Meta refresh redirect tags are essential for web optimization within the sense that you shouldn’t use them, regardless that Google understands and respects them.

There are just a few causes for this:

  • Not supported by all browsers;
  • Can be complicated to the person (and lift safety considerations);
  • Pages want parsing earlier than they see the vacation spot URL, which might take a while.

Another potential situation arises when there’s no canonical tag current on the page, as John Mueller explains in this tweet:

Best practices

  • Avoid meta refresh redirect tags until completely essential;
  • Use a 301 redirect as an alternative.

How so as to add a meta refresh redirect tag to your page (if you really want to)

Paste the code under into the <head> part of your page:

<meta http-equiv="refresh" content="5;url="https://example.com/">

The content material attribute specifies the time delay in seconds. The URL attribute specifies the redirect URL.

How to search out and repair widespread meta refresh redirect errors

Meta refresh redirects are dangerous observe, so it’s finest to take away them the place potential.

To discover them, crawl your web site with Marketing Media Wizard’ Site Audit and test the Internal pages report. Look for the “Meta refresh redirect” error.

1580973314 953 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Replace them with 301 or 302 redirects the place potential.

If not, test for the presence of a canonical tag, and ensure it references the canonical model of the page.

What about meta key phrases?

Some articles say to fill within the meta key phrases tag with a listing of goal key phrases. This is pointless and doubtlessly dangerous recommendation. Google hasn’t used meta key phrases for rankings since 2009 as a result of:

[…] key phrase meta tags rapidly grew to become an space the place somebody may stuff often-irrelevant key phrases with out typical guests ever seeing these key phrases. Because the key phrases meta tag was so usually abused, a few years in the past Google started disregarding the key phrases meta tag.

Bing went one step additional in 2011 once they announced they use the tag as a spam sign. So, if yours are full of key phrases, then that might work towards you in Bing.

For this motive, it’s finest to be on the secure aspect and take away meta key phrases tags out of your web site.

To do that, crawl your web site with Marketing Media Wizard’ Site Audit, then plug these settings into Page Explorer:

1580973314 500 Meta Tags for SEO A Simple Guide for Beginners - Meta Tags for web optimization: A Simple Guide for Beginners

Remove the meta key phrases tag from any matching pages.

Note that more often than not, eradicating these tags is simple, as many websites set a sitewide meta key phrases tag of their CMS. Removing the tag from all pages might be executed by eradicating that one piece of code.

Final ideas

Meta tags aren’t that difficult. Understanding the six tags above ought to be sufficient to stop any vital web optimization fake pas.

Looking to study extra about meta tags? This should do it.

Looking to maximise your site visitors from social media? Read about Open Graph meta tags.

Give me a shout on Twitter if there’s something I missed.