Chapter 63. Choosing the Right Text for a Hyperlink
| Creating a hyperlink is easy. You just drop a pair of anchor tags around the piece of text that you want the visitor to click. Designing a hyperlink is another matter entirely. Exactly which text should you drop the anchor tags around? The first rule of thumb for any text hyperlink is this: The link should tell the visitor what to expect with a click. That is, the text of the link should suggest where the hyperlink goes or what kind of information the visitor gets by following it. Sometimes the choice is easy. If you have a list of links that functions as part of the site's navigation, you see right away that the links should be the full names of the nav categories, as in Figure 63.1. This wording satisfies the first rule of thumb of hyperlinks, because it tells the visitor exactly where the links go. Listing 63.1. View Source for Figure 63.1.<p> <a href="../index.htm">HOME</a> | <a href="../products/products.htm">PRODUCTS</a> | <a href="../services/services.htm">SERVICES</a> | <a href="../aboutus/aboutus.htm">ABOUT US</a> </p> Figure 63.1. When you have a list of links that functions as part of the site's navigation, drop your anchor tags around each nav choice. The same holds true if you have a list of links in a sidebar or a special section of the page, as in Figure 63.2. There's no question where the links go. The text of the links themselves give it away. Listing 63.2. View Source for Figure 63.2.<p><a href="http://external_site01">External Site 1</a></p> <p><a href="http://external_site02">External Site 2</a></p> <p><a href="http://external_site03">External Site 3</a></p> <p><a href="http://external_site04">External Site 4</a></p> <p><a href="http://external_site04">External Site 5</a></p> Figure 63.2. Likewise with links in sidebars. But what happens if you have inline links, or links that appear within the running text of the page? You can't very well make the whole paragraph a link, although some designers like to try this, as in Figure 63.3. Technically, this strategy satisfies the first rule of thumb of hyperlinks, because it eventually tells the visitors where the links go, more or less. However, it breaks the second rule of thumb of hyperlinks, which is this: The link text should be as clear and concise as possible. Figure 63.3. Here, entire paragraphs serve as hyperlinks. Does this make you want to click? Of course it doesn't. You don't have time for this. Why clear and concise? Because unclear and wordy go against the flow of the Web, which is to say that they slow your visitors down. Your visitors have to read the text carefully, usually more than once, to figure out where the links go. Remember, your visitors may be the biggest fans of the printed word since Stephen King, but they don't read text on the Web. They skim. They scan. They expect the particular piece of information they're looking for to catch their eye, which simply doesn't happen when it blends in with everything else.
So how do you make a link clear and concise? The key is to make the link text work out of context. That is, if your visitors don't read any of the surrounding text (which is highly likely), they should still be able to figure out where the links go. Take Figure 63.4. The link text is clearer, and it tells you what kind of information to expect at the other end without forcing you to read the entire paragraph. But the link text is still too wordy. Too much of it jumps off the page. You still need to read too much. Figure 63.4. Getting better. More focused. But the link text is still too long. The design in Figure 63.5 is better still. The links are short enough, and they tell you where they go. Even if you don't read any of the surrounding text, you know that the first link goes to information about some studies. You know that the second link goes to information about an internal study. You know that the third link goes to information about five-year estimates, and you know the last link goes to information about a review document. Figure 63.5. Better still. These links are short, and they tell the visitor what kind of information to expect.
Notice that the text of the first link doesn't have to spell out what kinds of studies appear on the linked page. Your visitors may be impatient, but they aren't stupid. They already know they're on the Pollution page. Put yourself in their shoes. If you had to guess what kinds of studies wait at the other end of the link, you'd probably guess pollution studies; and, as it turns out, you'd be absolutely right. Notice also that the second link reads internal study, while the first link says studies. In the spirit of brevity, you might think that the second link should drop the internal and just say study. In some cases, you might be right. But in this case, the word study is too similar to the studies of the first link. The phrase internal study is brief enough, and it creates an instant contrast to the first link, helping to differentiate the two. In turn, your visitors expect that the links go to different pages, which they do. The words studies and study don't have the same contrast, so some visitors might expect them to go to the same page. Finally, the last link doesn't use the word download, which some might expect. Why not? Because download doesn't make sense out of context. A hyperlink on the Pollution page that says download tells you nothing, except that clicking the link allows you to download something that probably relates to pollution. But a hyperlink on the Pollution page that says review document gives you a better idea about what to expect: a review document, presumably by Evilcorp, about pollution practices. Which segues nicely into the closing point of this topic: What about the ever-popular Click Here link? The design in Figure 63.6 gives four variations of this all-time classic, and not one of them is a well-designed hyperlink. All but the first are concise, but are they clear? Do they make sense out of context? Figure 63.6. No matter how you slice it, Click Here doesn't work. It doesn't make sense out of context. There's only one way to find out: Skim the page. Do the links tell you where they go? Do they tell you what kind of information to expect? The closest one is the last one, which promises information, but that term is so general as to be virtually meaningless. Click Here links read like instructions. They don't tell your visitors anything about what's on the linked page. Instead, they tell your visitors what to do. But your visitors already know how hyperlinks work. And if they don't, they'll figure it out. After all, who taught you how to click? Your visitors already know where to click. They already know how to click. What they want from you is why to click, which Click Here doesn't provide. |
