Free Meta Tag Generator

Generate SEO meta tags, Open Graph and Twitter Card tags for your website.

0/60
0/160

About Meta Tags

Meta tags provide metadata about your HTML page. They help search engines understand your content, control how your pages appear in search results, and define how link previews look on social media. A well-optimized set of meta tags can improve click-through rates from search and social sharing. Keep titles under 60 characters and descriptions under 160 characters for best display in search results.

The Four Families of <head> Metadata

A modern HTML page's <head> typically carries metadata in four buckets, each serving a different audience:

This generator emits all four families from a single form. The output drops directly into the <head> of any HTML file: paste in, save, deploy. For a deeper dive on Open Graph specifically, the dedicated Open Graph Preview tool shows live platform renderings.

Title and Description: How Long Should They Be?

Google Search Central is direct about the answer: there is no hard maximum. Snippets are simply truncated to fit the device width. The 60-character title and 160-character description rules are industry conventions derived from the observed pixel-width truncation in Google's SERPs (~580 pixels on desktop). The practical take:

The robots Meta Tag: What It Actually Controls

Unlike the obsolete keywords tag (see below), <meta name="robots"> is alive and well; Google explicitly supports it. Common values:

For Google-specific overrides, use <meta name="googlebot"> with the same values. Note that noindex is also expressible as an HTTP X-Robots-Tag header, which is the right place for it on PDFs, images, and other non-HTML resources where you can't add a meta tag.

Why Canonical URLs Matter

<link rel="canonical"> tells search engines which version of a page is the "official" one when multiple URLs serve the same or near-identical content. Common cases that need a canonical:

Without a canonical, Google picks one version on its own and may pick the wrong one. The canonical URL must be absolute (full https://) and should match exactly the URL you want indexed.

Tags You Can Skip in 2026

The Two Tags Every Page Genuinely Needs

Beyond <title> and <meta name="description">, two tags are non-negotiable for a modern web page:

Open Graph and Twitter Cards in Brief

A short summary; for the deep dive use the Open Graph Preview tool. The four required OG tags per ogp.me: og:title, og:type, og:image, og:url. Optional but recommended: og:description, og:site_name. Image dimensions: 1200×630 (1.91:1) is the safest cross-platform size.

For X / Twitter: include twitter:card = summary_large_image (the modern full-width card) and X falls back to OG tags for everything else if Twitter-specific tags are absent. The standalone Twitter Card Validator preview was removed by X on 2 August 2022; verify by pasting the URL into the Tweet Composer instead.

Structured Data Is a Different Job

JSON-LD structured data (using schema.org vocabularies) is what powers rich Google results: recipe cards, product info with star ratings, FAQ snippets in search, breadcrumb trails. It's distinct from meta tags and lives in a <script type="application/ld+json"> block, not a <meta> tag. Both are recommended; one doesn't replace the other. Meta tags control the basic title / description / share-card; structured data unlocks the richer formats.

Common Mistakes

  1. Including meta keywords and expecting SEO benefit. Google announced in 2009 that it doesn't use it. Twenty-plus years later it's still in old templates; remove or ignore.
  2. Forgetting <link rel="canonical">. If your URL has tracking parameters or alternate versions, Google chooses one on its own. Without a canonical, the chosen version may not be the one with all your inbound links.
  3. Different titles in <title>, og:title, and twitter:title. Not technically wrong, but inconsistent. The clean default is one title shared across all three.
  4. Generic site logo as og:image on every page. Every page deserves a unique image that ties to its content; using a single logo across the whole site produces boring share previews.
  5. Missing viewport meta on mobile-targeted pages. Mobile browsers render the page at fictitious desktop width and zoom out. The user experience is awful.
  6. Using <meta http-equiv="refresh"> for redirects. HTTP 301/302 from the server is the right way; meta refresh is slower and accessibility-hostile, and many crawlers handle it inconsistently for ranking purposes.
  7. Title longer than ~580 pixels (~60 characters wide). Truncated by Google with an ellipsis; the truncated portion isn't visible to searchers.
  8. Forgetting that single-page apps need server-rendered or pre-rendered meta tags. Many social-media crawlers (Facebook, LinkedIn, Slack, Discord) don't execute JavaScript. Tags written by client-side JS won't be visible to them.

Frequently Asked Questions

Does the keywords meta tag still help SEO?

No. Google's Matt Cutts announced in September 2009 that <meta name="keywords"> is not used as a ranking signal. Bing treats excessive keyword stuffing in this tag as a spam signal. The field is included in this generator for compatibility with older templates and CMS workflows that still expect it; safe to leave blank.

What's the difference between meta description and OG description?

The HTML <meta name="description"> is what search engines use as the snippet under your page title in results. The Open Graph og:description is what social-media share cards display. They can be the same text (and usually are) but you can write different versions if your search audience and your social audience expect different framing.

My JavaScript writes the meta tags after page load. Is that OK?

For Google's main crawler (Googlebot), yes; Googlebot renders JavaScript and sees the post-render meta tags. For social-media crawlers (Facebook, LinkedIn, Slack, Discord, WhatsApp), generally no; most of them don't execute JavaScript and only see the initial HTML. If your site is a single-page app, you need server-side rendering, pre-rendering, or a service like Prerender.io to ensure social-media crawlers see the right meta tags.

Where exactly do these tags go?

Inside the <head> of your HTML, ideally near the top. <meta charset> should be in the first 1024 bytes. <meta name="viewport"> immediately after. Then <title>, <meta name="description">, robots, canonical, OG tags, Twitter tags. Order within the <head> doesn't matter for SEO once the charset and viewport are early enough.

Should I worry about the meta refresh tag for security?

It's not a security risk per se, but it's a poor pattern. Server-side HTTP 301/302 redirects are faster, handle referrer headers correctly, and are accessibility-friendlier. Use meta refresh only when you have no server-side control over redirects (a static GitHub Pages-style host without redirect config).

Are my meta tags uploaded to a server?

No. The generator runs entirely in your browser. Your title, description, URL, and image fields stay on your machine; the output snippet is composed locally and copied to your clipboard on demand. This matters because draft tags often contain unpublished page URLs, internal product names, or pre-launch marketing copy you don't want flowing through a third-party server.

Related Tools