Title attributes

The title attribute, as defined in the HTML specification, is used to add extra textual information about elements into a HTML document.


Recommendations

A title attribute should avoid repeating text that is already visible and associated with the same control or content.

Do not use title attributes for essential information, such as instructions or form labels.


Why it matters

Duplicating content in visible text and title attributes leads to unnecessary content clutter and repetition.

The title attribute is inaccessible to keyboard users without additional assistive technology. It is also dependent on user settings and preferences with screen readers and similar assistive technology. You cannot guarantee that text in a title attribute will be seen by a user.

Additionally, pointing device users need to hover over page elements and pause before a title tooltip displays, usually with no indication that this action will display additional content. So discoverability is also an issue.

Examples

Recommended:

<label for="name">Name</label>
<input type="text" id="name" name="name" />

<label>
    Email
    <input type="text" id="email" name="email" />
</label>


<button type="button"><img src="/path/to/image/close.png" alt="Close" /></button>

Not recommended:

<input type="text" name="name" title="Name" />


<label for="email">Email</label>
<input type="text" id="email" name="email" title="Email" />


<button type="button" title="Close"></button>

<a href="/news" title="News">News</a>

Testing

Search the source code for instances of the title attribute and ensure there are no instances which contain content that is essential or repetitious of the element content.

Check that the title attribute is not used to label any form input elements.