Experts in the Engineering, Art, and Psychology of User Interface Design

Click Here! The Hazards of Inline Links

Print This Page Print This Page
Add to Bookmarks Add to Bookmarks

This Coffee Talk is essentially about how to get people's attention and how to learn to leave people alone when they're busy.

There's lots of ways to get attention in everyday life -- donate large sums of money to charities, steal large sums of money from charities, or wear that Steve Martin classic, arrow-through-the-head prop to an interview. But no matter what you do, you need to make sure you know how to respond when people take notice, because they will.

red spot in a field of black spots

So what did you notice first in the image above? What stands out the most? What gets your attention? Now look at the image below. Both the red dot and the red text get your attention because they're different from their surroundings.

red text in a field of black text

Oh The Links They Are-a Calling

So what's this about the "hazards" associated with inline links? Surely the inline link - the defining element that helped shape the web into what it is today - can't be hazardous! It saves us from having to go to some silly menu bar to navigate somewhere else! We just click on the blue underlined word in the middle of the sentence (and in the middle of our thought process) and ...

Hold on! What's this about interupting the thought process? That can't be good, can it?

Nope. That's not good.

Probably not everyone's thought processes get interupted when they view an inline link, but consider the issue from a purely perceptual point of view. You've already seen how a single, different element surrounded by a field of multiple, like elements emerges from that surrounding field. You don't even have to look at it directly for it to stand out and shout "look at me!"

Inline links, with their underlines and different colors, do the exact same thing. Add boldface, italics or put them in a different font style and inline links can't help but get your attention.

Links Are a Faction of Actionable Distractions

Displaying your links differently from regular text isn't the hazard. In fact, that's a good thing - it lets the user know which screen elements are actionable and which are not. Ironically, though, that's also the problem.

It's because something happens when a user clicks on a link that problems arise. That link is going to take the user somewhere - a different part of the page, a different part of the site, or to some other site - away from their current location.

In general, people dislike being distracted when they're in the middle of doing something. Presenting them with a link in the middle of sentence forces them, even if its only on a subconscious level, to evaluate whether or not they want to click on that link - now, later, or never. And that's distracting.

Implications for Design

Basically, you should try to avoid inline links altogether. For example, if you have a paragraph of content - or even an entire page - that could be linked to related information and/or ideas, present the links to that inforamtion after the body of text, as shown in the example below.

For more information, please see:

  • Link 1 is a related web site

  • Link 2 takes the user to a related story on the same site

However, since at some point you're going to have to use inline links, consider the following:

  • Keep your inline links to a minimum. There's nothing worse than visiting a page with more links than text. The author is obviously saying "it's best to go anywhere but here."

  • Make sure the text you choose for the link has enough context in and around it so that people have some idea of where they're going.

  • Separate your inline links from the rest of the text, if at all possible. Try using parentheses (or other brackets) which are a recognized way to say, "hey, this is related, but its not as important as you continuing to read along."

  • Avoid inline links for destinations that are going to take the user away from the current site. Aside from the obvious reason that people who click on those links will no longer be visitng your site, you run the risk of presenting the user with a dead link - and that not only looks unprofessional, it is unprofessional.

By carefully considering when to use - and when to avoid - inline links, you can help your users maintain their thought processes while they're visiting your site. By offering links to other pages at the bottom of the article, or in the margin, or wherever else you've decided to consistently provide links to related information, you give your users the choice to follow the links only when they're ready to do so.