Meta Tag Generator

Writing meta tags by hand and remembering to include both Open Graph and Twitter Card variants while staying under the right character limits is a chore that gets skipped or done badly.

Fill in title, description, URL, and image, and the generator produces the full set: standard meta description, Open Graph (og:title, og:description, og:image, og:url, og:type), and Twitter Cards (twitter:card, twitter:title, twitter:description, twitter:image). Character counters warn when you exceed Google's recommended title (60 char) or description (155 char) limits.

Facebook, LinkedIn, and most messaging apps read Open Graph. Twitter prefers Twitter Cards but will fall back to OG if the Twitter-specific tags are missing — which is why the generator outputs both rather than picking one.

The set of tags the generator produces maps to specific consumers. Standard meta description and title — Google, Bing, DuckDuckGo, and most search engines. Open Graph (og:* tags) — Facebook, LinkedIn, Slack, Discord, iMessage previews, and most chat apps. Twitter Cards (twitter:*) — only Twitter/X cares, and they fall back to OG when missing. Canonical link — search engines for deduplication. Each protocol came from a different vendor at a different time, which is why there's no single universal format.

The pain this avoids: shipping a page where the OG image is wrong size, the title is duplicated between og:title and meta title with slightly different text, and the LinkedIn preview shows your old logo because their cache is stale. Each of these requires a different validator (Facebook Sharing Debugger, Twitter Card Validator, LinkedIn Post Inspector) to confirm fixes propagated. Get the tags right the first time and you avoid this fix-revisit-fix loop.

Worked example: a blog post titled 'How to Set Up Postgres on a Raspberry Pi' with a 1200×630 hero image. The generator outputs: ```html <title>How to Set Up Postgres on a Raspberry Pi</title> <meta name="description" content="Step-by-step guide to installing Postgres on a Raspberry Pi 4..."> <meta property="og:title" content="How to Set Up Postgres on a Raspberry Pi"> <meta property="og:description" content="Step-by-step guide..."> <meta property="og:image" content="https://example.com/hero.jpg"> <meta property="og:url" content="https://example.com/postgres-pi"> <meta property="og:type" content="article"> <meta name="twitter:card" content="summary_large_image"> <link rel="canonical" href="https://example.com/postgres-pi"> ``` The duplication between og:title and standard title isn't a mistake — search and social parse different tags, and they need to be set explicitly.

Where this can mislead: Google has been pretty clear that meta keywords are dead and have been since 2009. The generator doesn't include them because they're useless and including them looks like you're following 2005 SEO advice. Google also occasionally rewrites your meta description to a snippet they generated from page content if they think theirs is more relevant — you can't force your description to display, you can only suggest it.