Every web page has meta tags, but they’re only visible in the HTML code.
In this guide, you’ll learn how to use, and not to use, the six most important meta tags for SEO:
Meta title
This is the page title that Google and most other search engines show in search results.
Title tag in Google’s search results.
Google doesn’t always show the title tag. It sometimes shows something different.
Why it’s important for SEO
Google explains it best:
Titles are critical to giving users a quick insight into the content of a result and why it’s relevant to their query. It’s often the primary piece of information used to decide which result to click on, so it’s important to use high-quality titles on your web pages.
Best practices
How to add a title tag to your page
Paste the code below into the <head> section of your page:
If you’re using WordPress, install an plugin like Yoast. You should see a place to set the title tag on the page or post editor.
Adding a title tag in WordPress with Yoast.
Other CMS’ like Squarespace and Wix have similar functionality built-in.
How to find and fix common title tag mistakes
There are four common issues with title tags:
To check a page for the first two issues, plug the URL into a free tool like SERPSim.
If it doesn’t pull a title back, then you need to add one.
If the pixel length count is red, then it needs shortening.
To check for duplicate and multiple title tags, crawl your site with Ahrefs’ Site Audit.
From there, check the On page report for “Multiple title tag” errors:
Fix these by removing one of the tags from the affected pages.
Next, go to the Duplicate content report and look for title tags with “Bad duplicate” errors:
Rewrite the title tags on affected pages to make them unique.
Note that this same report also shows pages with title tags that are too long, too short, missing, or empty.
Meta description
The meta description summarizes the page’s content. Search engines often use it for the snippet in search results.
Meta description tag in Google’s search results.
Google doesn’t always show the meta description you set. Sometimes they show a different snippet.
Why it’s important for SEO
Google explains it best once again:
A meta description tag should generally inform and interest users with a short, relevant summary of what a particular page is about. They are like a pitch that convinces the user that the page is exactly what they’re looking for.
Meta descriptions, however, are not a direct ranking factor. Google says:
Even though we sometimes use the description meta tag for the snippets we show, we still don’t use the description meta tag in our ranking.
Best practices
Recommended reading: task
How to add a meta description to your page
Paste the code below into the <head> section of your page:
If you’re using WordPress, you can do this easily in Yoast.
Adding a meta description in WordPress with Yoast.
Other CMS’ like Squarespace and Wix have similar functionality.
How to find and fix common meta description mistakes
The four common issues with meta descriptions are the same as those with title tags:
Check for the first two errors on a page-by-page basis with SERPSim or Yoast.
Crawl your website with Ahrefs’ Site Audit and check the On page report to check for the first three errors across all pages.
Check the Duplicate content report for duplicate meta descriptions across pages.
Use the same fixes as with title tags.
Meta robots
The meta robots tag tells search engines if and how they should crawl your web pages.
Syntax
Why it’s important for SEO
Using the wrong attributes in the meta robots tag can have a catastrophic impact on your site’s presence in the search results. Your SEO efforts rely on you understanding this tag and using it effectively.
With that in mind, here are the values you can use in this tag:
You can combine these in any of the following ways:
You can also use <meta name=”robots” content="none">, which is the same as index, follow. Not setting a meta robots tag is also equivalent to index, follow.
Google sees “nofollow” tags as
Best practices
How to add a meta robots tag to your page
Paste the appropriate code above into the <head> section of your page.
In WordPress, use Yoast’s advanced settings to set meta robots tags:
Meta robot options in Yoast.
Most CMS’ have similar options built-in.
How to diagnose and fix common meta robots mistakes
There are three common mistakes with meta robots:
You can check for the first two issues using the Coverage report in Google Search Console.
To find indexed pages that may be set to meta robots noindex, hit the “Valid with warnings” tab and look for “Indexed, though blocked by robots.txt” warnings:
Check the source code of these pages for a meta robots noindex tag. Remove either the robots.txt block or meta robots noindex tag depending on what you’re trying to do.
To find rogue meta robots noindex tags, hit the “Excluded” tab and look for pages “Excluded by ‘noindex’ tag”:
Remove the robots meta tag from any pages that should be indexed.
To find pages with rogue meta robots nofollow tags, crawl the site with Ahrefs’ Site Audit and check the Indexability report for “Nofollow page” warnings.
Remove the tag unless you specifically want search engines not to crawl the links on the page.
There are few issues not covered here, such as having pages with noindex tags in your
Meta viewport
A meta viewport tag sets the visible area of a web page. It is used to instruct the browser how to render the page on different screen sizes (i.e., desktop/tablet/mobile).
Why it’s important for SEO
Google says that the “presence of this tag indicates to Google that the page is mobile-friendly.” This matters because Google ranks mobile-friendly web pages higher in mobile search results as of 2015.
Here’s what a page might look like on mobile with and without a meta viewport tag:
Image credit: w3schools.com
Many people likely hit the back button when the desktop version of a page loads on mobile. It’s annoying and makes things hard to read. This may send negative signals to Google and tell them there’s something undesirable about your page.
The viewport tag isn’t all that’s needed to make a website mobile-friendly. Your website also needs to make use of responsive design.
Best practices
How to add a meta viewport tag to your page
Paste the code below into the <head> section of your webpage:
Note that the content attribute doesn’t have to be set to width=device-width, initial-scale=1.0, but this is the most common implementation—and the correct one for most pages.
How to diagnose and fix common meta viewport mistakes
Because most CMS’ and themes set the viewport automatically, tag-related issues are uncommon on most modern websites.
That said, you can check for issues using the Mobile Usability report in Google Search Console.
This shows pages with usability issues on mobile devices. If this issue is even partly down to the lack of a viewport meta tag, it will show the “Viewport not set” error.
Fix this issue by adding the appropriate meta viewport tag to any affected pages.
Adding a meta viewport tag won’t fix underlying mobile display issues caused by CSS styles not written for different widths. If adding a meta viewport tag doesn’t solve things, consult a developer.
Don’t use Google Search Console?
Meta viewport is almost always set at the site-level and is usually hardcoded into the theme.
Use Google’s Mobile-Friendly Test tool to check your homepage for a meta viewport tag.
If the tag isn’t on your homepage, it probably isn’t anywhere else on your site.
Note that this is far from a foolproof method, and you should always use Google Search Console if possible.
Meta charset
The meta charset tag sets the character encoding for the web page. In other words, it tells the browser how the text on your web page should be displayed.
There are hundreds of different character sets, but the two most common on the web are:
See a full list here.
Why it’s important for SEO
Using the wrong character encoding can cause some characters to display incorrectly in the browser.
Example of characters displaying incorrectly due to charset issues.
Character formatting issues are bad for user experience and can cause your pages to look quite broken.
That can lead to SEO problems like:
But let’s be real about this:
Unless your page is severely broken as a result of charset issues, which is unlikely, the impact is going to be quite minimal.
Still, it’s worth noting that Google recommends using Unicode/UTF‑8 where possible.
Best practices
How to add a meta charset tag to your web page
Paste the code below into the <head> section of your webpage:
If you’re using HTML4 or below, use this code instead:
If you’re unsure which version of HTML you’re using, check your source code for <!doctype html>. If it’s there, you’re using HTML5.
How to diagnose and fix common meta charset mistakes
Most websites use either UTF‑8 or ISO-8859–1 character encoding.
The former is preferable to the latter.
For that reason, it’s worth checking for pages on your site that don’t use UTF‑8 encoding. You can do this in Ahrefs’ Site Audit. Go to the Page Explorer, then use these settings:
If the search returns any results, check each of them manually for character encoding issues.
Switch to UTF‑8 encoding if possible. That may solve the issue, but not always. However, if you don’t set meta charset at all, the browser will be forced to guess and may show garbage text to users. This article explains more.
Meta refresh redirect
A meta refresh tag tells the web browser to redirect the user to a different URL after a set amount of time.
Why it’s important for SEO
Meta refresh redirect tags are important for SEO in the sense that you should not use them, even though Google understands and respects them.
There are a few reasons for this:
Another potential issue arises when there’s no canonical tag present on the page, as John Mueller explains in this tweet:
301 or 302 is essentially just a question of which URL is canonical, that can go either way here, so make sure your other canonicalization methods reflect the way you want it to go.— 🍌 John 🍌 (@JohnMu) March 2, 2018
Best practices
How to add a meta refresh redirect tag to your page (if you really need to)
Paste the code below into the <head> section of your page:
The content attribute specifies the time delay in seconds. The URL attribute specifies the redirect URL.
How to find and fix common meta refresh redirect mistakes
Meta refresh redirects are bad practice, so it’s best to remove them where possible.
To find them, crawl your site with Ahrefs’ Site Audit and check the Internal pages report. Look for the “Meta refresh redirect” error.
Replace them with 301 or 302 redirects where possible.
If not, check for the presence of a canonical tag, and make sure it references the canonical version of the page.
What about meta keywords?
Some articles say to fill in the meta keywords tag with a list of target keywords. This is pointless and potentially bad advice. Google hasn’t used meta keywords for rankings since 2009 because:
Bing went one step further in 2011 when they announced they use the tag as a spam signal. So, if yours are stuffed with keywords, then that could work against you in Bing.
For this reason, it’s best to be on the safe side and remove meta keywords tags from your site.
To do this, crawl your site with Ahrefs’ Site Audit, then plug these settings into Page Explorer:
Remove the meta keywords tag from any matching pages.
Note that most of the time, removing these tags is easy, as many sites set a sitewide meta keywords tag in their CMS. Removing the tag from all pages can be done by removing that one piece of code.
Final thoughts
Meta tags aren’t that complicated. Understanding the six tags above should be enough to prevent any significant SEO faux pas.
Looking to learn more about meta tags? This should do it.
Looking to maximize your traffic from social media? Read about Open Graph meta tags.
Give me a shout on Twitter if there’s anything I missed.
This content was originally published here.