Meta Tags & Open Graph Generator
runs in your browserFill in a form and get the title, description, canonical, Open Graph and Twitter card tags, with the checks crawlers apply and a preview of how the share looks.
Fill in what you have; only tags with a value are written. The checks under the output are what search engines and social networks actually enforce.
Page
Head tags
Previews
Search result
example.com
Untitled page
A description would appear here.
Social card
example.com
Untitled page
about this tool
What is generated
Three groups of tags, in the order they should appear in <head>: the basics
(<title>, description, canonical link, and robots, author and theme-color
when set), then Open Graph, then the Twitter card. Only fields with a value
produce a tag, robots is written only when it is not the default index, follow, and an image alt is never written without an image. Every value is
escaped for an attribute — &, <, > and " — and line breaks or doubled
spaces in the prose fields are collapsed, because a newline inside a
content attribute survives into the page and looks like a fault.
Twitter handles are normalised to a single leading @; a pasted profile URL
is reduced to the handle. When the tool changes a handle, it says so.
The checks
The notes under the output are the rules the consumers apply, not preferences:
- Search results show about 60 characters of a title and 160 of a description; both are measured in pixels, so treat these as close guides. A description under about 50 characters is often replaced with text from the page.
- Twitter cuts titles at 70 and descriptions at 200.
- The canonical URL and
og:imagemust be absolute, withhttps://. Crawlers do not resolve relative paths against the page. - A share without an image shows a grey box or the favicon. 1200 × 630 pixels suits every network; the tool cannot check dimensions, only that an image is named.
og:localeislanguage_TERRITORYwith an underscore (en_GB), not the hyphenated form of the HTMLlangattribute.theme-coloris expected as a hex colour.
The previews
The search result preview shows the title and description truncated where a
result page would truncate them, and the URL as Google displays it: host
without www, path segments separated by chevrons. The social card shows the
image (loaded from the URL you gave, so a wrong URL shows as a broken image
here just as it would in a share), the domain, title and description, in the
large or small layout the Twitter card setting asks for. Both are drawn from
the same form, so they always agree with the tags.
Limits
The tool writes the common tags well rather than every tag that exists. It
does not generate article dates, product prices, multiple images, video tags
or JSON-LD structured data, and it does not fetch your page to compare. It
cannot know an image's dimensions or whether a URL resolves. A keywords meta
tag is deliberately absent: no search engine has read it since 2009.
questions
- Why must og:image be an absolute URL?
- Because the crawler that fetches your share does not resolve relative paths against your page the way a browser does; a value of /card.png is simply discarded. Give the full https:// address, and make the image 1200 by 630 pixels, which every network accepts.
- Where do the 60 and 160 character limits come from?
- From what search results display: titles are cut at roughly 60 characters and descriptions at roughly 160, measured in pixels rather than letters, so these are close guides rather than exact rules. Twitter cards cut titles at 70 and descriptions at 200.
- What is the difference between the two Twitter card types?
- summary shows a small square thumbnail beside the text; summary_large_image shows the image full width above it. Most sites want the large one. Facebook, LinkedIn and messaging apps ignore twitter:card and read the Open Graph tags instead.
- Should I add a keywords meta tag?
- No. Google stopped reading it in 2009 and the other engines followed. It only tells competitors which terms you care about. The form does not offer it.
- What format is og:locale?
- language_TERRITORY with an underscore: en_GB, en_US, pt_BR, de_DE. It is not the hyphenated form HTML uses in the lang attribute, which is the mistake the checker looks for.