The <title> Element
As defined in the HTML Living Standard, the <title> element represents the document's name or title. Although it does not appear in the body of the web page, it is the most critical metadata element for user orientation.
<head>
<title>Page Title - Site Name</title>
</head>
View HTML Living Standard: The title element
The Gateway to Accessibility
The <title> element is the very first piece of information provided to a screen reader user.
WCAG Requirement: Page Titled
Success Criterion 2.4.2 (Level A): Web pages have titles that describe topic or purpose.
A descriptive title allows users to quickly identify if the page is the one they intended to visit without having to navigate into the content. For users who have multiple tabs open, the title is the only way to distinguish between different sections of the same website.
Understand SC 2.4.2: Page TitledTechnical Requirements & Patterns
- Mandatory: Every HTML document must have a
<title>element in the<head>(unless the document is an iframe or another specific exception). - Text-Only: The title element can only contain plain text. Any HTML tags placed inside will be treated as literal text.
- Uniqueness: Each page on a site should have a unique title that reflects its specific content.
<!-- Recommended Pattern -->
<title>Specific Topic | Category | Site Name</title>
Best Practices
- Front-Load Important Keywords: Put the most unique information (the page name) first, and the site name last. This is especially helpful for users with screen magnifiers or those scanning many browser tabs.
- Conciseness: Aim for titles that are descriptive but short enough to be visible in typical browser tabs (usually around 50–60 characters).
- SEO Benefit: Search engines use the
<title>as the primary headline in search results. A well-crafted title improves discoverability for everyone.
A11y Tip: Dynamic Titles
In single-page applications (SPAs), ensure the <title> updates dynamically as the user navigates. This alerts screen reader users that a "new page" has loaded even if the browser doesn't perform a full refresh.