Meta tags are the hidden HTML elements that tell search engines and social platforms what your page is about. Get them right and your pages show compelling snippets in search results and rich previews when shared on social media. Get them wrong — or skip them entirely — and you're leaving significant traffic on the table.
The DevToolShack Meta Tag Generator produces a complete, ready-to-paste set of meta tags for any page in seconds. But knowing what to put in each field makes the difference between average and excellent results.
The Tags That Actually Matter
There are dozens of possible meta tags. In practice, about eight do the heavy lifting:
| Tag | Purpose | Priority |
|---|---|---|
<title> | Page title in search results and browser tab | Critical |
meta description | Search result snippet | Critical |
canonical | Prevents duplicate content issues | Critical |
og:title | Title when shared on Facebook/LinkedIn | High |
og:description | Description when shared on social media | High |
og:image | Image shown in social previews | High |
twitter:card | Controls Twitter/X card format | Medium |
robots | Tells crawlers whether to index/follow | Situational |
Writing a Great Title Tag
The title tag is the single most important on-page SEO element. It appears as the blue link in search results and in the browser tab. Guidelines:
- Length: 50–60 characters. Google truncates at roughly 600px display width — typically around 60 characters. Too short and you waste valuable real estate; too long and it gets cut mid-word.
- Put the primary keyword first — search engines weight earlier words more heavily.
- Include your brand — usually at the end, separated by a pipe or dash:
Primary Keyword — Brand Name - Make it compelling — it's an ad for your page. "Free JSON Formatter — No Sign-Up" beats "JSON Formatter Tool".
Writing a Great Meta Description
The meta description doesn't directly affect rankings — but it heavily affects click-through rate, which does. A compelling description means more clicks from the same ranking position.
- Length: 140–160 characters. Google truncates at around 920px — roughly 155–160 characters.
- Include the primary keyword — Google bolds matching terms in snippets.
- Lead with the value proposition — what does the reader get?
- End with a call to action — "Learn how", "Get started free", "See examples".
- Unique per page — never reuse descriptions across pages.
The Canonical Tag: Preventing Duplicate Content
The canonical tag tells search engines which version of a URL is the "official" one. It prevents you from being penalised for duplicate content that often occurs naturally:
<link rel="canonical" href="https://example.com/blog/my-article">
Scenarios where canonical tags are essential:
- Your site is accessible at both
http://andhttps:// - URLs with and without trailing slash (
/pagevs/page/) - Paginated content with
?page=2parameters - Product pages accessible through multiple category paths
- Syndicated content published on multiple domains
Open Graph Tags for Social Sharing
Open Graph tags control how your page appears when shared on Facebook, LinkedIn, Slack, WhatsApp, and most other platforms. Without them, social platforms scrape whatever content they can find — usually with poor results.
<meta property="og:title" content="Your Page Title">
<meta property="og:description" content="Compelling description under 200 chars">
<meta property="og:image" content="https://example.com/og-image.png">
<meta property="og:url" content="https://example.com/this-page">
<meta property="og:type" content="website">
The OG image is the most impactful element — pages with a strong image get dramatically more engagement when shared. Recommended size: 1200 × 630px. For a dedicated OG tag generator, see the OG Tag Generator.
Twitter Card Tags
Twitter/X uses its own card system, though it falls back to Open Graph when Twitter tags are absent. The two most useful card types:
summary— small thumbnail with title and descriptionsummary_large_image— full-width image card, much more eye-catching
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="Your Page Title">
<meta name="twitter:description" content="Description under 200 chars">
<meta name="twitter:image" content="https://example.com/twitter-card.png">
The Robots Meta Tag
The robots tag tells crawlers what to do with your page. Most pages should just be indexed and followed — the default behavior even without the tag. Use it explicitly when you need to deviate:
<!-- Default — index the page, follow links (this is the default even without the tag) -->
<meta name="robots" content="index, follow">
<!-- Don't index this page (admin pages, thank-you pages, duplicate content) -->
<meta name="robots" content="noindex, nofollow">
<!-- Index the page but don't follow its links -->
<meta name="robots" content="index, nofollow">
<head>. Pair it with the OG Tag Generator for fine-tuned social previews.Checking Your Tags Are Working
After adding your meta tags, verify them with:
- Google Search Console — URL Inspection tool shows exactly how Google sees your page
- Facebook Sharing Debugger — previews your OG tags and clears the cache
- Twitter Card Validator — previews Twitter cards before sharing
- LinkedIn Post Inspector — checks LinkedIn preview specifically