Website title: which of the four you mean, and what to write in it

Somebody tells you to fix the website title. Before you can, work out which one they mean, because four separate things go by that name: the <title> element in the page's head, the big heading you can see on the page, the name of the site as a whole, and the title that fills the card when someone pastes your link into a chat.

Different places, different edits, different consequences, which is why "I changed the title and nothing changed" is such a common complaint. So the useful question is not what a website title is. It is where you saw the text you want to change.

Four surfaces, four titles

The browser tab is fed by the <title> element in the page's <head>. The heading you see is the <h1>, a different element in a different part of the document. The Google result shows two names, a small grey site name on top and the blue clickable line underneath. And the card in a chat window is usually built from og:title.

Four surfaces, four elements, one phrase covering all of them.

Which one are you actually editing

You rarely know the element by name. You know where you saw the text, so route from there.

That third row has a hedge in it, and the hedge is the honest part. Google lists the sources it uses to build a title link, and the <title> element is only the first of nine. The others include the main visual title, heading elements such as <h1>, og:title, prominent styled text, other text on the page, anchor text, links pointing at the page and WebSite structured data. If Google detects a problem it "may try to generate an improved title link from anchors, on-page text, or other sources."

So the four elements are not independent. They are four inputs that partly feed each other: set them consistently and they reinforce, set them carelessly and Google picks whichever it likes.

What goes in each one

The title element

It goes in the <head>, one per document, and MDN notes it contains text only, so tags inside it are treated as plain text. This fills the browser tab and is the default candidate for the search result's clickable line.

Write the page's own promise first, then the site name. Google's guidance is to keep branding concise, with the site name at the beginning or end behind a delimiter. Its other rule matters more: "It's important to have distinct text that describes the content of the page in the <title> element for each page on your site." Ten pages sharing one title is the common real problem, and it is invisible if you only look at one page.

On length, the folklore says 60 characters. Google says there is no limit on the element, and that the title link "is truncated in Google Search results as needed, typically to fit the device width." So the rule is ordering rather than a character count: identifying words at the front, where nothing can cut them off.

The visible heading

The <h1> is what a reader sees once they have arrived, usually in the hero block of whatever layout the page uses. It does not need the site name, because they are already looking at your site, and it can drop the keywords that were doing navigational work in the results.

It should still say the same thing. A page whose tab says one thing and whose heading says another feels like a redirect went wrong.

Your site name

This one surprises people, because it is a real feature with its own documentation. Google describes the site name as "the name of the site the page comes from", shown above the title link, drawn from WebSite structured data, og:site_name, the home page's <title>, heading elements and other home page text. Generation is automated, so structured data is a strong signal rather than a switch. Site names also work at the domain or subdomain level only, never per subdirectory.

Worth knowing on a free Birta project: the address a searcher sees is your Birta subdomain until you connect a domain of your own.

The share title

og:title comes from the Open Graph protocol, which defines it as "the title of your object as it should appear within the graph" and lists it among four required properties alongside og:type, og:image and og:url.

Chat apps, social platforms and preview bots read it to build the card, and each decides for itself what to do when the property is missing. Leaving it out hands that decision to whichever app your link lands in.

The formula

Purpose first, site name second. Not because marketers agree on it, but because MDN gives the accessibility reason: a common navigation technique for assistive technology users is to read the page title and infer what the page contains, so titles should surface "the primary purpose of the page first, followed by the name of the website."

Written out for a cake business in Leeds:

Home page      Wedding Cakes in Leeds | Vale Cakes
Inner page     Delivery and Setup | Vale Cakes
Article        What a three-tier wedding cake costs
One-page site  Wedding Cakes in Leeds | Vale Cakes

Whatever separator you pick, use the same one everywhere. A site where three pages use a pipe, two use a dash and one uses a colon reads as unmaintained before anyone has read a word of it.

One prompt that sets all four

There is no title box to fill in anywhere. On Birta the site is files, so all four live in the HTML your agent writes, which makes a prompt the right tool. Paste this and adjust it the way you would any brief you hand an agent:

Set the four title elements on every page of this site, consistently.

1. <title> in <head>: this page's own promise first, then " | " and the site
   name. Plain text, one per page, and no two pages get the same one.
2. <h1>: the visible heading. Same promise as the title, phrased for someone
   who has already arrived. Exactly one per page.
3. og:title in <head>: the same text as <title> without the site-name suffix.
4. On the home page only: WebSite structured data with "name" set to the site
   name and "url" set to the home page URL. Also set og:site_name to match.

Before you change anything, list every page with the title you plan to give it
so I can check that none of them repeat.

The last instruction earns its place. Uniqueness is the one rule you cannot verify by looking at a single page, and the rule most sites break.

Once the titles are set they are one line in a broader pre-launch pass, and the website audit template covers the rest.

Frequently asked questions