Meta Tag Generator
Generate essential HTML meta tags for your webpage including title, description, Open Graph, Twitter Cards, and SEO meta tags. Perfect for improving social media sharing and search engine optimization.
Meta Tag Configuration
Basic Meta Tags
Open Graph & Social
Generated Meta Tags
No meta tags generated yet
Fill in the form and click "Generate Tags"
About Meta Tags
Meta tags provide metadata about your HTML document. They're crucial for SEO, social media sharing, and browser behavior. Open Graph tags control how your content appears when shared on social platforms, while Twitter Card tags optimize the appearance on Twitter.
About Meta Tag Generator
A meta tag generator is a comprehensive SEO tool that creates optimized HTML meta tags for websites, including essential elements like title tags, meta descriptions, Open Graph tags for social media sharing, Twitter Card tags, and keywords, author and robots meta elements. This tool ensures your website has proper metadata for search engines and social media platforms, improving visibility and click-through rates.
Why use a Meta Tag Generator?
Using a meta tag generator ensures consistent, SEO-optimized metadata across your website, improves search engine rankings through proper meta descriptions and title tags, and enhances social media sharing with attractive Open Graph and Twitter Card previews. It saves time by automating the creation of complex meta tag structures and helps avoid common SEO mistakes that can hurt your website's visibility.
Who is it for?
This tool is essential for SEO specialists optimizing website metadata, web developers implementing proper HTML head sections, digital marketers improving social media engagement, content creators ensuring their articles are properly tagged, and website owners who want to improve their search engine visibility and social media presence without technical expertise.
How to use the tool
Enter your webpage title and description (required), plus the URL and site name, in the provided fields
Add optional information like the image URL and alt text, keywords, author, and Twitter handle
Open Graph and Twitter Card tags are always included, filled from the same fields
Click Generate Tags to build the complete meta tag code
Copy the generated HTML meta tags and paste them into your webpage's head section
Frequently Asked Questions
How do I generate meta tags?
Fill in your page's title and description (required), optionally a URL, site name, image URL and alt text, keywords, author and Twitter handle, then click Generate Tags. The tool outputs `<meta>` tags plus a `<title>`: charset, viewport, description, robots (always `index, follow`), Open Graph and Twitter Card tags (type `website`, locale `en_US` and card `summary_large_image` are fixed). Copy and paste into your page's `<head>`. Special characters in your values are HTML-escaped so quotes and ampersands can't break the tags. The tool does not check title or description length, does not show a search or social preview, and does not generate a canonical `<link>` or favicon tag. Runs entirely in your browser — your content never leaves the device.
What are the most important meta tags?
Essential. **`<title>`**: page title (50-60 chars, shown in browser tab and SERP). **`<meta name='description'>`**: 150-160 char summary (shown in SERP snippet). **`<meta name='viewport' content='width=device-width, initial-scale=1'>`**: mobile rendering. **`<link rel='canonical'>`**: see [Canonical URL Checker](/tools/canonical-url-checker/). **Open Graph** (`<meta property='og:title' ...>`): Facebook, LinkedIn previews. **Twitter Cards** (`<meta name='twitter:card' ...>`): Twitter/X previews. **Favicon**: `<link rel='icon'>`. Most other meta tags (keywords, generator, author) are largely ignored by modern search engines.
Is my data sent to a server?
No — generation runs entirely in your browser via JavaScript string composition. Your title, description, image URLs etc. never reach a server, never get logged. Verify in DevTools' Network tab: generating tags makes no HTTP requests. Safe for drafting meta tags for unpublished pages or proprietary content.
What length should title and description be?
**Title**: 50-60 characters. Longer titles get truncated in Google SERPs with '...'. Aim for a meaningful descriptor + brand. **Description**: 150-160 characters. Google may rewrite descriptions (using page content) — your meta description is a suggestion, not a guarantee. **Open Graph title**: similar to title, 60-90 chars work. **OG description**: 150-200 chars work for most platforms. The tool doesn't check lengths, so count characters yourself. For Twitter Cards, similar limits apply. Don't pad with keywords — descriptions are for humans, and search engines penalize keyword-stuffed snippets.
Do meta keywords still matter for SEO?
**No — Google has ignored `<meta name='keywords'>` since 2009.** Most search engines ignore it. Some tools and older systems still parse it; harmless to include. Don't spend effort optimizing keywords meta tags. Focus on: title, description, content quality, headings (H1-H6), internal linking, page speed, mobile-friendliness, and structured data ([JSON-LD schemas](/tools/json-ld-generator/) on each page). Modern SEO is about content relevance and technical health, not keyword density or keywords meta.
What are Open Graph and Twitter Card tags?
Social media preview metadata. **Open Graph** (`og:*`): Facebook's standard, used by LinkedIn, Discord, Slack, WhatsApp, and most platforms. Required: og:title, og:description, og:image, og:url. Recommended: og:type ('website' or 'article'), og:site_name. **Twitter Cards** (`twitter:*`): Twitter/X-specific, with twitter:card type ('summary', 'summary_large_image', 'app', 'player'). Modern best practice: emit both — overlap heavily but each platform reads its own. Use [OpenGraph Preview](/tools/opengraph-preview/) to verify how shares will render across platforms.
What is og:image and what dimensions should it be?
`og:image` is the URL of the image shown in social media previews. Best dimensions: **1200×630px** (1.91:1 ratio) — works well on Facebook, LinkedIn, and Twitter's `summary_large_image`. Minimum: 600×315. For Twitter's basic 'summary' card: 144×144 square (works for icons). Format: JPEG or PNG. Specify with `<meta property='og:image' ...>` plus optional `og:image:width`, `og:image:height`, `og:image:alt`. Use an absolute URL (https://...) — relative paths don't work cross-platform. Test with [OpenGraph Preview](/tools/opengraph-preview/) before relying on it.
Should I add schema.org JSON-LD too?
Often yes — JSON-LD structured data can make a page eligible for Google rich results and helps search engines understand it (Google has restricted FAQ rich results to authoritative government and health sites and removed HowTo rich results). Common schemas: Organization (with logo), BreadcrumbList, Article, Product, Person, Event, Review, Recipe. This tool does not generate JSON-LD; use the [JSON-LD Generator](/tools/json-ld-generator/). Embed as a `<script type='application/ld+json'>` in the `<head>` or before `</body>`. Verify with Google's Rich Results Test (https://search.google.com/test/rich-results) or Schema.org's validator.
Share This Tool
Found this tool helpful? Share it with others who might benefit from it!
💡 Help others discover useful tools! Sharing helps us keep these tools free and accessible to everyone.