Title attribute in HTML - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is the purpose of the title attribute in HTML?

The title attribute provides additional information about an element. When a user hovers over the element, a small tooltip with this information appears.

beginner

Which HTML elements can have a title attribute?

Almost all HTML elements can have a title attribute, including <a>, <img>, <button>, and <div>.

intermediate

How does the title attribute improve accessibility?

Screen readers can read the title attribute to provide extra context to users who rely on audio, helping them understand the purpose of elements better.

beginner

Example: What will the user see when hovering over this link?<br>

<a href="https://example.com" title="Go to example website">Example</a>

When the user moves the mouse over the link text "Example," a small tooltip will appear showing the text "Go to example website."

intermediate

True or False: The title attribute should be used as the only way to provide important information.

False. The title attribute is helpful but should not be the only way to convey important information because some users may not see or hear it.

What happens when you add a title attribute to an HTML element?

A The element becomes clickable

B A tooltip appears when hovering over the element

C The element changes color

D The element disappears

The title attribute shows a small tooltip with extra information when the user hovers over the element.

Which of these is a good use of the title attribute?

A Adding a background image

B Changing the font size

C Adding extra description to a link

D Making text bold

The title attribute is used to add extra description or information, like for links.

Can the title attribute be used on an <img> tag?

A Yes, to provide extra info about the image

B No, it only works on links

C No, it only works on buttons

D Yes, but it hides the image

The title attribute can be used on images to give extra information shown as a tooltip.

Why should the title attribute not be the only way to give important info?

A Because some users may not see or hear tooltips

B Because it slows down the website

C Because it changes the page layout

D Because it disables keyboard navigation

Not all users can see or hear tooltips, so important info should also be visible or accessible in other ways.

What accessibility benefit does the title attribute provide?

A It makes text larger

B It changes colors for colorblind users

C It adds keyboard shortcuts

D Screen readers can read it to explain elements

Screen readers can read the title attribute to help users understand the element better.

Explain what the title attribute does in HTML and give an example of how it is used.

Think about what happens when you move your mouse over a link or image.

Describe why the title attribute is helpful for accessibility and what its limitations are.

Consider users who rely on audio or keyboard navigation.