Clear, Descriptive Page Titles
Every page deserves its own title that tells users what it’s about before they even open it. It’s the first thing screen readers announce when a page loads. Sighted users also rely on titles when switching tabs, bookmarking, or navigating their browser history.
But here’s the catch: a good title isn’t just present: it’s descriptive and unique.
Good Practice
Start with the unique part of the title first, the page’s main topic, followed by the site name. This way, users who scan multiple tabs can quickly find the one they want.
Examples:
- Contact Us | Accessible Design Co.
- Search results for “holiday deals” | ShopNow
- 404: Page Not Found | My Portfolio
- Sign-in Error: Invalid Password | WebApp Pro
Notice how even error states or dynamic pages like search results are clearly reflected in the title. This helps everyone, but especially users with assistive technologies or cognitive disabilities who might get disoriented when a page loads with vague feedback.
Watch Out For
Titles that are too generic or repetitive across multiple pages. If every tab just says “Home” or “My Site,” users lose critical orientation and navigation context.
Poor Examples:
- Home
- Page
- Untitled Document
- Results (without context)
Pro Tip
If a user submits a form and there’s a validation error, reflect that in the title:
Before:
<title>Sign Up | Newsletter</title>
After:
<title>Form Error: Missing Email | Newsletter</title>
This provides immediate feedback that something went wrong — even before the user interacts with the content again
Do this today: Open several pages of your own site or one you use often. Check the <title> tag for each in the browser tab or view source. Are they too generic? Could they be more specific? Rewrite one or two to better describe each page’s unique purpose or state.