Open Graph Meta Tags

Updated 2026-09-10 · 3 min read

What Open Graph tags control

Open Graph tags tell social apps what title, description, image, and URL to show when someone shares a page. Without them, platforms guess from the page content, and the result can be cropped, outdated, or missing the strongest call to click.

The core tags

Most pages need a small, consistent set of tags. Add them inside the document <head>, keep the values aligned with the visible page, and make sure every URL is absolute.

Twitter Card tags

X and some other clients can use Twitter Card tags for layout. twitter:card with summary_large_image usually gives the best preview for articles, tools, and landing pages. Add twitter:title, twitter:description, and twitter:image when you want exact control instead of relying on Open Graph fallback.

Image rules that prevent broken previews

Use an HTTPS image that can be fetched without cookies, redirects, or hotlink protection. A 1200 by 630 image is the common safe choice. Avoid tiny logos, text-heavy screenshots, and images blocked by robots or private storage permissions. If the platform already cached the wrong preview, use its sharing debugger after publishing the fix.

Use the generator

Open the Meta Tag Generator, enter the page title, description, canonical URL, and image URL, then copy a complete SEO, Open Graph, and Twitter Card tag set. Pair it with the meta description length guide so the search snippet and social preview work together.

Try the Meta Tag Generator →Generate complete HTML meta tags for SEO, Open Graph (Facebook, LinkedIn) and Twitter Cards. Free, instant, copy-paste ready.

Frequently asked questions

Do Open Graph tags help SEO rankings?

Not directly. They improve how links look when shared, which can improve clicks, mentions, and referral traffic.

Can I use a relative URL for og:image?

No. Use a full HTTPS URL so social crawlers can fetch the image from outside your site.

Should every page use the same preview image?

Important pages should use relevant images. A generic site image is acceptable for simple pages, but guide and product pages perform better with matching previews.

More guides

Meta Description Length: How Long Should It Be?Keep meta descriptions to about 150–160 characters on desktop and 120 on mobile. See pixel limits, truncation rules and a template for writing them fast.SEO-Friendly URL Structure: Rules and ExamplesHow to structure URLs for SEO: slug length, hyphens vs underscores, stop words, trailing slashes, parameters and safe URL changes with redirects.URL Slug Best PracticesHow to turn a title into a clean URL slug: length, stop words, accents and Arabic transliteration, dates, uniqueness, and what to do when a slug has to change.HTML Entities and EscapingLearn when to escape HTML, which characters need entities, how encoding helps prevent XSS, and when decoding HTML entities is safe.