HTML Guides for title
Learn how to identify and fix common HTML validation errors flagged by the W3C Validator — so your pages are standards-compliant and render correctly across every browser. Also check our Accessibility Guides.
The <title> element is a required child of <head> according to the HTML specification. It defines the document’s title, which appears in the browser tab, is used as the default name when bookmarking the page, and is displayed as the clickable heading in search engine results. Omitting it violates the HTML standard and triggers this validation error.
Beyond standards compliance, the <title> element is critical for accessibility. Screen readers announce the page title when a user navigates to a new page or switches between tabs, giving them immediate context about where they are. A missing title forces assistive technology users to explore the page content to understand its purpose. Search engines also rely heavily on the <title> for indexing and ranking, so omitting it can hurt discoverability.
There are several common causes for this error:
- The <title> element is simply missing. This often happens in boilerplate code or quick prototypes where it’s overlooked.
- Duplicate <head> sections. If your HTML contains two <head> elements (for example, from a copy-paste error or a templating mistake), the validator may flag the second one as missing a <title>.
- The <title> is placed outside <head>. If the <title> element accidentally ends up in the <body> or before the <head>, the validator won’t count it as a child of <head>.
- The <title> is empty. While an empty <title> element (<title></title>) may not trigger this specific error, some validators will flag it separately. Always include descriptive text.
Examples
Missing <title> element
This triggers the validation error because the <head> has no <title>:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
</head>
<body>
<h1>Welcome</h1>
</body>
</html><title> placed outside <head>
Here the <title> exists but is in the wrong location, so the <head> is still considered to be missing it:
<!DOCTYPE html>
<html lang="en">
<title>My Page</title>
<head>
<meta charset="utf-8">
</head>
<body>
<h1>Welcome</h1>
</body>
</html>Duplicate <head> sections
A templating error or copy-paste mistake can introduce a second <head>, which lacks its own <title>:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>My Page</title>
</head>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>Welcome</h1>
</body>
</html>Correct usage
Place a single <title> element with descriptive text inside the <head>:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Welcome — My Website</title>
</head>
<body>
<h1>Welcome</h1>
</body>
</html>Tips for a good <title>
- Keep it concise but descriptive — aim for roughly 50–60 characters.
- Make it unique for each page on your site. Avoid generic titles like “Untitled” or “Page”.
- Front-load the most important information. For example, Contact Us — My Company is more useful than My Company — Contact Us when users scan many browser tabs.
- Avoid duplicating the <h1> verbatim; the title should provide broader context (such as including the site name), while the <h1> focuses on page-specific content.
The HTML specification requires every document to have a <title> element with at least one non-whitespace character. The title serves as the primary label for the page — it appears in the browser tab, in bookmarks, in search engine results, and is announced by screen readers when a user navigates to the page. An empty title leaves users with no way to identify or distinguish the page, which is especially problematic for accessibility. Screen reader users rely on the document title to understand what page they’ve landed on, and an empty title provides no context at all.
Browsers may attempt to display something (such as the URL) when the title is missing or empty, but this fallback is inconsistent and often produces a poor user experience. Search engines also depend on the <title> element for indexing and displaying results, so an empty title can negatively affect discoverability.
This error commonly occurs when templates or boilerplate code include a <title> tag as a placeholder that never gets filled in, or when content management systems fail to inject a title value into the template.
How to fix it
Add descriptive, concise text inside the <title> element that accurately reflects the content of the page. A good title is typically 20–70 characters long and specific enough to distinguish the page from other pages on the same site.
- Every page should have a unique title relevant to its content.
- Avoid generic titles like “Untitled” or “Page” — be specific.
- For multi-page sites, consider a format like “Page Name - Site Name”.
Examples
❌ Empty title element
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title></title>
</head>
<body>
<p>Welcome to our website.</p>
</body>
</html>This triggers the error because the <title> element contains no text.
❌ Title with only whitespace
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title> </title>
</head>
<body>
<p>Welcome to our website.</p>
</body>
</html>This also triggers the error. Whitespace-only content is treated as empty.
✅ Title with descriptive text
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Getting Started - Automated Website Validator</title>
</head>
<body>
<p>Welcome to our website.</p>
</body>
</html>The <title> element now contains meaningful text that identifies both the page and the site, making it accessible, SEO-friendly, and standards-compliant.
Ready to validate your sites?
Start your free trial today.