Meta Tag Generator
Generate optimized HTML meta tags for your website including title, description, Open Graph, and Twitter card tags to improve SEO and social sharing.
Generate Perfect HTML Meta Tags & Open Graph Previews
You can spend months writing the most insightful blog post or engineering an exceptional web application, but if your HTML meta tags are missing or poorly configured, almost no one will find it.
Meta tags are snippets of HTML code embedded inside the <head> section of your web pages. They don't appear visibly on the page itself, but they speak directly to web crawlers and social media platforms.
Google uses your title and meta description to generate your search engine results snippet. When someone shares your URL on WhatsApp, LinkedIn, Twitter/X, Facebook, or Discord, those platforms read your Open Graph (OG) tags to generate a rich visual link preview featuring your cover image, headline, and summary.
If your tags are improperly formatted, your link shares show up as an ugly naked blue text URL with a broken gray thumbnail, slashing your click-through rate by more than 80%.
Our free Meta Tag Generator creates valid, production-ready SEO and Open Graph code in real time, with live social media preview cards showing exactly how your page will look across Google, Twitter, and Facebook.
Ideal Character Limits & Image Specifications
| Tag Element | Optimal Length / Dimensions | Why It Matters |
|---|---|---|
| SEO Title Tag | 50 – 60 Characters | Titles longer than 60 characters (or ~600px width) get truncated with ugly ellipses (...) on Google mobile and desktop. |
| Meta Description | 150 – 160 Characters | Acts as your free organic search advertisement. Concise, compelling descriptions maximize Click-Through Rate (CTR). |
| OG Social Image | 1200 × 630 Pixels | Standard 1.91:1 aspect ratio ensures your banner fills social cards crisply without awkward cropping on WhatsApp or Twitter. |
| Canonical URL | Absolute URL (https://) | Tells search engines the authoritative version of the page, preventing duplicate content penalties caused by URL parameters. |
3 Outdated SEO Habits to Stop Immediately
- Stop Using the "keywords" Meta Tag: Google officially announced way back in September 2009 that it ignores the
<meta name="keywords">tag completely. Stuffing 50 keywords into this tag only reveals your targeted terms to competitors and wastes HTML payload. - Avoid Duplicate Titles Across Pages: Every single page, blog post, and product on your site must have a unique, descriptive title. Having 20 pages sharing "Home - My Brand" confuses search engine indexers.
- Don't Use Relative Image URLs in Open Graph: Social crawlers like Facebook and WhatsApp require full, absolute URLs starting with
https://forog:image. Using a relative path like/images/preview.jpgwill result in blank thumbnails.
Frequently Asked Questions
Does Google always show my custom meta description?
Not always. Google displays your specified meta description roughly 65% to 70% of the time. If Google's algorithm feels an excerpt taken directly from your page text answers a specific user search query better, it may dynamically rewrite the snippet. However, writing a high-quality description gives you the highest control over your snippet.
What is the difference between Open Graph and Twitter Card tags?
Open Graph was originally developed by Facebook and has been adopted as the universal standard by LinkedIn, Pinterest, WhatsApp, and Discord. Twitter/X uses its own twitter:card tags, but will gracefully fall back to Open Graph tags if specific Twitter tags are omitted.
Where do I paste the generated code?
Paste the generated HTML snippet directly inside the <head> and </head> tags of your HTML document, or into your framework's metadata configuration (such as Next.js metadata object or WordPress SEO plugin).