The title of a web page is the page's accessible name, and it will be the first thing read aloud by a screen reader when it starts reading the page. It will also be used by search engines, and it labels the browser’s tab containing the page.
To be as helpful as possible, the title should briefly tell the user what the page is about and where they are within the site.
Examples
✓ Good example
A page containing this content on Harvard's web accessibility site might be described like this:
<title>Writing document titles | Harvard Online Accessibility</title>
This <title> element should be placed in the document's <head> section. When a screen reader loads the document, the title will be the first thing they hear, naming and describing the current page.
✓ PDF example
PDF documents can also be opened in browser tabs, just like HTML pages. Providing a title for a PDF document involves editing its meta information, like so:
- Select File > Properties
- Select the Description tab
- Modify the Title field
✗ Bad example
The <title> element should not be empty or absent—the browser will likely give the page an unhelpful title of "Untitled document."
The title should be plain text, and it shouldn’t contain any HTML markup because the markup will not be parsed and it will appear as garbled text to end users in their browser tab and window labels.
<!-- avoid this -->
<title><strong>Writing document titles</strong> | Harvard Online Accessibility</title>
Note: If you are entering content using a CMS system, the <title> content is usually added automatically, based on the text you enter in the “title” field of your post. It will usually appear as both the main heading of the page (<h1>) and a subset of the <title> content. So writing a good <title> comes down to entering a good description in the page title field.