Skip to Content
Learn
Learn Links and Buttons
Tooltips and Titles

In addition to providing descriptive anchor text, it is sometimes helpful to provide additional context to explain links. This context can be particularly helpful when a link contains or consists of an image, icon, or another non-text element.

Additional context can be provided as text using the HTML title attribute. Although the title attribute can be provided to any HTML element, it is often extremely useful as additional context or advisory text for clickable elements.

Most browsers will display the text of a title attribute as a tooltip, meaning when a user hovers their cursor over an element, the text will appear in a small box near the cursor.

To add tooltips to a clickable element like a link, add it as the title attribute.

<p> <a href="https://www.codecademy.com" title="Codecademy is an online learning platform">Codecademy</a> is the best place to learn to code! </p>

Mouse over the word “Codecademy” below to see this behavior in action!

Codecademy is the best place to learn to code!

Instructions

1.

Let’s add some clarifying information to links via tooltips and the title attribute. In index.html, you can find a few links inside the text of the first question. Add a title attribute to these links to describe them.

Folder Icon

Sign up to start coding

Already have an account?