HTML title tag: how long it should be, examples that work, and why Google rewrites it

The HTML title tag is the <title> element in a page’s head. Browsers show it in the tab, bookmarks and history keep it, and Google usually shows it as the clickable headline of a search result. Usually, not always. Google builds that headline, which it calls a title link, from several sources, and it uses other text when it decides your title describes the page badly. There is no official length limit either: Google cuts long titles to fit the screen. This guide covers what the tag is, how Google picks a title link, how long a title should be in practice, examples of weak and strong titles, where the brand name goes, and what is actually known about titles in AI answers.

Look before you rewrite. A title that reads well in your editor can be cut off or replaced in results. The free SERP preview shows a title and description the way Google lays them out, on desktop and on mobile, so you see the result as a searcher would.

The nine sources are listed in Google’s title link documentation^[1]. The 87% is Google’s own figure from September 2021, the newest it has published that we could find^[2]. Zyppy’s figures come from its own study, which counted any change down to one word, so the two numbers measure different things. Zyppy notes the real rewrite rate is likely higher than it measured, because titles can vary by query and device^[3].

What the HTML title tag is

It sits in the <head>, it holds plain text, and there is only one: “There must be no more than one title element per document”^[4]. MDN adds that any HTML tags written inside it are treated as plain text^[5]. People using screen readers often hear the title before anything else on a page. The W3C’s accessibility guidelines make a descriptive title a Level A requirement: “Web pages have titles that describe topic or purpose”^[6].

The names vary. SEO tools say title tag, SEO title tag, page title or meta title, and all of them mean this one element. “Meta title” is a slight misnomer: the title is an element of its own, not a <meta> tag. The short text under it in search results is a separate tag, the meta description, with rules of its own.

Here is this page’s own markup, with the other tags left out:

<head>
  <title>Title Tags: Length, Examples, Rewrites · CoreCited</title>
  <meta property="og:title" content="Title Tags: Length, Examples, Rewrites" />
  <meta property="og:site_name" content="CoreCited" />
</head>
<body>
  <h1>HTML title tag: how long it should be, examples that work, and why Google rewrites it</h1>
  ...
</body>

The <title> carries the brand. The og:title does not, because og:site_name already names the site. The H1 is longer and says more. Each does a different job, which is the next section.

Title tag vs H1 vs og:title

Three pieces of text name a page, and they are easy to confuse.

The HTML standard expects the title and the main heading to differ: “The document’s title is often different from its first heading, since the first heading does not have to stand alone when taken out of context”^[4]. Its own example pairs the title “Dances used during bee mating rituals” with the heading “The Dances”. The title must make sense in a tab or a list of results. The heading can lean on the page around it.

Different is not the same as unrelated. Google uses headings when it builds title links, and it changes titles that don’t reflect the page^[1]. Microsoft’s Bing team says the H1 “should match (or closely reflect) the page title”^[7]. Zyppy’s study saw the effect with numbers: when both the title and the H1 contained a number, Google kept a number in the title link 97.3% of the time^[3]. Our rule: same subject, same facts, same year. The wording can differ, as it does on this page. The heading checker compares any page’s H1 with its title and tells you whether they share a subject.

og:title is for link previews. The Open Graph protocol defines it as “The title of your object as it should appear within the graph” and makes it one of four required properties^[8]. Social networks and chat apps read it to build a link card, and Google lists it among its sources for title links too^[1]. The Open Graph protocol covers every og tag, and LinkedIn post preview shows what happens when a card goes stale.

How Google builds a title link

Google calls the headline of a search result a title link. Its generation “is completely automated and takes into account both the content of a page and references to it that appear on the web”^[1]. Google lists nine sources, in this order:

1. Content in <title> elements
2. Main visual title shown on the page
3. Heading elements, such as <h1> elements
4. Content in og:title meta tags
5. Other content that’s large and prominent through the use of style treatments
6. Other text contained in the page
7. Anchor text on the page
8. Text within links that point to the page
9. WebSite structured data

Google adds that it has to recrawl and reprocess a page to notice changes to these sources, “which may take a few days to a few weeks”. It does not edit by hand: “we can’t manually change title links for individual sites”^[1]. The title link is one part of a results page; What is a SERP? covers the rest.

A short history

Google has used text beyond the title element since 2012^[2]. In August 2021 it changed its system to make more use of text people can see on the page, such as the main visible headline. It also said titles would stop shifting with each search: “Before this, titles might change based on the query issued. This generally will no longer happen with our new system”^[9]. After site owners pushed back, Google said in September 2021 that title elements “are now used around 87% of the time, rather than around 80% before”^[2]. We could not find a newer figure from Google.

Why Google rewrites title tags

When Google detects a problem, it says it may “generate an improved title link from anchors, on-page text, or other sources”^[1]. Its documentation names seven common problems. The examples in the table are Google’s own. The fixes are ours.

Google adds one special case: its systems will likely not show flight prices in title links, because the prices change too fast to stay accurate^[1].

Third-party data points the same way. In Zyppy’s study of 80,959 titles from early 2022, titles over 70 characters were rewritten 99.9% of the time, and titles of 1 to 5 characters 96.6% of the time. Titles of 51 to 60 characters were rewritten least, between 39% and 42% of the time. Text in square brackets was removed completely 32.9% of the time, against 19.7% for text in parentheses^[3]. That is one study with its own method, a few years old, but it matches Google’s list.

Title tag length: no limit, only a width

Google’s documentation is direct: “While there’s no limit on how long a <title> element can be, the title link is truncated in Google Search results as needed, typically to fit the device width”^[1]. It also asks you to avoid “unnecessarily long or verbose text”. So most questions about meta tag title length have an awkward answer: Google publishes no number.

The numbers everyone quotes are measurements. MDN says search engines typically display about the first 55 to 60 characters of a title^[5]. Zyppy puts Google’s desktop cut at about 600 pixels, roughly 50 to 60 characters, and finds that mobile results often show more^[10]. Zyppy itself warns that the 600-pixel guideline “can be misleading”, and that “Google changes this limit with some frequency”^[10].

Pixels matter more than characters because letters differ in width. A title in capitals, or full of wide letters such as W and M, reaches the edge sooner than one full of narrow letters such as i, l and t. That is our illustration, not a measurement, but it is why a character count is only a proxy.

Too short is a problem too. In Zyppy’s data, any title of 20 characters or less had a better than 50% chance of being rewritten^[3]. Google names vague titles such as “Home” for a home page or “Profile” for a person’s profile as ones to avoid^[1].

What we do on this site

Every page here gets “ · CoreCited” added to its title by the site layout. That is 12 characters the person writing the page never sees. So an automated test caps each page’s own part at 48 characters, which keeps the full title within 60. This page’s title renders as “Title Tags: Length, Examples, Rewrites · CoreCited”, which is 50 characters. The 60 is our working number, picked from the observations above. It is not a Google rule.

Page titles and SEO: how much the title counts

Google does use the title in ranking, but it says little about how much. In 2021 John Mueller said “we do use titles as a tiny factor in our rankings as well”, and that “essentially your page is what we use as a basis for the rankings”^[11]. The bigger job is the click. Google’s starter guide says the title link “can help people decide which search result to click”^[12], and its title link guide calls it “often the primary piece of information people use to decide which result to click”^[1].

That is why stuffing doesn’t pay. Google’s example of a stuffed title is “Foobar, foo bar, foobars, foo bars”, which it says “doesn’t help the user” and “can make your results look spammy to Google and to users”^[1]. A good SEO title tag is not a list of keywords. It is one clear name for the page, in the words a searcher would use. Keyword stuffing covers where the line sits.

Title tag examples: weak and strong

The examples below are our own illustrations for an invented bakery, not titles from real sites. Each weak version has a problem from Google’s list or from the length data above. Each strong one fixes it.

Three patterns repeat. The subject comes first, so truncation removes the brand rather than the point. Each title names something only that page has. And the title describes what the page holds now, not what it held last year.

Brand placement: front or back, and which separator

Google’s advice is that a home page title can say more about the site, but on other pages you should “consider including just your site name at the beginning or end of each <title> element, separated from the rest of the text with a delimiter such as a hyphen, colon, or pipe”^[1]. It doesn’t say which end. Mueller called the choice “more a matter of personal taste and decoration rather than anything related to how ranking would work”^[11].

Two facts tip most pages toward the end. First, truncation cuts the end of a title, so a brand placed last is what gets cut, not the subject. Second, accessibility. MDN advises “surfacing the primary purpose of the page first, followed by the name of the website”, so screen reader users hear what a page is about before the site name, on every page they open^[5]. Our view: the front suits the home page, and pages people reach by searching for the brand, such as a login page.

Google may drop the brand anyway. It shows a site name with each result, separate from the title link^[13], and it “may omit the site name from the title link, if it’s repetitive with the site name that’s already shown in the search result”^[1]. To influence which site name Google shows, it calls WebSite structured data on your home page “most important”^[13].

On separators, the only data we found is observational. Zyppy saw Google remove or replace pipes 41.0% of the time, and remove dashes 19.7% of the time^[3]. That is one study from 2022, not a Google rule. This site uses a middle dot, which Zyppy did not measure. Pick one separator and use it everywhere.

In Next.js, a title template adds the brand once for every page. The template can add “a prefix or a suffix to titles defined in child route segments”, and a page can opt out with title.absolute^[14]. This site does it like this, simplified:

// app/layout.tsx: the brand is added once, for every page
export const metadata = {
  title: {
    default: "CoreCited",
    template: "%s · CoreCited",
  },
};

// app/blog/title-tags/page.tsx: the page writes only its own part
export const metadata = {
  title: "Title Tags: Length, Examples, Rewrites",
};

// What the browser receives:
// <title>Title Tags: Length, Examples, Rewrites · CoreCited</title>

For how titles and other metadata reach crawlers on a Next.js site, see the Next.js SEO guide.

Titles and AI answers

Start with what is documented. Google says the usual SEO best practices still apply to its AI features, and that “There are no additional requirements to appear in AI Overviews or AI Mode, nor other special optimizations necessary”^[15]. So for Google’s AI features, a good title is the same as a good title for search.

Microsoft goes a step further. Its Bing team wrote in 2025 that “Your page title, description, and H1 tag (the top-level HTML heading) are important signals AI systems use to interpret purpose and scope”, and that page titles “should clearly summarize what the content delivers”^[7]. It gives no weights, and says there is “no secret sauce that guarantees selection in AI answers”.

OpenAI’s, Anthropic’s and Perplexity’s crawler documentation, read on 6 October 2026, says nothing about titles^[16][17][18]. No AI company we checked publishes how much a title counts. A claim that a title formula gets a page cited by ChatGPT is a guess.

How AI tools choose their sources more broadly is covered in how AI assistants decide which sources to cite.

How to preview and check a title

Three quick checks, from the raw HTML to what searchers see.

View the source. Open the page, view its source, and search for <title>. That is the title in the HTML your server sent. A crawler that does not run JavaScript reads that one and nothing else.

Ask the browser. In the developer console, document.title returns the title the browser is using now^[4]. If it differs from the source, a script changed it after the page loaded.

// Paste into the browser console on the page you are checking

document.title
// The title the browser is using now, after any scripts have run

document.head.querySelectorAll("title").length
// Should be 1: the HTML standard allows no more than one

Preview it. Paste the title and description into the SERP preview to see them laid out as a Google result, on desktop and on mobile, before you publish.

Checking every title on a site

A preview checks one title at a time. On a real site, title problems are usually template problems: one broken template produces hundreds of half-empty or identical titles. CoreCited’s Site Audit reads the <title> on every page it crawls and flags missing titles, titles that are too short or too long, titles without your brand name, and titles shared by more than one page. The free account audits 10 pages, and every limit is on the pricing page. The same checks appear in the AI search checklist, if you would rather go through them by hand.

Questions people ask

Sources