Tooltips, or title in HTML terms, are really important in our day-to-day lives. They give us more information, especially when we need it.
Hold on, what is a tooltip?
Tooltips are those little messages that appear when you hover over something, usually a button:
In HTML, this is achieved by setting the title property. For the example here, I simply used this code:
<h1 title="This is a tooltip">
Hover me!
</h1>
For more on tooltips, check out the details in the MDN Web Docs.
Pros
- They allow you to give information to a user, without having it posted on the screen.
- They can be read by screen-readers.
Cons
- Touch-screen devices can't see them.
- If you are using a keyboard for navigation, you can't hover over things.
How do they effect us?
Take this button. It is a GitHub Fork button, but it can't be pressed. Zooming out, there isn't any details as to why I can't press them:
But when someone hovers over it, it gives the reason why you can't press it:
Whenever you are out on a website, and you see something that can't be pressed, stop and think to yourself, and then hover over it. Chances are, it will tell you why you can't press it, but only until you hover over it.
Top comments (1)
Tell me where else you experience these things!