How I Built an AI-Powered Meta Tag Generator (And Why 90% of Sites Get OG Tags Wrong)

2026-06-07 · by MetaCraft

The Problem Nobody Notices

I was building a landing page last week and spent 45 minutes writing custom meta descriptions and Open Graph tags. 45 minutes. For metadata that nobody sees unless they inspect the page source.

Then I started noticing something: every time I pasted a URL into Slack, Discord, or Twitter, half the time there was no image, the description was gibberish, or the title was cut off.

Broken OG tags are everywhere.

The Stats Are Worse Than You Think

I checked 50 random landing pages from Product Hunt. 43 had missing or broken OG tags. That's 86% failure rate.

The most common issues:

• Missing og:image — 60% of sites don't set a social share image at all
• Wrong twitter:card type — Setting og:title doesn't automatically set twitter:title. You need both.
• Truncated descriptions — Google shows ~160 chars, LinkedIn ~85, Twitter ~100. Most meta descriptions are either too long or too short.
• Stale OG tags — Site redesigns that forget to update the meta tags (the homepage says "Welcome to our 2022 redesign" in 2026).

What I Built

MetaCraft — paste any URL, get optimized meta tags and a social card preview in 5 seconds. No signup, no account needed for the first 3 uses.

It reads the actual page content (not just the URL), understands the context, and generates human-readable meta descriptions that match the content. No keyword stuffing, no generic filler.

The Stack

• Python + FastAPI — lightweight async backend with Jinja2 templates
• Tailwind CSS — minimal frontend, no JS framework needed
• OpenRouter API — powers the AI generation (works with multiple models)
• Traefik — reverse proxy with automatic TLS via Let's Encrypt
• Stripe — subscription billing ($9/mo for Pro, 3 free generations for anyone)
• SQLite — simple, zero-config database for user tracking

How It Works Under the Hood

When you paste a URL into MetaCraft, here's what happens:

1. Fetch the page — HTTP request with proper user-agent, handles redirects
2. Extract content — Readability-style algorithm pulls the actual article text, title, and existing meta tags
3. AI analysis — The page content is sent to an LLM with a structured prompt that asks for optimized meta tags across all platforms
4. Return structured data — Meta title, description, OG tags, Twitter cards, and a social preview rendering

Why AI Works Well Here

Meta tag generation is actually a perfect use case for LLMs:

• The input is well-defined (page content + URL)
• The output is structured (fixed fields: title, description, OG tags)
• The success criteria are clear (shows up correctly on social platforms)
• It saves real time (was 45 min, now 5 seconds)

Lessons Learned

1. Social platforms render the same tags differently

Discord shows a large preview with full description. Slack shows a compact card. LinkedIn strips everything if the image isn't the right aspect ratio. Twitter needs explicit twitter:card tags even if you have OG tags.

2. Most page builders don't set OG tags correctly

Wix, Squarespace, Webflow — they all handle meta tags differently. Some set og:title but not twitter:title. Some set og:image but use a tiny thumbnail.

3. AI does a surprisingly good job

I was skeptical about AI-generated meta descriptions, but when fed the actual page content, the outputs are consistently better than manually written ones — they're more specific, include relevant keywords naturally, and fit within character limits.

Try It

MetaCraft is live at metacraft.tools — free for 3 generations (no account needed), $9/mo for unlimited.

I built it because I was tired of manually checking OG tags. Turns out a lot of other devs have the same pain.