Meta Title: What It Is and How to Get It Right

What is a meta title and how is it different from a title tag, H1 or og:title?

Meta title, title tag, page title and SEO title are four names for one thing: the title element inside the head element of an HTML document. The word "meta" misleads people, because the title is not a meta element and has no name or content attributes, unlike the meta description.

<head>
  <title>Fresh Sourdough Bread and Pastries in Austin | Rise Bakery</title>
  <meta name="description" content="Daily loaves, croissants and custom cakes.">
</head>

The WHATWG HTML Standard allows one title element per document, with text only. The MDN title element reference adds that anything inside it is read as plain characters, never as markup. That text becomes the search result headline, the browser title on the tab, the bookmark name and the first thing a screen reader announces.

Meta title and title tag are the same thing

You will meet this one element as title tag, page title, SEO title, document title and, for the version shown in results, SERP title. Plugins label the field differently and our report says title tag, but they all edit the same title element in the head.

Meta title vs H1

The title lives in the head and wins the click on a results page. The H1 lives in the body and welcomes the reader who has arrived. They can share the keyword without being copies. For the heading side, read how H1 headings are tested.

Meta title vs og:title

The og:title tag, part of the Open Graph protocol, controls how a shared link looks on social platforms. Google can also fall back on it as a source for a result headline. Our guide to social media meta tags covers og:title and twitter:title.

Why your meta title matters for SEO and clicks

Google Search Central lists the title element first among the sources Google uses to build the title link of a result. A clear title therefore helps the search engine understand the page, and Bing reads the same tag. It is also the first line a searcher reads on the SERP, so a title that names the topic and the benefit usually earns more clicks than a vague one such as "Home". No honest figure exists for how much a better title lifts the click-through rate, because it depends on the query and on what else sits in the results.

Accessibility matters too. WCAG 2.2 Success Criterion 2.4.2 Page Titled, explained in the WCAG page titled criterion, asks for titles that describe the topic or purpose of a page.

The Keywords Usage check takes your most repeated words and marks whether each also appears in the title, description and headings. Be realistic: the title is a relevance signal and a click driver, not a ranking lever, and it will not rescue thin content.

How SEO Site Checker tests your meta title

This is the logic behind the Title row in our report.

The rule: the page must contain exactly one title element, and after trimming spaces at both ends its text must be 10 to 70 characters long, inclusive. Length is counted in characters, not pixels.

What the check reads

Our audit opens your URL in headless Chromium, waits for the load event and reads the rendered HTML. JavaScript that runs before the load finishes is included, so a title set by a script is seen, but one added much later may be missed. The check collects every title element in the whole document, not only those in the head, so an inline SVG title used to label a logo counts as an extra title tag.

With one title, the text is trimmed and its characters counted: spaces inside count, leading and trailing ones do not. If a bot protection challenge answers instead of your site, the report shows a notice and judges the challenge page's title.

Pass, warning and fail rules

One title element of 10 to 70 characters passes. A missing title, or one that is empty or only spaces, fails. A single title shorter than 10 or longer than 70 characters is a warning, and so is any page with more than one title element.

The on-screen advice is stricter than the pass range. Every length message recommends 50 to 60 characters, the sweet spot for fitting a result without a cut, so a title of 45 or 65 characters passes but may waste space or get shortened.

What you see in the report

A pass shows a green tick, a line saying the page uses a good title tag, and the text with its character count. A warning or failure shows an amber or red marker, a message, the text and length, and a red How to Fix button. With several titles, each is listed with its own length and the message counts the extras, so two titles read as one. A missing title shows a length of 0.

Outside this check are pixel width, keyword fit, uniqueness across your site and brand placement, and a pass does not guarantee that Google shows your exact words.

Run the free SEO score checker

How long should a meta title be?

This table maps each meta title length band to our report's result.

Google states no fixed meta title character limit. It shortens titles to fit the device width, so guides quote a title pixel width, usually about 600 pixels on desktop, as a rule of thumb. When a title is too wide, title truncation adds an ellipsis in search results, so the words at the end are the ones readers never see.

Width is why two titles of the same length behave differently: wide capitals such as W and M take far more room than a lowercase i or l, so a 58 character title in capitals can be cut while a lowercase one fits. Front-loading keywords is the answer, because a shortened title still carries the point.

How to check your meta title

1. View the source. Press Ctrl+U (Cmd+Option+U on a Mac) or right-click and choose View Page Source, then search for the opening title tag. You should find exactly one match. Raw source misses a title that JavaScript adds later.
2. Ask the console. Run the three lines below in the Chrome DevTools Console, a quick title length checker. The first should return 1 and mirrors our check, since it counts SVG titles too. The second returns the character count, which should be 10 to 70, and the third prints the text. The browser collapses repeated spaces, so its count may differ from ours by a character.
3. Run the free report. Read the Title row for the text, its length and any extra title tags.
4. Compare with other tags. To see the title beside every other tag, paste the URL into the meta tag analyzer.

document.querySelectorAll('title').length  // expect 1
document.title.trim().length               // expect 10 to 70, ideally 50 to 60
document.title                             // the live text

Lighthouse audits a missing title and Google Search Console shows the HTML Googlebot fetched, but neither counts extra title tags as our report does.

How to fix a missing, too long or doubled meta title

Whatever the report flagged, the routine is the same: find where the title is set, correct it, print it once, then test again. A clean head looks like this.

<head>
  <meta charset="utf-8">
  <title>Waterproof Women's Hiking Boots, Trail Tested | TrailNest</title>
</head>

If you have no title yet, our meta tag generator will produce correctly formatted tags.

Missing or empty title

For a missing title tag, add one title element inside the head with the primary keyword near the start. Republish and clear any page cache, or the checker keeps seeing the old HTML. A title of only spaces fails the same way.

Too short or too long

Rewrite the title to about 50 to 60 characters. Keep the main keyword and the point of the page inside the first 50, and move the brand name to the end, where a cut costs least.

More than one title tag

Multiple title tags mean a second system is writing to the page. The usual suspects are below.

• Theme and plugin both print one. A theme that outputs its own title while an SEO plugin prints another is the classic WordPress case.
• A hard coded title. A title element typed into header.php years ago and never removed.
• Builders and snippets. A page builder or tracking snippet can inject a title quietly.
• A head manager that appends. Some JavaScript frameworks add a new title instead of replacing the old.
• An inline SVG logo. A logo drawn with a title child counts as a title element in our report.

To find the culprit, search the page source for "<title" and note each line number, or expand each node that document.querySelectorAll('title') returns in the console: its parent shows whether it sits in the head or inside an svg.

<!-- Wrong: three title elements, one hiding in the SVG logo -->
<title>Rise Bakery</title>
<title>Fresh Sourdough Bread and Pastries in Austin | Rise Bakery</title>
<svg viewBox="0 0 40 40"><title>Rise Bakery logo</title></svg>

<!-- Right: one title in the head, logo labelled with aria-label -->
<title>Fresh Sourdough Bread and Pastries in Austin | Rise Bakery</title>
<svg viewBox="0 0 40 40" role="img" aria-label="Rise Bakery logo"></svg>

Google reads the title in the head, so a title inside an SVG does not hurt how your result appears. Our check counts every title element in the document, so it still warns. Switching to role="img" with an aria-label keeps the logo accessible and clears the warning.

On WordPress, let the theme declare title tag support, let the SEO plugin edit the value, and keep header.php free of any hard coded title.

<?php
// functions.php
add_action( 'after_setup_theme', function () {
    add_theme_support( 'title-tag' );
} );

Then header.php needs only the usual wp_head() call inside the head element, which prints the single title.

Finish by reloading the page and re-running the console check and the report.

How to change your meta title in WordPress, Shopify, Wix and plain HTML

The field has a different name in every system, but it always ends up as the same title element. If a menu looks different, search for SEO title or title tag.

WordPress

Edit the Yoast SEO title or Rank Math title field, then click Update. Both plugins build the title from a template with a site name variable such as %%sitename%%, so typing the brand by hand as well prints it twice and eats your length budget. Check the snippet preview before counting characters. With no plugin, the theme needs title tag support, as in the PHP sample above.

Shopify

Set the home page title in the online store preferences. Products, collections and pages use the search engine listing editor, where the SEO title can differ from the item name. Check the live page, because themes often add the store name and a 58 character title can quietly become 75.

Wix

Open the pages menu, choose the page and go to its SEO basics, where the title tag field lives. Repeat for every page, then publish.

Next.js and plain HTML

In the Next.js App Router, export a metadata object from the page or layout. A child page title overrides the layout title, so for a shared brand suffix set a title template in the layout.

// app/layout.js
export const metadata = {
  title: { template: '%s | Rise Bakery', default: 'Rise Bakery' },
};
// app/menu/page.js
export const metadata = { title: 'Fresh Sourdough Bread and Pastries in Austin' };

On plain HTML, edit the title element in each file's head and clear any cache.

Meta title best practices that hold up

• Keyword first, sentence second. Put your main keyword in the first few words for solid primary keyword placement, then make the whole line read like something a person would say.
• One title per page. Unique page titles help people and search engines tell pages apart.
• Match the search intent. A how-to, a list and a product page each need a different shape.
• Brand last. Add the brand name in the title with a pipe separator or a colon at the end, and only when it helps recognition.
• No tricks. Skip keyword stuffing, all caps and an outdated title carrying an old year.
• Stay close to the H1. A title mismatch with the H1 makes visitors wonder if they landed on the right page.

Title formulas and click tactics live in a separate guide on writing meta titles that get clicks.

Before and after examples

Here are three good meta title examples and two that don't work, with the count and our report's verdict.

All three good ones lead with what the page offers, and two put the brand last. The final example repeats one phrase in five forms, which reads as spam and gets cut early.

Common meta title mistakes and why Google rewrites titles

Most weak titles trace back to a few habits: boilerplate titles, so the same title on every page, keywords stuffed in until the line reads like a list, and a long brand name placed first so the keyword is cut. Others are an outdated title with an old year, a title mismatch with the page, and duplicate title tags after a theme or plugin change.

Our report catches only the missing, empty, out-of-range and doubled cases. Boilerplate, stuffing, stale years and mismatches pass, so you have to catch them by reading your titles.

Google may rewrite it: Google can build a result headline from the title element, the main heading, an H1, the og:title or even anchor text, when it judges your title half empty, outdated, repeated across pages or a poor match.

The Google title link guidance explains this and also covers length and branding. A pass in our report therefore does not guarantee that Google shows your exact text. A specific title that honestly matches the page gives Google little reason to replace it.