Page Titled ensures that every web page clearly identifies itself through a meaningful document title. The <title> element gives users immediate context about where they are and what the page contains, before they interact with any content.
This criterion exists because navigating the web without clear page titles quickly becomes confusing, especially for users who rely on assistive technologies or who move between many pages and browser tabs.
WCAG Success Criterion
2.4.2 Page Titled (Level A)
Web pages have titles that describe the topic or purpose.
Why This Matters
For screen reader users, the page title is the first piece of information announced when a page loads. If a page has no title, or a vague or repeated title, users may not know:
- What page they are on
- Whether the page is the one they intended to open
- How this page differs from other open pages
Without clear titles, users must explore the page content manually to determine its purpose, which slows navigation and increases cognitive effort. Page titles are also used by:
- Keyboard users switching between browser tabs
- Users bookmarking pages for later reference
- Users reviewing browsing history
- Users navigating search results
Intent of the Criterion
This success criterion intends to ensure that users can quickly understand the purpose of a page without reading its content.
A page title should answer a simple question immediately:
What is this page for?
This information must be available even before the user interacts with headings, landmarks, or body content.
What the <title> Element Is
The <title> element is metadata placed inside the document’s <head>. It is not visible in the page content, but it appears in:
- Browser tabs
- Screen reader announcements
- Bookmarks
- Search engine results
Example:
<head>
<title>Order History – My Account</title>
</head>To pass this criterion, the <title> element must:
- Exist
- Contain text
- Use meaningful, descriptive language
An empty or placeholder title fails.
What Makes a Good Page Title
A good page title is:
- Brief
- Clear
- Descriptive
- Unique
It should summarise the page’s content or function in a few words.
Passing examples:
- Checkout – Shipping Information
- Search Results for “Headphones”
- Edit Profile
Failing examples:
- Home
- Untitled Page
- Page
- An empty
<title>element
Simply having a <title> element is not enough. The text inside it must provide real information.
Ordering Information in Titles
When titles include branding or site names, place unique information first. This helps screen reader users who navigate through open pages by listening to titles.
Better:
<title>Password Reset – Account Settings</title>Worse:
<title>MyCompany – Password Reset</title>Repeating the same brand name at the start of every title forces users to listen to unnecessary information before reaching what distinguishes one page from another.
Relationship to Page Headings
The page title and the main heading often describe the same topic, but they serve different roles.
- The
<title>identifies the page before interaction - The
<h1>introduces the content within the page
Best practice is to keep them closely aligned, though they do not need to be identical.
Example:
<title>Order History – My Account</title>
<h1>Order History</h1>Consistency helps users confirm they are on the correct page.
Single-Page Applications
In single-page applications, content can change without a full page reload.
When this happens:
- The document title must be updated programmatically
- Each view or route must have its own meaningful title
If the content changes but the title does not, this criterion fails.
Common Failure Patterns
Failures often occur when:
- Pages have no
<title>element - Titles are empty or contain only whitespace
- Placeholder titles are left in production
- Multiple pages share the same title
- Titles are overly generic
- SPA views do not update the title
Examples
Passing example
A settings page includes the following title:
<title>Privacy Settings – Account</title>Users immediately know where they are when the page loads.
Failing example
Multiple pages use the title:
<title>Dashboard</title>Users cannot distinguish between pages when switching tabs or navigating with a screen reader.
Rule Description
Each HTML document must include a <title> element. When present, the title must not be empty and must describe the page’s topic or purpose.
The Algorithm
- Check the document
<head> - Confirm a
<title>element exists - Confirm the title contains text
- Confirm the text describes the page
- Confirm titles are not duplicated across pages
How to Fix the Problem
- Add a
<title>element to every page - Replace placeholder titles with descriptive text
- Make each title unique
- Put unique information before branding
- Align the title with the page’s main heading
- Update titles dynamically in single-page applications
Wrapping Up
The page title is the starting point for understanding a web page. If the title is missing or meaningless, users begin disoriented and must work harder just to identify where they are.
A clear, descriptive <title>:
- Improves navigation
- Reduces confusion
- Supports assistive technologies
- Makes pages easier to find and revisit
At Level A, this requirement is fundamental. Every page must have a meaningful title.
