Meta Tag Generator -- SEO & Open Graph Tags

Generate HTML meta tags for search engines and social media previews

Generate Meta Tags

A meta tag generator creates the HTML code that tells search engines and social platforms how to display your page. Enter your page details below to generate title, description, canonical, Open Graph, and Twitter Card tags.

0 / 60 characters
0 / 160 characters
Recommended: 1200 × 630 px (JPEG or PNG)

Examples

Here is what meta tags look like for a typical page and how each tag is used:

Example: Blog Article

<title>How to Calculate Compound Interest — Step-by-Step Guide</title>
<meta name="description" content="Learn how compound interest works with clear formulas and examples. Calculate how your savings grow over time.">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://example.com/compound-interest-guide">

<meta property="og:title" content="How to Calculate Compound Interest — Step-by-Step Guide">
<meta property="og:description" content="Learn how compound interest works with clear formulas and examples.">
<meta property="og:type" content="article">
<meta property="og:url" content="https://example.com/compound-interest-guide">
<meta property="og:image" content="https://example.com/images/compound-interest-og.jpg">

<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="How to Calculate Compound Interest — Step-by-Step Guide">
<meta name="twitter:description" content="Learn how compound interest works with clear formulas and examples.">
<meta name="twitter:image" content="https://example.com/images/compound-interest-og.jpg">

Example: Tool / App Page

<title>Free JSON Formatter — Validate and Beautify JSON Online</title>
<meta name="description" content="Paste JSON to format, validate, and minify it instantly. Syntax highlighting, error detection, and tree view. No sign-up required.">
<meta name="robots" content="index, follow">
<link rel="canonical" href="https://example.com/json-formatter">

<meta property="og:title" content="Free JSON Formatter — Validate and Beautify JSON Online">
<meta property="og:description" content="Paste JSON to format, validate, and minify it. No sign-up required.">
<meta property="og:type" content="website">
<meta property="og:url" content="https://example.com/json-formatter">

<meta name="twitter:card" content="summary">
<meta name="twitter:title" content="Free JSON Formatter — Validate and Beautify JSON Online">
<meta name="twitter:description" content="Paste JSON to format, validate, and minify it. No sign-up required.">

Which Meta Tags Matter (and Which Don't)

Not all meta tags are equal. Here is a practical breakdown:

Tag SEO Impact Purpose
<title> High Clickable headline in search results. Directly affects rankings.
meta description Medium Snippet text below the title. Affects click-through rate, not rankings directly.
link canonical High Tells search engines the preferred URL. Prevents duplicate content issues.
meta robots High Controls indexing and link-following behavior.
og:title / og:description Indirect Controls social media previews. Better previews = more clicks and shares.
og:image Indirect Social preview image. Posts with images get significantly more engagement.
twitter:card Indirect Controls X (Twitter) preview format. Falls back to OG tags if missing.
meta keywords None Ignored by Google since 2009. Not generated by this tool.
meta viewport High Essential for mobile rendering. Set once in your template; not page-specific.

Best Practices for Meta Tags

✓ Write Unique Tags Per Page

Every page needs its own title and description. Duplicate meta tags across pages confuse search engines and reduce click-through rates.

✓ Front-Load Keywords

Put the most important words at the beginning of your title. "Compound Interest Calculator — Free Online Tool" is better than "Free Online Tool for Compound Interest."

✓ Make Descriptions Actionable

Include a reason to click: "Learn how compound interest works with clear examples" beats "This page is about compound interest."

✓ Always Set a Canonical URL

Even if your page has only one URL, a canonical tag confirms the preferred version and prevents issues with query parameters or trailing slashes.

✗ Don't Stuff Keywords

Repeating keywords in meta tags looks spammy. "Best calculator free calculator online calculator" hurts more than it helps.

✗ Don't Mislead Users

Meta descriptions that don't match page content cause high bounce rates. Google may also override misleading descriptions with its own snippet.

✗ Don't Use meta keywords

Google has ignored the meta keywords tag since 2009. Adding it does nothing for SEO and can reveal your keyword strategy to competitors.

✗ Don't Forget Social Tags

Without Open Graph tags, social platforms guess how to display your page — often with the wrong image or a truncated description.

Meta Tag Checklist

Use this checklist when reviewing meta tags for any page:

  • Title tag: 50-60 characters, includes primary keyword, unique to this page
  • Meta description: 120-160 characters, includes keyword, has a clear call-to-action
  • Canonical URL: Set to the preferred URL (HTTPS, with or without www — pick one)
  • Robots: Set to index, follow unless you have a reason to restrict
  • OG title: Same as or similar to the page title
  • OG description: Can be shorter than meta description — optimized for social sharing
  • OG image: 1200 × 630 px, under 1 MB, important content centered
  • OG url: Matches canonical URL
  • Twitter card: Set to summary_large_image if you have a good image, otherwise summary
  • No duplicate tags: Each page has unique title and description

Common Mistakes

  • Same title on every page: "My Website" as the title on all pages gives search engines no information about individual page content. Each page needs a descriptive, unique title.
  • Empty meta description: If you don't set one, Google will auto-generate a snippet from page content. The auto-generated version is often worse than a well-written description.
  • Missing canonical tag: Without it, search engines may index the wrong URL variant (HTTP vs HTTPS, www vs non-www, with vs without trailing slash).
  • Using noindex accidentally: A noindex robots tag removes the page from search results entirely. Double-check this setting, especially on production pages.
  • No OG image: Shared links without images get far less engagement on social media. Always provide an og:image if you want people to click social shares.
  • Title too long: Titles over 60 characters get truncated in search results with "…" — your key message may be cut off.
  • Forgetting mobile: Google primarily uses mobile rendering. Descriptions over 120 characters may be truncated on mobile search results.

Frequently Asked Questions

What are meta tags?

Meta tags are HTML elements placed in a page's <head> section that provide metadata about the page. They tell search engines what the page is about (title, description), how to index it (robots), and how it should appear when shared on social media (Open Graph, Twitter Cards). Meta tags are not visible on the page itself.

Which meta tags are most important for SEO?

The four most impactful meta tags are: (1) the title tag, which is a direct ranking factor; (2) the meta description, which affects click-through rate from search results; (3) the canonical link, which prevents duplicate content; and (4) the robots meta tag, which controls indexing.

What is the ideal title length?

Keep titles between 50-60 characters. Google displays approximately 50-60 characters before truncating. Put your primary keyword and most important information at the beginning of the title.

What is the ideal meta description length?

Aim for 120-160 characters. Google shows up to 155-160 characters on desktop and about 120 on mobile. Include your primary keyword and give users a reason to click.

What are Open Graph tags?

Open Graph (OG) tags control how your page appears when shared on Facebook, LinkedIn, WhatsApp, and other social platforms. The key tags are og:title, og:description, og:image, og:url, and og:type. Without them, platforms guess the preview — often with poor results.

What size should an OG image be?

The recommended size is 1200 × 630 pixels (1.91:1 aspect ratio). Use JPEG or PNG format and keep the file under 1 MB. Center important content since some platforms crop edges.

Do I need both OG tags and Twitter Card tags?

If you only set Open Graph tags, X (Twitter) will fall back to those. However, for maximum control, set both. Twitter Card tags let you specify a different card format, title, or image optimized for the X platform.

What does the canonical tag do?

The <link rel="canonical"> tag tells search engines which URL is the preferred version of a page. This prevents duplicate content issues when the same content is accessible at multiple URLs (e.g., with query parameters, www vs non-www, HTTP vs HTTPS).

Do meta keywords still work?

No. Google has officially ignored the meta keywords tag since at least 2009. Bing uses it only as a potential spam signal. There is no SEO benefit to adding meta keywords, which is why this tool does not generate them.

What does noindex do?

The noindex robots directive tells search engines not to include the page in search results. Use it for pages like login screens, internal dashboards, or thank-you pages that should not appear in search.

Can Google override my meta description?

Yes. Google sometimes generates its own snippet from the page content if it decides the existing meta description does not accurately describe the page or does not match the user's query. Writing accurate, relevant descriptions reduces the chance of this happening.

Does this tool store my data?

No. All processing happens in your browser using JavaScript. No data is sent to any server, no cookies are set, and nothing is stored. You can use the tool offline after the page loads.

Related Tools

Privacy & Limitations

  • Client-side only. No data is sent to any server. No cookies, no tracking of any text you enter.
  • Preview is approximate. The Google SERP and social media previews show how your tags may appear. Actual rendering depends on the platform, screen size, and content. Google may override your meta description.
  • No validation of URLs or images. This tool generates the HTML but does not verify that your canonical URL or image URL actually exists or loads correctly. Test your URLs separately.

Related Tools

View all tools

Meta Tag Generator FAQ

What are meta tags?

Meta tags are HTML elements placed in a page's <head> section that provide metadata about the page. They tell search engines what the page is about (title, description), how to index it (robots), and how it should appear when shared on social media (Open Graph, Twitter Cards). Meta tags are not visible on the page itself.

Which meta tags matter most for SEO?

The most important meta tags for SEO are: (1) the title tag, which appears as the clickable headline in search results and directly affects rankings; (2) the meta description, which appears as the snippet below the title and affects click-through rate; (3) the canonical link, which tells search engines the preferred URL to avoid duplicate content; and (4) the robots meta tag, which controls whether a page is indexed.

What is the ideal length for a meta title?

Keep meta titles between 50-60 characters. Google typically displays the first 50-60 characters of a title tag. Titles longer than about 60 characters may be truncated with an ellipsis. Put your most important keywords and information at the beginning of the title.

What is the ideal length for a meta description?

Keep meta descriptions between 120-160 characters. Google typically shows up to 155-160 characters on desktop and about 120 characters on mobile. A description that is too short wastes space; one that is too long gets cut off. Include your primary keyword and a clear call-to-action or value statement.

What are Open Graph meta tags?

Open Graph (OG) tags are meta tags that control how a page appears when shared on social media platforms like Facebook, LinkedIn, and WhatsApp. Key OG tags include og:title, og:description, og:image, og:url, and og:type. Without OG tags, social platforms will try to guess the preview content, often with poor results.

What are Twitter Card meta tags?

Twitter Card tags (twitter:card, twitter:title, twitter:description, twitter:image) control how a page appears when shared on X (formerly Twitter). The two main card types are 'summary' (small square image with text) and 'summary_large_image' (large landscape image above text). If Twitter Card tags are missing, X falls back to Open Graph tags.

What does the canonical tag do?

The canonical tag (link rel='canonical') tells search engines which URL is the preferred version of a page. This is critical when the same content is accessible at multiple URLs (e.g., with and without www, with query parameters, or across HTTP and HTTPS). Without a canonical tag, search engines may split ranking signals across duplicate URLs.

What does the robots meta tag do?

The robots meta tag tells search engine crawlers how to handle a page. Common values include 'index, follow' (default — crawl and index the page), 'noindex' (don't show in search results), 'nofollow' (don't follow links on the page), and 'noarchive' (don't show a cached copy). You can combine directives, like 'noindex, nofollow'.

Do meta keywords still matter for SEO?

No. Google has officially stated that it ignores the meta keywords tag and has done so since at least 2009. Bing has said it uses meta keywords only as a spam signal (too many keywords can hurt). There is no SEO benefit to adding meta keywords. Focus on title tags, meta descriptions, and high-quality page content instead.

What is the difference between Open Graph and Twitter Card tags?

Open Graph tags (og:title, og:description, og:image) were created by Facebook and are used by most social platforms including LinkedIn, WhatsApp, and Pinterest. Twitter Card tags (twitter:title, twitter:description, twitter:image) are specific to X (Twitter). If you set both, X uses its own tags. If you only set Open Graph tags, X falls back to those. For maximum coverage, set both.

Does this meta tag generator store my data?

No. All processing happens in your browser using JavaScript. No data is sent to any server, and nothing is stored. You can verify this by disconnecting from the internet and using the tool offline after the page has loaded.

How do I add meta tags to my website?

Copy the generated HTML and paste it inside the <head> section of your page, before the closing </head> tag. In WordPress, you can use an SEO plugin like Yoast or Rank Math to set meta tags without editing code. In Next.js, use the Head component. In static HTML, paste directly into the HTML file.

What image size should I use for og:image?

The recommended size for Open Graph images is 1200 × 630 pixels (1.91:1 aspect ratio). This works well across Facebook, LinkedIn, WhatsApp, and X (Twitter). Use JPEG or PNG format, keep the file size under 1 MB for fast loading, and ensure important text or visuals are centered since some platforms crop the edges.

Request a New Tool
Improve This Tool