12
Writing Meaningful Links
,Links connect pages in your web site and they connect your site to other sites. You’ve seen many examples throughout the book, especially in Chapter 4 on home pages, Chapter 5 on pathway pages, Chapter 8 on headlines, and Chapter 9 on headings (in the section on same-page links). In this chapter, I add seven more guidelines to the ones you’ve already worked with earlier in the book.
Seven guidelines for writing meaningful links
1 Don’t make new program or product names links by themselves
Many organizations create programs and products with cute names. Once people know the name, it may make sense. It may even be memorable. But until people know what it means, it’s meaningless to them. Remember that your web site must serve new people, not just those already “in the know.”
In the first edition, I showed two examples of sites that used Compass as a link with no further explanation. One was the British Museum, hiding lots of great information behind a link that most people didn’t recognize. The other was the Colorado Historical Society, where the link is relevant only to a small group of site visitors.
I’m happy to say both of those sites have changed for the better. But Figure 12-1 shows a nonprofit organization that has a tab for Compass. The organization seems to do wonderful work, and their Compass program offers many resources and services for young people. But are some people missing out because they don’t know the program name?
2 Think ahead: Launch and land on the same name
As people move through web sites, the first question they ask as a new page loads is “Did I get where I thought I was going?” They quickly check the page headline to see if it matches the link they clicked on.
Thanks to Caroline Jarrett for letting me use her “launch and land” phrase: http://www.editingthatworks.com/step8.htm
When the two match, site visitors can feel confident in their choices and in the site. You build trust and credibility. If the two don’t match, site visitors may have at least a moment of confusion and cognitive trouble – and you don’t want to cause that.
This match may be even more important now that so many of your site visitors are on mobile devices. Page load times can be longer for mobile than for other types of connections. If people don’t think they’ve gotten the content they expected, they may be even more frustrated on a mobile than they were on their laptops.
Launching and landing on the same name helps your SEO. Some algorithms may lower your SEO score if the headline as a link and the headline on the page don’t match.
Plan in both directions and with other content:
• How well does your headline on the page work as a link?
• How well does your link work as a headline on the page?
• How does this headline work with others at the same level or in the same part of the site?
This last question can get a bit tricky because you have to think about these questions:
• Where will this link show up?
• What type of page is this on?
• What other pages make a consistent set with this one?
• What other links will go with this one?
Best is an exact match. But considering your entire content, you may need to have small differences between headline as link and headline on the page. For example, you might have an –ing form in one and the imperative of the verb in the other. But both should have almost all the same words – certainly the same keywords.
You can do this well, just as the Ministry of Tourism in India does on its web site (Figure 12-2).
Figure 12-2 Matching the headline on the home page with the headline on the information page builds trust and credibility.
3 For actions, start with a verb
In a study by Ann Chadwick-Dias and her colleagues at Fidelity Investments, web users, especially older adults, hesitated to click on single nouns as links, like Accounts. When the Fidelity team changed to action phrases, like Go to Accounts, site visitors of all ages were less hesitant to click.
Remember: Write with strong verbs, not nouns that hide verbs (Chapter 10).
4 Make the link meaningful – Not Click here or just More
Most people scan web pages, first focusing on headings and links. Headings and links are colorful. They stand out. They draw our eyes.
Links that just say Click here, Here, More, Read More, See More, or Answer give no clue about what will appear if we click on them. When the page has many identical links, we can’t see at a glance how they differ. And they draw our attention away from the meaningful information.
Blind web users scan with their ears, just as sighted people scan with their eyes. Screen-reading software helps them do this by allowing them to pull all the links on a web page into one list, as you can see in Figure 12-3. Imagine the frustration of hearing only Learn More, Learn More, Learn More, Learn More, or Click here, Click here, Click here.
Figure 12-3 A site visitor listening to this list of links won’t get much useful information.
JAWS from Freedom Scientific, reading links on a page at us.norton.com/products
More about how people listen to web sites: Theofanos and Redish, 2003
Thanks to Sarah Horton for capturing the JAWS links list.
Click here is not necessary
Most site visitors today assume that something that looks like a link is a link. You don’t need to announce links with Click here. Just put what people will get by “clicking here” into your link format.
More or Learn More by itself isn’t enough
In Figure 12-4, what do you notice first?
Figure 12-4 More or Learn More by itself isn’t helpful even to sighted visitors who are quickly scanning the page. You don’t need Learn More in any of these options.
Some people notice the pictures first, then the blue links, and only after that do they read the headlines and the text.
Looking at the links in Figure 12-4, you see that Monster.com did a great job with the first two of three calls to action. But then they didn’t follow through on the third one. Figure 12-5 shows you how I might revise the third piece to be parallel to the other two.
Figure 12-5 My suggested revision
Say what it’s “more” about
Be explicit and include the topic as T-Mobile’s U.K. site does (Figure 12-6).
If you are listing articles where each article title is a link and then you have More or Read More after a very brief description, that may be okay. But I’ve seen sites where the article title is not a link – where More is the only link.
Meaningless links don’t help your SEO.
5 Don’t embed links (for most content)
You use links not only to help people move down a path from home page → pathway page → information page. You also use links to help people move from an information page to related pages (more details, similar topics, “you might also be interested in,” and so on).
A question that comes up regularly in my workshops is whether it is best to embed links in the text or always put them at the end of a segment of text or even separate them entirely from the text.
My answer, as with so many questions about creating great web conversations, is that it depends on your purposes, your site visitors, and why they are coming to your site. The point to remember is that an embedded link is always a distraction. If people choose to follow an embedded link, they leave your information in the middle of what you are saying. It’s like switching conversational topics mid-sentence.
If people are browsing, embedding may be okay
Most Wikipedia articles are full of embedded links. The page in Figure 12-7 is just one of thousands of examples I could have selected. Does having many embedded links work for Wikipedia articles because people come to browse? Are they eager to see how a topic branches and connects to other topics?
Figure 12-7 Embedded links may work here because people come to browse.
Put links at the end, below, or next to your text
If you want people to read your entire sentence, paragraph, or list, don’t invite them to leave by embedding links. You would be giving your site visitors two tasks at the same time: reading and moving on. Site visitors often don’t come back once they’ve been enticed away by a link.
Embedded definition links that open a small window and don’t change the screen are okay. They clarify the ongoing conversation. They don’t change the topic or take people to another page.
In the first edition, I used an article from About.com on spas as an example. Figure 12-8 shows you part of what About.com had then, my suggested revision of that part, and what About.com has now. I’m pleased to say I think this writer is doing it right now.
6 Make bullets with links active, too
Let’s end the chapter with two short sections on formatting.
In usability test after usability test, I’ve watched frustrated web users try to click on bullets rather than the words next to the bullet. Whenever you use bullets next to links (circles, squares, arrows, numbers, thumbnail photos, icons, other small illustrations), include the bullets with the text in the clickable area.
I’m happy to say that both the examples I showed in Chapter 11 (the butterfly site, Figure 11-3, and the site for teachers, Figure 11-4) do this well. Unfortunately, other sites do not.
7 Make unvisited and visited links obvious
One of the basic principles of human behavior is that it is easier for people to recognize than to remember. Products should “afford themselves” – make it obvious how to use them. Your site visitors just want to satisfy the conversation they came for. They don’t want to memorize your site. Help your site visitors by making links obvious and by indicating which links they’ve already been to.
Use your link colors only for links
Don’t tease your site visitors by using the same color for links and nonlinks. Don’t make people mouse around to discover what is and is not a link. Unfortunately, that’s what you have to do at the Network Advertiser’s page for opting out of cookies (Figure 12-9).
Figure 12-9 The links and colors here may not help site visitors act effectively and efficiently.
Show visited links by changing the color
Not changing the color of visited links is still on Jakob Nielsen’s list of Top 10 Mistakes in Web Design. In Nielsen’s 2011 update, it was #3!
When links don’t change color, people have to remember where they’ve been – and they often don’t remember. So they revisit the same link again (and again), wasting time and effort. Or they skip the right link, thinking they’ve already tried that one.
Of course, the problem is made worse by links that aren’t clear. Write your links to help people choose appropriately in the first place. But mistakes happen. People go down a wrong path. Help people both with clear writing and by showing them where they’ve been and where they have not yet been.
Summarizing Chapter 12
Key messages from Chapter 12:
• Don’t make program or product names links by themselves.
• Think ahead: Launch and land on the same name.
• For actions, start with a verb.
• Make the link meaningful – not Click here or just More.
– Click here is not necessary.
– More or Learn More isn’t enough.
• Don’t embed links (for most content).
– If people are browsing, embedding may be okay.
– Put links at the end, below, or next to your text.
• Make bullets with links active, too.
• Make unvisited and visited links obvious.