Example output
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>DevToolsmith – Free Developer Tools That Run in Your Browser</title>
<meta name="description" content="Format JSON, decode JWTs, test regexes, convert timestamps and more. Free, fast and private: nothing you paste leaves your browser." />
<link rel="canonical" href="https://devtoolsmith.com/" />
<meta name="theme-color" content="#2f7bf6" />
<!-- Open Graph (Facebook, LinkedIn, Slack, Discord, WhatsApp…) -->
<meta property="og:type" content="website" />
<meta property="og:title" content="DevToolsmith – Free Developer Tools That Run in Your Browser" />
<meta property="og:description" content="Format JSON, decode JWTs, test regexes, convert timestamps and more. Free, fast and private: nothing you paste leaves your browser." />
<meta property="og:url" content="https://devtoolsmith.com/" />
<meta property="og:site_name" content="DevToolsmith" />
<meta property="og:locale" content="en_US" />
<meta property="og:image" content="https://devtoolsmith.com/og/default.png" />
<meta property="og:image:width" content="1200" />
<meta property="og:image:height" content="630" />
<meta property="og:image:alt" content="DevToolsmith logo and tagline" />
<!-- X (Twitter); falls back to the og: tags for title, description and image -->
<meta name="twitter:card" content="summary_large_image" />
<meta name="twitter:image:alt" content="DevToolsmith logo and tagline" />Checking tags on a live page
curl -sL https://example.com | grep -iE '<title|<meta (name|property)=|rel="canonical"'
# What Facebook and LinkedIn see (some sites serve bots differently)
curl -sL -A 'facebookexternalhit/1.1' https://example.com | grep -i 'og:'Need icons as well? The favicon generator makes favicon.ico, app icons and the manifest. Escaping text for HTML attributes by hand? Use HTML escape.
Frequently asked questions
Which meta tags actually matter for SEO?
The <title> matters most: it’s a ranking signal and usually the clickable headline in results. The meta description doesn’t affect ranking, but Google often uses it as the snippet, so a good one gets more clicks. A canonical link tells search engines which URL is the main one when the same page is reachable at several. The old keywords meta tag is ignored by Google and Bing.
What size should og:image be?
1200 × 630 pixels (a 1.91:1 ratio) works for Facebook, LinkedIn, X’s large card, Slack, Discord and WhatsApp. Keep important content in the middle, since some platforms crop to a square, and keep the file reasonably small (under 1 MB loads reliably). The URL must be absolute, starting with https://.
Do I need separate twitter: tags?
Mostly not. X reads og:title, og:description and og:image when the twitter: versions are missing. You only need twitter:card (to choose the large image layout), and optionally twitter:site for your account. That’s what the generator outputs.
I changed my tags but the old preview still shows. Why?
Platforms cache previews, often for days. Ask them to fetch the page again: Facebook’s Sharing Debugger, LinkedIn’s Post Inspector, or simply post the URL with a harmless query string like ?v=2. On X, previews update after a while on their own.
Does the preview send my data anywhere?
The tags are generated in your browser. The social preview does load the image from the URL you enter, so that server sees one request from your browser, just as it would when you open the image yourself.