WCAG SC 2.4.2 Page Titled requires that web pages have titles that clearly describe their topic or purpose. The <title> element is located in the <header> area of the document and can be seen on the tab that opens at the top of the browser. Including title helps all users, including those with visual, cognitive, and motor disabilities, as well as users with short-term memory issues, to understand and navigate web content effectively.
To ensure that every web page has a clear, descriptive, and unique title that accurately reflects its content and purpose.
Provide a unique title for each web page: Ensure that each web page has a unique title.
Keep title text concise: Ensure that the text in the title is not too long, keep it between 55–60 characters.
Match or resemble the <h1> with the title: Try to match the <h1> of the page with the title, or at least create a resemblance between them.
Adopt a clear title pattern: Include the web page name, a brief description, and then the site name. Following this pattern will ensure screen reader users can understand the topic before hearing the site name, as it could be very inconvenient for them.
Avoid 'keyword blobs': Avoid using 'keyword blobs.' Sometimes, authors may try to trick search engines by including a bunch of keywords that are well-searched by users. Doing so often increases your chances of being penalized by Google, consequently lowering the reputation of the domain. Examples of such 'keyword blobs' are: 'Cheap flights, discount flights, low-cost flights, flight deals.'
Example: A website's homepage title.
A homepage with a title like "Home" or "Welcome."
Explanation:Generic titles like <title>Welcome</title> or <title>Home</title> do not provide sufficient information about the page's content or purpose, making it difficult for users and search engines to understand the page context.
A homepage with a title like <title>Accessible Web Design | Tabnav</title>, followed by an <h1>Accessible Web Design</h1>.
Explanation:A descriptive title like 'Accessible Web Design | Tabnav' along with an <h1> tag containing the same content clearly indicates the page's content, purpose, and the website's name. This aids users in navigation and helps search engines index the page effectively.