Meta-Tags-Generator

Erstelle, bearbeite und teste Open Graph + Twitter Card Meta-Tags in der Vorschau. Sieh, wie deine Seite auf Google, Facebook, X, LinkedIn, Pinterest und Slack aussieht — bevor du sie veröffentlichst.

Vorschau

Google

https://so-me.studio

Meta-Tags — Vorschau, Bearbeiten und Generieren

Mit Meta-Tags kannst du deine Inhalte bearbeiten und ausprobieren und dann in der Vorschau sehen, wie deine Webseite auf Google, Facebook, X und mehr aussehen wird!

X (Twitter)

Kein Bild

Von so-me.studio

Meta-Tags — Vorschau, Bearbeiten und Generieren

Mit Meta-Tags kannst du deine Inhalte bearbeiten und ausprobieren und dann in der Vorschau sehen, wie deine Webseite auf Google, Facebook, X und mehr aussehen wird!

Facebook

Kein Bild

so-me.studio

Meta-Tags — Vorschau, Bearbeiten und Generieren

Mit Meta-Tags kannst du deine Inhalte bearbeiten und ausprobieren und dann in der Vorschau sehen, wie deine Webseite auf Google, Facebook, X und mehr aussehen wird!

LinkedIn

Kein Bild

Meta-Tags — Vorschau, Bearbeiten und Generieren

so-me.studio

Pinterest

Kein Bild

Meta-Tags — Vorschau, Bearbeiten und Generieren

so-me.studio

Slack

so-me.studio

Meta-Tags — Vorschau, Bearbeiten und Generieren

Mit Meta-Tags kannst du deine Inhalte bearbeiten und ausprobieren und dann in der Vorschau sehen, wie deine Webseite auf Google, Facebook, X und mehr aussehen wird!

Meta-Tags entscheiden, wie deine Seite aussieht, wenn sie auf Social Media, in Suchergebnissen und in Chat-Vorschauen geteilt wird. Machst du sie falsch, sieht dein Link auf LinkedIn kaputt oder auf Slack unlesbar aus. Dieser kostenlose Meta-Tags-Generator zeigt dir deine Open Graph + Twitter Card Tags in der Vorschau auf jeder großen Plattform — Google, Facebook, X, LinkedIn, Pinterest, Slack — bevor du veröffentlichst.

What meta tags actually do

Three categories of meta tags control how your page appears across the web. (1) SEO tags — `<title>` and `<meta description>` decide your Google search appearance. (2) Open Graph (og:*) tags control Facebook, LinkedIn, Slack, and most chat-app previews. (3) Twitter Card tags (twitter:*) control X previews specifically.

Without meta tags, platforms guess — usually pulling random text from your page and the first image they find. The result looks broken. With proper meta tags, you control the entire preview.

Required meta tags every page needs

Bare minimum for a polished preview: `<title>` (60 chars), `<meta name=description>` (160 chars), `<meta property=og:title>`, `<meta property=og:description>`, `<meta property=og:image>` (1200×630 recommended), `<meta property=og:url>`, `<meta property=og:type>` ('website' for most pages).

For Twitter-specific control: `<meta name=twitter:card>` ('summary_large_image' usually), plus twitter:title, twitter:description, twitter:image overrides if you want a different preview on X.

The generator outputs all of these from your inputs.

OG image specs that work everywhere

1200×630 pixels (1.91:1 ratio) — works on Facebook, LinkedIn, Twitter, Slack, Discord, iMessage. Smaller images get auto-cropped weirdly; larger images get downsampled.

Under 5 MB file size — some platforms reject larger files. JPG or PNG. Include readable text on the image itself — many platforms show OG images in feed before any caption text, so the image needs to communicate value on its own.

Debugging meta tag previews

Most platforms cache OG data aggressively. If you update your meta tags but the old preview still shows, use these debuggers to force a refresh:

- Facebook: Facebook Sharing Debugger (developers.facebook.com/tools/debug) - X: X Card Validator (cards-dev.twitter.com/validator) - LinkedIn: LinkedIn Post Inspector (linkedin.com/post-inspector) - Pinterest: Pinterest Rich Pin Validator (developers.pinterest.com/tools/url-debugger) - Google: Rich Results Test (search.google.com/test/rich-results)

Each debugger forces a re-crawl of your page so the new meta tags propagate.

Tipps, um das Beste aus diesem Tool herauszuholen

  • OG image: 1200×630 px. Works on every major platform.
  • Add readable text on the OG image — many feed previews show image before caption.
  • Title: 60 chars max. Above that = Google truncation.
  • Description: 150-160 chars. Same truncation rule.
  • After updating meta tags, run platform debuggers to force-refresh the cache.

Häufig gestellte Fragen

Is the meta tags generator free?

Yes. Free, no signup, unlimited.

What size should my OG image be?

1200×630 pixels (1.91:1 ratio). Works on Facebook, LinkedIn, X, Slack, Discord, iMessage without auto-cropping.

Do I need both Open Graph and Twitter Card tags?

Open Graph alone covers most platforms (X falls back to OG if Twitter tags are missing). Add Twitter Card tags only if you want a different preview on X than other platforms.

Why doesn't my updated meta tag show in Facebook previews?

Facebook caches OG data. Use Facebook's Sharing Debugger to force-refresh the cache after updating tags.

What's the difference between meta description and OG description?

Meta description shows in Google search results. OG description shows in social media previews. They can be the same or different — set OG description specifically if you want different social vs search copy.

Ähnliche kostenlose Tools

Einmal planen.
Überall posten.

Schluss mit dem Tab-Chaos — entwirf, passe an und veröffentliche auf 20 Plattformen aus einem einzigen Kalender.

Kostenlos testenLive-Demo ausprobieren