Why Google Shows a Different Title Than Your Title Tag

The writing craft - length, intent, brand last - lives in How to write title tags and meta descriptions. The launch pass is A pre-launch checklist for a new web page. This page is the incident: why the blue link does not match the tag, how to see the live strings, and when the rewrite is doing you a favor.

DevOkk.com is a set of 112 browser tools with no account. SERP Snippet Preview and Open Graph Preview work from fields you type. Meta Tag Extractor is different: it fetches the URL. That fetch sends a hostname. Only use it on public pages you operate. Analytics still load on DevOkk like any other site; that is in the privacy policy. None of these tools encrypt a page, and none of them are Google’s ranking system.

Three titles that are not the same job

People say “the title” as if a page has one. It usually has three, and they are allowed to disagree.

The HTML title is <title> in the first document. Tabs show it. Crawlers start from it. If it is missing, duplicated across fifty tool routes, or only written by JavaScript after paint, you have already lost control of the default.

The H1 is the heading a human sees under the nav. Google can lift it into the SERP when the title tag is a keyword pile or a brand suffix with no job name. If the H1 says “Welcome back” and the title says “JSON Formatter - Validate JSON Online Free Best Tool 2026,” the rewrite is not mysterious.

The Open Graph title is og:title. Slack and iMessage read that, not the blue search link. A perfect og:title does not fix Google. A perfect <title> does not fix Slack. Treat them as two cards. The Slack incident is Why Slack and Facebook show the wrong link preview image. The tag meanings are How Open Graph tags control link previews.

When the three strings match closely, Google has less reason to invent a fourth. When they fight, Google picks a winner. Your job is to make the fight unnecessary, then check search and chat separately.

Pixel width is not a character count

Guides still say “keep titles under 60 characters.” That is a draft budget, not a law. Google measures pixels. A title full of W and M dies earlier than a title full of i and l. A string of 58 narrow characters can fit. A string of 48 wide ones can truncate.

SERP Snippet Preview is that width check. Type the title and description you intend to ship. Look at a typical desktop result and a narrower mobile line. If the last visible word is “and” or your brand with the job cut off, shorten the noun phrase. Do not treat the preview as a live SERP. It does not know the query. It does not run Google’s rewrite. It is a design tool so you stop shipping a title that only looks complete in a monospace editor.

Truncation and rewrite are different injuries. Truncation keeps your words and cuts the end. Rewrite replaces the line. People fix the wrong one: they add more keywords because the SERP “looks short,” then Google throws the whole tag out.

Brand suffixes that eat the job

JSON Formatter | Acme Tools | Free Online Utilities | Home is how a rewrite gets invited. The unique noun is first, then three brand clauses. On mobile, the useful words survive or they do not. Often Google keeps the brand and a heading from the page, or splices a sitelink label, because your tag did not finish a sentence.

Brand at the end is fine when it still fits: JSON Formatter - DevOkk. Brand first is how you become DevOkk | JSON Fo…. The tab already shows a favicon. The SERP does not owe you a billboard.

Sitelinks make this worse. Google may show your homepage title plus a child page name. If the homepage title is a slogan, every sitelink inherits the slogan. Fix the homepage tag and the child H1. Do not stuff both with the same keyword list.

Tool sites are especially noisy. Twenty routes inherit Free Developer Tools | Brand. On-page SEO for tool pages is the pattern: one job per URL, title matches H1, canonical is the clean path. A rewrite on a tool page is often “the template title is not about this form.”

Keyword stuffing is a rewrite trigger, not a ranking trick

A title that reads like a tag cloud - csv to json, csv converter, excel to json, spreadsheet json online free - is not a title. It is a list. Google has said for years that it may replace titles that look like that. The replacement is often the H1, a cleaner fragment from the first paragraph, or the brand plus a heading.

Stuffing also shows up as repeated nouns: Best Free JSON Formatter Tool Online | JSON Formatter | Format JSON. You already said the job. Saying it three times does not make the fourth SERP more likely to keep your words. It makes the line look like an ad from 2012.

Write a sentence a person would click. If that sentence is still accurate when Google uses it verbatim, you have a good default. If it is only accurate as a bag of tokens, you should expect a rewrite.

JavaScript titles that crawlers never see

Client-rendered apps are the other daily driver. The first HTML is <title>App</title> or the framework default. After hydration, document.title becomes the real job name. A person with JavaScript sees the right tab. A simple fetch sees the shell.

Google can execute JavaScript. It does not always wait, and it does not always get the same paint your laptop got while you were logged in. Other crawlers do not run the app at all. Search is not the only consumer of <title>, but it is the one you are debugging when the SERP looks like the shell.

Meta Tag Extractor is closer to that first fetch than your logged-in Chrome is. If the extractor shows App and DevTools shows the pretty title, believe the extractor for “what a GET of this URL returns.” Fix it in the server HTML: Next.js metadata, a prerender, a real document from the CMS. Do not “fix” it by hoping Google will run your bundle.

This is the same class of bug as empty Open Graph on an SPA. The bot never sat through your loading spinner.

The extractor is a network request

Say this out loud before you paste a URL. Meta Tag Extractor retrieves the public document so it can list title, description, canonical, robots, and social tags. That cannot happen entirely in your tab if you ask it to read a live host. The hostname goes out. Do not point it at an admin panel, an intranet, a customer staging box you are not allowed to expose, or a third-party private app.

For drafts that are not public, paste the strings into SERP Snippet Preview and Open Graph Preview. Those tools do not need to fetch your laptop. Localhost is invisible to the extractor. A preview deployment that is publicly reachable is the live check.

How to audit meta tags is the full head pass: title, description, canonical, robots, OG. Use it after you think you fixed the title. Cache and CDN can keep serving the old head for minutes. Extractor on the production host is how you stop arguing with a plugin screen.

SERP Snippet Preview is not Google

It is worth repeating because people treat the widget as a verdict. SERP Snippet Preview shows a typical result layout and a pixel budget. It does not know Search Console performance data. It does not A/B your title against the H1. It does not apply sitelinks. If Google rewrites you, the preview can still look perfect.

Use it while you write, the same way you use a character counter in a tweet box: to see overflow. Then ship. Then look at the live SERP or Search Console’s screenshot of the result. Those are different instruments.

Best free SEO preview tools is the short list of when to run extractor versus snippet versus Open Graph the morning of a launch.

Multiple title tags and leftover helmets

Some pages emit two <title> elements. A theme prints one. A plugin prints another. React Helmet or a leftover layout prints a third. Browsers pick a winner for the tab. Crawlers may see a mess. Extractor will show what is in the HTML; if you see two titles, delete one.

The same page can also set document.title in an effect that fights the server tag. You get a flicker in the tab and a coin flip in the index. Pick one writer. In a CMS, that is usually the SEO plugin. In Next.js, that is the metadata API for that route, not a random useEffect in a shared header.

WordPress compounds this. Yoast or Rank Math store a SEO title. The theme still has a wp_title format. Another plugin injects a schema name. The featured image title is unrelated. The plugin preview is optimistic. Production HTML is the only scoreboard.

Next.js generateMetadata and the metadata export are the right place for the tag. Check the deployed HTML. ISR and a CDN can serve an old shell after you changed the file. Extractor on the public URL, not localhost:3000. If you changed the title and extractor is old, you did not deploy, or a cache is serving last week.

Soft 404s and thin pages invite a different title

Google rewrites more aggressively when the page looks like a miss. A tool URL that returns 200 with “no results” chrome, a paginated empty state, or a thin affiliate block is a soft 404 in spirit even if the status code is fine. The title you wrote for a full catalog does not match the document. Google may show a generic host name, a heading from the nav, or a fragment from another URL on the same site.

Thin parameter pages do the same thing. /tools?ref=newsletter with the same body as /tools and a unique stuffed title is a duplicate with a worse tag. Canonicalize. Do not invent a second title for a UTM.

If the page is genuinely thin, the rewrite is a symptom. Add the job, or noindex the empty state. Do not add more keywords to the tag and hope the SERP gets more specific.

A worked example: the formatter that became the homepage

You ship /json-formatter. In the CMS you set:

• Title: Best Free Online JSON Formatter Beautify Validate Minify Tool 2026 | Acme | Home
• H1: Pretty-print JSON
• og:title: Acme Developer Tools (copied from the root layout)

Search shows Pretty-print JSON - Acme. Slack shows the homepage name. You file a ticket: “Google is broken.”

Nothing is broken. The title tag is a list. The H1 is a clear job. Google picked the H1 and the brand. Slack picked OG from the layout.

The fix is alignment, not a Search Console appeal:

1. Title: JSON Formatter - Validate and Pretty-Print (check width in SERP Snippet Preview).
2. H1: the same job in human words, one heading.
3. og:title: the same job, not the homepage slogan. Preview the card in Open Graph Preview.
4. Deploy. Confirm production with Meta Tag Extractor on your own URL.
5. Wait for recrawl. The SERP can lag. The extractor will not.

If extractor still shows the stuffed title, the CMS field you edited is not the field that renders. That is a template bug, not a Google bug.

WordPress plugins lie politely

Yoast’s snippet editor is a local sketch. It does not fetch Google. It does not know your theme prepended the site name. Rank Math is the same class of tool. Use them to draft. Then view source on production or run the extractor.

Common WordPress mismatches:

• “SEO title” filled, but the theme outputs bloginfo plus post title in a format the plugin does not override.
• Homepage set to a static page whose SEO title is still “Home.”
• Archive and paginated URLs inheriting the post title with no “page 2.”
• Two SEO plugins installed; the second one wins in the head.

If you changed the title yesterday and extractor is old, purge the page cache. Then look again. Do not keep editing the plugin every ten minutes and create three cached versions.

Next.js metadata versus what you extract

title in metadata or generateMetadata is the server tag when the framework renders HTML. usePathname tricks that set document.title in the client are the SPA problem again.

template in a root layout (%s | Brand) is how every child gets a suffix. That can be good. It can also push the job off the pixel budget. Preview the resolved string, not the %s pattern. If the brand suffix forces a cut, drop the template on that route.

Open Graph in the same metadata API is a second object. Setting title does not always set openGraph.title the way you think. Extractor lists both. If search is right and Slack is wrong, you did not finish the OG fields.

Search Console is a rear-view mirror

The “how Google sees it” screenshot in Search Console can lag. It can also show a rewrite that is query-specific: the same URL gets two different titles for two queries. That is expected. Google is matching the result to the search. Your tag is still the default for the tab and for queries where the tag is a good fit.

Do not chase every query with a new keyword in the tag. You will stuff the default and lose the queries you already won. Write one honest title. Let the page body cover the variants.

International sites add another miss. The crawler got en while you were looking at de. hreflang and a locale in the URL must match the title language. Extractor the URL you actually share.

What to check before you blame Google

This is a diagnosis list, not a closer.

Is the live <title> the string you think it is? Extractor, own URL only.

Does that string overflow in SERP Snippet Preview? Fix width first if the SERP is merely cut.

Do H1 and title name the same job? If not, you invited a borrow.

Is og:title a third story? Fix chat separately.

Is the first HTML a shell? Server-render the tag.

Are there two title tags? Delete one.

Is the page thin, duplicated, or a soft 404? Fix the document.

Is the plugin preview newer than production? Deploy and purge.

If all of that is clean and Google still writes a better sentence than yours, that is the next section.

When rewriting is a gift and when it is a bug

A rewrite is a gift when your tag was a keyword list, a brand sandwich, or a leftover “Home | Brand,” and Google shows the H1 that a searcher would actually click. Click-through can go up. That is the system working. Keep the H1. Shorten the tag to match it. Do not fight to restore the stuffed version.

A rewrite is a gift when the query is more specific than the tag and Google lifts a heading that answers that query. The page was relevant. The default title was generic. You can add a more specific title if that query is the money query; you should not stuff both queries into one line.

A rewrite is a bug in your site when the first HTML is empty, the plugin and the theme disagree, the layout leaks the homepage title, or a JavaScript title never ships. Google did not invent a fantasy. It read a bad document. Extractor will show the bad document. Fix the head.

A rewrite is a bug in your expectations when you wanted a locked SERP. You do not get one. You get a default. SERP Snippet Preview is how you make that default fit. Meta Tag Extractor is how you prove it shipped. Google still gets the last word on the blue link, and sometimes that word is clearer than the one you wrote.