What Are Meta Tags? An SEO Starter Guide
Meta tags are short snippets of HTML that live inside a page's <head> element. They are invisible to visitors reading your page but are read by search engines, social platforms, and browsers to understand what the page is about and how to present it. Getting them right is one of the fastest, highest-leverage wins in on-page SEO.
The basic anatomy of a meta tag
Every meta tag follows the same pattern: a self-closing <meta> element with a name (or property) attribute that identifies the tag type, and a content attribute that holds the value. They are placed inside <head> and never appear in the visible body of the page.
<!-- Inside <head> --> <meta name="description" content="A plain-English guide to meta tags and SEO." /> <meta name="robots" content="index, follow" /> <meta property="og:title" content="What Are Meta Tags?" />
Note that Open Graph tags (the og: family) use property instead of name — that is intentional, not a typo. Both styles are valid HTML.
The five meta tags that actually matter for SEO
There are dozens of meta tags in the wild, but most have little or no effect on search rankings today. These five have direct, measurable impact.
| Tag | What it does | Ideal length / value |
|---|---|---|
description |
The snippet shown below your title in Google search results. Does not directly boost rankings but strongly affects click-through rate. | 150–160 characters |
robots |
Tells crawlers whether to index the page and follow its links. Omitting it defaults to index, follow. |
index, follow or noindex, nofollow |
<link rel="canonical"> |
Points search engines to the authoritative version of a URL. Prevents duplicate-content dilution when a page is reachable via multiple URLs. | Absolute URL of the preferred version |
og:title / og:description / og:image |
Open Graph tags control how your page appears when shared on Facebook, LinkedIn, WhatsApp, and iMessage. | Title ≤ 60 chars; image 1200 × 630 px |
twitter:card |
Tells Twitter/X whether to render your link as a bare URL or as a rich card with an image and description. | summary_large_image (most common) |
<meta name="keywords"> since 2009. Bing still reads it but gives it minimal weight. You can include it for documentation purposes, but do not spend time optimizing it.Writing a good meta description
The meta description is the tag most people encounter first, and it is worth getting right. Google may override your description with its own auto-generated snippet, but when it uses yours, it becomes the text a searcher reads before deciding whether to click.
A strong meta description does three things:
- Answers the searcher's question directly — lead with the most useful information, not a warm-up sentence.
- Includes the primary keyword naturally — Google bolds query words that appear in the snippet, which draws the eye.
- Ends with a soft call to action — phrases like "Learn how," "See the full list," or "Try it free" increase click-through without feeling spammy.
Keep descriptions between 150 and 160 characters. Shorter is often fine; longer risks being cut off mid-sentence with an ellipsis, which looks unprofessional in search results.
Example: before and after
Strong: "Meta tags are HTML snippets that control how search engines and social platforms display your page. Learn which five tags actually move the needle — and how to write them."
The strong version leads with a definition (answers the query), includes the target keyword, and closes with a reason to click. It runs 163 characters — trim one phrase and you are inside the limit.
Open Graph tags: controlling your social previews
When someone shares your URL on Facebook, LinkedIn, Slack, or WhatsApp, those platforms do not render your page — they read the Open Graph (OG) tags in your <head> and build a preview card from them. Without OG tags, platforms fall back to guessing, often picking the wrong image or a generic title.
The minimum set you need is:
<meta property="og:title" content="What Are Meta Tags? An SEO Starter Guide" /> <meta property="og:description" content="Learn which meta tags matter for SEO and social sharing, with examples." /> <meta property="og:image" content="https://example.com/images/meta-tags-guide.jpg" /> <meta property="og:url" content="https://example.com/guides/what-are-meta-tags/" /> <meta property="og:type" content="article" />
The OG image is the most impactful element in a social card. Use a 1200 × 630 pixel image — this ratio renders cleanly on both desktop and mobile feeds without cropping. A blank or missing OG image means your post shows up as a small, easy-to-scroll-past thumbnail or no image at all.
Twitter Card tags
Twitter (now X) has its own parallel tag system. In practice, Twitter will fall back to OG tags if Twitter-specific tags are missing, but declaring them explicitly gives you more control and avoids edge cases.
<meta name="twitter:card" content="summary_large_image" /> <meta name="twitter:title" content="What Are Meta Tags? An SEO Starter Guide" /> <meta name="twitter:description" content="Learn which meta tags matter for SEO and social sharing." /> <meta name="twitter:image" content="https://example.com/images/meta-tags-guide.jpg" /> <meta name="twitter:site" content="@youraccount" />
The twitter:card value of summary_large_image gives you the full-width image card that tends to get significantly more engagement than the small-thumbnail summary type. Use summary only if your image is square or you have no image at all.
The canonical tag: preventing duplicate-content problems
The canonical tag is technically a <link> element, not a <meta> tag, but it belongs in the same mental bucket. It tells Google which URL should be treated as the definitive version of a page when the same content is accessible at multiple addresses.
This matters more than people realize. A single page is often reachable via:
https://example.com/page/andhttps://example.com/page(trailing slash)http://andhttps://variantswww.and non-www versions- URL parameters like
?utm_source=emailappended by marketing campaigns
Without a canonical, Google has to guess — and it may split ranking signals across all the variants instead of concentrating them on one URL. The fix is one line:
<link rel="canonical" href="https://example.com/page/" />
Always use the absolute URL (including https:// and the exact domain), not a relative path.
The robots meta tag
The robots meta tag tells search engine crawlers what they are allowed to do with a page. The default behavior — index the page, follow its links — is assumed even when the tag is absent, so you only need to add it when you want to change something.
Common values and when to use them:
noindex— exclude this page from search results entirely. Use on thank-you pages, internal search results, staging environments, or any page where appearing in Google would be confusing or harmful.nofollow— crawl this page but do not pass link equity to outbound links. Used less frequently; more often applied at the individual link level withrel="nofollow".noarchive— prevents Google from showing a cached version of the page. Occasionally useful for pages with time-sensitive or frequently updated content.
Generate your meta tags in seconds
Figro's free Meta Tag Generator lets you fill in your title, description, Open Graph details, and Twitter Card settings, then live-previews how your page will look in Google search results and social feeds. No signup, nothing uploaded — all processing happens in your browser.
Open the free meta tag generator →Putting it all together: a complete example
Here is a realistic <head> block for a blog post, combining all the tags covered above. The comments explain the purpose of each group.
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<!-- Title shown in browser tab and search results -->
<title>What Are Meta Tags? An SEO Starter Guide</title>
<!-- Core SEO -->
<meta name="description" content="Meta tags are HTML snippets that control
how search engines and social platforms display your page.
Learn which five tags actually move the needle." />
<meta name="robots" content="index, follow" />
<link rel="canonical" href="https://example.com/guides/what-are-meta-tags/" />
<!-- Open Graph -->
<meta property="og:title" content="What Are Meta Tags? An SEO Starter Guide" />
<meta property="og:description" content="Learn which meta tags matter for SEO
and social sharing, with real examples." />
<meta property="og:image" content="https://example.com/img/meta-tags.jpg" />
<meta property="og:url" content="https://example.com/guides/what-are-meta-tags/" />
<meta property="og:type" content="article" />
<!-- Twitter Card -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:site" content="@youraccount" />
</head>
Notice the <title> tag. Technically it is not a meta tag — it is its own element — but it is the most important piece of metadata on the page. Google uses it as the clickable headline in search results, and it should contain your primary keyword, ideally near the beginning, within about 60 characters.
Figro's guides are educational and independent. They are not financial, legal, or professional advice. Some pages include affiliate links; if you purchase through them we may earn a commission at no extra cost to you.