April 26, 2024
How to use a hyperlink
If you survived that little test of endurance, you should now be reading this with a sense of achievement. How many clicks did it take for you to download the file? The answer, I hope, is far too many.
So how does one design a link that takes the principles of HCI into consideration? Obviously, one would think, you need to link directly to the file concerned. Forcing users to navigate through several unrelated pages is a surefire way to get them irritated. I made your task easier by sending you at one stage to the "Calendar" page. I could have made matters worse by leaving you to "explore" my site in an effort to find the file. Believe me, it happens. When you offer the user a link to something, make sure it goes directly to it!
To view an example that provides good usability, go here.
You cannot assume that the user knows how to use the right click facility on a mouse. Some text will help inform the user as to what will happen after they have clicked in the appropriate way. As a further aid to visibility, I have added a title attribute to the hyperlink. This supplies some extra information when the user hovers over the link (see below).
<p>Download the <a href="../m206/basic_smalltalk.pdf"
title="Six page pdf document with diagrams about Smalltalk">Basic
Smalltalk file</a>
(basic_smalltalk.pdf 50Kb)
</p>
Ensuring that the hyperlink is not only underlined, but also uses a blue font-colour and is different in colour to the rest of the text will aid affordance.
Back to « How not to do it
⇑ Up to top of page