Encoders & Utilities

Meta Tag Generator

Generate Open Graph, Twitter Card, and SEO meta tags with live Google / FB / Twitter / LinkedIn preview.

Page basics
Open Graph / Facebook
Twitter / X
Copy-paste into your <head>

        

Live preview

Google SERP
Facebook / LinkedIn
Twitter / X
LinkedIn

About this tool

Meta Tag Generator builds the head-level metadata that search engines and social networks read off your page. Fill in the page title, description, canonical URL, language, robots directives, Open Graph fields (image, type, locale, site name), and Twitter Card variant — the tool emits a ready-to-paste block of HTML <meta> tags with everything correctly escaped. A live preview shows how the result looks in Google, Facebook, Twitter/X, and LinkedIn previews so you can tune copy before deploy.

The tool follows the current specifications: Open Graph protocol (the de-facto standard for Facebook/LinkedIn/iMessage previews), Twitter Cards (summary, summary_large_image, player, app), oEmbed markers for embeddable content, and the core SEO tags (title, description, canonical, robots). For multilingual sites it also generates hreflang alternate-URL tags from a simple language → URL table.

When to use this tool

  • Pre-launch SEO check. Verify every page has a unique title and description within their length budgets (≈ 60 / 155 characters respectively).
  • Social preview tuning. The same page can have different OG vs Twitter copy if you want to optimise per platform.
  • Open Graph image sizing. The previewer flags images that fall outside the recommended 1200×630 aspect.
  • Multilingual sites. Generate the hreflang set for every language version of a page in one go.

About length budgets

Google truncates titles around 60 characters and descriptions around 155 — those are guidelines based on observation, not contracts. Mobile cuts off sooner than desktop. Open Graph titles render up to ~88 characters in most apps; descriptions up to ~200. The previewer warns when you exceed each limit so you do not get an unhappy "..." in the wild. Test on the real platforms (Facebook Sharing Debugger, Twitter Card Validator) before deploy.

Frequently asked questions

Do I need both Open Graph and Twitter Card tags?

Usually yes. Twitter falls back to Open Graph if Twitter Card tags are missing, but the result is often suboptimal — wrong image crop, no "Read more" link. Defining both takes 30 seconds and produces consistent previews across every major social platform. LinkedIn, iMessage, Discord, Slack, Telegram all use Open Graph; only Twitter/X uses Twitter Cards.

What size should my Open Graph image be?

1200×630 pixels is the universally recommended size — works for Facebook, LinkedIn, Twitter (with summary_large_image), and Discord. Minimum is 600×315; below that, the image is shown as a small thumbnail or not at all. Keep critical content within the central 1200×600 safe area — Facebook crops the top and bottom edges in some contexts.

Is the canonical URL really important?

Yes, especially for any page reachable via multiple URLs (UTM parameters, A/B paths, language variants, http vs https, www vs apex). Without a canonical, search engines pick a canonical themselves — sometimes the wrong one — and split your ranking signals across the duplicates. A correct <link rel="canonical"> tag funnels all signals to one URL.

How do hreflang tags work?

Each translated page lists every other language version with a <link rel="alternate" hreflang="..."> tag, plus an x-default for the fallback. Codes are ISO 639-1 language (en, de, uk) optionally followed by an ISO 3166-1 region (en-US, en-GB). All pages in a language family must reference each other reciprocally — Google ignores one-sided hreflang.