og:title vs HTML Title and og:description vs Meta Description
Search metadata and social metadata overlap. When to reuse one for the other, and when to write both.
A page has two sets of headline-and-summary metadata: the HTML <title> and meta description, written for search engines and browser tabs, and og:title and og:description, written for link cards. They often contain the same words, and sometimes they should not.
Who reads what
| Tag | Read by | Shown as |
|---|---|---|
| <title> | Browsers, search engines, bookmarks | Tab title, search result headline |
| meta description | Search engines | A candidate for the search result snippet (engines may write their own) |
| og:title | Social platforms and chat apps | The headline of a link card |
| og:description | Social platforms and chat apps | The summary on a link card |
How fallbacks work
When og:title is missing, many platforms fall back to the HTML <title>, and when og:description is missing they may use the meta description. That makes a page with good HTML metadata and no Open Graph tags look acceptable, but the fallback is not guaranteed and varies by platform. The preview in the Open Graph & Social Preview Analyzer marks every value that came from a fallback, and labels HTML-level fallbacks as platform-dependent.
When to keep them the same
- Pages where the search title is already a good headline, such as documentation and tool pages.
- Small sites where maintaining two sets of copy is not worth the effort.
When to write them differently
- The <title> carries the site name and keywords for search, for example "Redirect Checker | Example", while the card headline should read naturally on its own.
- A card shows the site name separately, so repeating it in og:title wastes space.
- A social summary can be more conversational than a search snippet.
Length guidance
There are no universal limits, and platforms truncate at different points and on different devices. As a starting point, keep the HTML title around 60 characters, og:title under about 90, and descriptions to one or two sentences, with the important words first. The analyzer only recommends, and explains its thresholds: it does not fail a page for being a little long.
Common problems
- An empty or placeholder value such as Untitled or an unrendered {{title}}.
- Different values coming from a theme and an SEO plugin at the same time.
- Descriptions copied from the first paragraph, cut mid-sentence.
- Titles that never mention what the page is about.
Write for the reader
Both sets are the first thing a stranger reads about your page. Say what the page is and why it is useful, in plain words.
For the other tags involved, see Open Graph meta tags explained and Twitter/X Card tags explained.
Frequently asked questions
- Does og:title have to match the title tag?
- No. They are separate. Matching is fine and common, but social headlines are sometimes shorter or phrased differently from the search title.
- What happens if og:title is missing?
- Platforms commonly fall back to the HTML <title>, but this is platform-dependent, so it is safer to set og:title.
- Does og:description affect search rankings?
- It is read by social platforms, not used by search engines as a ranking signal. The meta description influences the snippet search engines may show, although they can write their own.
- How long should these be?
- There is no universal limit. Titles of around 60 characters and descriptions of one or two sentences usually display well, but truncation varies by platform and device.
Try it yourself
The tool that pairs with this guide.
Did this help you untangle your redirects?
If these free developer tools save you time, consider buying me a byte. Your support helps keep DevCraftKit free and growing.
Related articles
What Are Redirect Chains? Causes, Impact and How to Fix Them
Several hops where one would do: how redirect chains form, what they cost, and how to find and fix them.
Published
301 vs 302 vs 307 vs 308 Redirects: Which Status Code to Use
Two questions decide the code: is the move permanent, and must the request method be preserved?
Published
What Is Open Graph and How Does It Work?
The meta tags behind every link card: what Open Graph is, how platforms use it, and how a preview is built from your page.
Published