gizmobench

Meta Tag Generator

Generate the head tags for a page: title, description, canonical, Open Graph and Twitter card, with length warnings and a preview of how the result truncates in search. It also catches the relative og:image, which fails silently on every platform that matters.

google previewestimated cut

gizmobench.com

Gizmobench: Browser Tools That Each Do One Job

Small utilities that each do one job properly. Nothing is uploaded, there is no size limit, and no account is ever needed to use any of them.

output13 tags
<!-- Primary --> <title>Gizmobench: Browser Tools That Each Do One Job</title> <meta name="description" content="Small utilities that each do one job properly. Nothing is uploaded, there is no size limit, and no account is ever needed to use any of them."> <link rel="canonical" href="https://gizmobench.com/"> <meta name="robots" content="index, follow"> <!-- Open Graph: Facebook, LinkedIn, Slack, WhatsApp, iMessage --> <meta property="og:type" content="website"> <meta property="og:title" content="Gizmobench: Browser Tools That Each Do One Job"> <meta property="og:description" content="Small utilities that each do one job properly. Nothing is uploaded, there is no size limit, and no account is ever needed to use any of them."> <meta property="og:url" content="https://gizmobench.com/"> <meta property="og:image" content="https://gizmobench.com/og.png"> <meta property="og:image:alt" content="The Gizmobench wordmark on a dark instrument panel."> <meta property="og:site_name" content="Gizmobench"> <meta property="og:locale" content="en_US"> <!-- X (Twitter) --> <meta name="twitter:card" content="summary_large_image">
Title46 / 60 ✓~460 of 600px
Description141 / 155 ✓~851 of 1100px
Page URL
og:imageabsolute ✓
Card type

Character counts, escaping and the URL checks are exact. The cut point in the preview is an estimate. Google truncates on rendered width, and the widths here come from an Arial table, so the real cut lands within a word or two.

  • RobotsFor information
    index, follow is what crawlers already do with no tag at all, so this line is optional. It is here because most people expect to see it.
  • X cardFor information
    twitter:title, twitter:description and twitter:image are left out on purpose: X reads the og: tags when they are missing, so duplicating them only creates a second place to forget to update. Turn the option on if your CMS strips og: tags.

Everything else in the card

All optional. Leave a field blank and its tag is left out rather than written empty, because an empty content="" is worse than no tag at all.

og:urlreusing the page URL
Site name
Image alt text
og:type
og:locale
X @site
X @creator
Repeat og: as twitter:

Crawling and structured data

The two switches write the robots line. Anything you add to the extras field is checked against them, so a tag that says both index and noindex is the most expensive mistake on a page, and it is silent.

Indexing
Links
Extra directives
Structured data
A relative og:image silently fails everywhere. Facebook, X, Slack and LinkedIn all require an absolute URL, and none of them tell you. The card just renders blank. So /og/card.png is an error here, not a shrug, and no og:image tag is written until it is fixed. That check is the single most useful thing this tool does.

Common questions

Why does my Open Graph image not show up?
Almost always because it is a relative URL. Facebook, X, Slack, LinkedIn and iMessage all require an absolute one, https://example.com/og.png rather than /og.png, and none of them tell you when it is wrong. The card simply renders without an image. The tool checks this explicitly, because it is the single most common reason a correctly-tagged page still previews badly.
How long should a title and description be?
Titles are usually cut around 60 characters and descriptions around 155, though Google measures pixel width rather than character count, so a title of capitals and wide letters truncates earlier than one of narrow ones. The preview shows where the cut lands for your actual text. Being over the limit is not an error. It just means the tail will not be visible in results.
Do I need both Open Graph and Twitter tags?
Not entirely. X falls back to Open Graph tags when Twitter-specific ones are absent, so og:title and og:description cover most of it. The one that genuinely adds something is twitter:card, which decides between a small thumbnail and a large image. Both sets are generated so you can paste once and not think about it.
What does the canonical tag do?
It tells search engines which URL is the authoritative version of a page, so that the same content reachable at several addresses (with tracking parameters, with and without a trailing slash) is credited to one. It should be an absolute URL and should point at itself on the canonical page.
Are quotes and special characters in my title handled?
Yes, and this matters more than it sounds. An unescaped double quote inside a content attribute terminates the attribute early and silently breaks the tag. The page still renders, the metadata just stops working. Ampersands and angle brackets are escaped for the same reason, and the output is re-parsed to confirm the tags are well-formed before you are given them.
Is anything I type sent anywhere?
No. Tag generation, escaping, counting and previewing all happen in your browser. There is no request to inspect because there is no server involved.

The generated HTML, the escaping and the character counts are exact: tags are re-parsed against a strict grammar before being returned, and length is counted in graphemes, so a family emoji counts as one character rather than eleven. The search-result truncation preview is an estimate from font advance widths. The cut point lands within a word or two of Google's, not to the pixel.