Wednesday, January 26, 2011

Hyperlink Placement

In the world of print, you can attract attention to a word by placing it in bold face or italics. Or you can underline it. Or you can put a number after it to refer the reader to a footnote¹ or an endnote².

In the world of the Internet, you can also give it a hyperlink. Since the link is usually colored and underlined, it automatically conveys emphasis. A hyperlink is similar to a footnote because promises clarification or contextualization.

The Chicago Manual of Style, drawing upon centuries of established print tradition, suggests rules for using boldface, italics, underlining, and footnotes.

What about hyperlinks? When and where should we use them?

According to prevailing wisdom, providing a link in the middle of a section of text benefits the reader. Like the footnote, it can reveal a source, explain a term, or provide a deeper excursion into a given topic. For example, if you link the “Battle of the Bulge,” your reader presumes that by clicking on the link, there will be some web page waiting that expounds on that topic.

But the reader doesn’t necessarily know where the link leads. Wikipedia, maybe? Or some World War II site? Placing the cursor over the link brings up the URL code at the bottom of the window, and right-clicking it can open it in a separate window for later perusal.

Nicolas Carr, in his recent book, The Shallows: What the Internet is Doing to Our Brain, argues that links embedded in running text interrupt the flow of thought. Somewhere in the back of his brain the reader must make a few judgments: Where will this link take me? Should I make the jump now or come back later? Should I skip it altogether?

These judgments must be added to the cognitive load of reading the passage itself. It’s like trying to read while someone is tugging on your sleeve. Carr argues that these competing thoughts interfere with comprehension. Even worse, if the reader actually follows the links, there’s a risk of losing him entirely.

One solution to this problem is to resist linking until the end, and then to present an array of choices, like doors at the end of a hallway. That way the reader can sustain attention for the full written piece without distraction.

In a web essay, Carr experiments with placing all his links at the end.

Carr make an interesting point. Why not link at the end of a piece? The reader can recall the key concepts or names when he or she sees them again in the endlinks. Because endlinks don’t need to fit into the syntax of a sentence, they can be composed to suggest not only the topic but the destination. For example, instead of “Battle of the Bulge,” the endlink can read: “Battle of the Bulge on U.S. Army's Official Site.”

Carr’s argument won me over—but not completely. You may have noticed I have generally shifted my linking strategy, putting them mostly at the end.

There’s no need to be a purist. Sometimes you might want the reader to head out through a side door, and that a kind of channel-surf-skim-reading style is one of the pleasures of the Internet. Not all pieces of writing are long rational expositions requiring uninterrupted concentration. And, as several people pointed out in the comments after Mr. Carr’s essay, embedded links can signal the credibility of the writer’s source material, something that a reader might want to establish before the end.

What link-placement strategy do you prefer? Please let me know in the comments.
1. Traditional footnotes aren’t really possible on a Web page, since the “page” is scalable and infinitely long; therefore, on a computer, they’re all really endnotes.
2. Amazon’s Kindle handles endnotes by following the word with an asterisk. That asterisk links within the e-book database to the relevant note.

Battle of the Bulge on U.S. Army's official site
Battle of the Bulge on Wikipedia
Chicago Manual of Style Online (a subscription service with a free trial)
The Shallows: What the Internet is Doing to Our Brain on Amazon
"Cognitive Load in Hypertext Reading: A Review." by DeStefano and LeFevre, Carleton U.
Nicolas Carr’s Blog Post: "Experiments in Delinkification" (May 31, 2010)
The Scholarly Kitten blog: "Arguing Against Links"
ReadWriteWeb: "The Case Against Links"


Erik Bongers said...

This is what the "Lines and Colors" blog already does.
[see link to Lines and Colors below]
[scroll down...]
[almost there...]
Link to Lines and Colors blog:
Lines and Colors

Erik Bongers said...

Correction: Lines and Colors mixes in-text hyperlinks with bottom ones.

Erik Bongers said...

Ok, ok, actually the only site that has been doing this consistenly for a while is Gurney Journey.

Terry said...

Good and interesting points, and I do experience that "tugging" when I read online. I think I like the "endnotes" better.

I followed the "Scholarly Kitten" link and was kind of disappointed to find it's actually the "Scholarly Kitchen" instead...could someone please start a Scholarly Kitten blog, please?

Celia said...

I agree with Carr in the main and do find I lose some comprehension strolling around on links in the middle of something. Thanks for bringing this up. I think I will use the "endnotes" idea.

Kessie said...

Wow, I never thought much about it before.

For me, it depends on the length of the piece. If it's only a couple of paragraphs, then scattering hyperlinks throughout those paragraphs is no big deal.

But if it's a big long article, and I'm really focusing on the topic, running across links in the middle of the thing is jarring. I'd rather wait until the end to see links to further pages on the topic.

Worst of all are those stupid keyword ads, where if you hover over them, you're presented with a huge flashy picture or article that has absolutely nothing to do with your article. Talk about distracting.

Suciô Sanchez said...

As a reader, I prefer the links to be in context. I click with the middle mouse button as I read so the links are waiting for me in a new tab.

When blogging, it's helpful to edit the html to add "target=_new" so a new tab is automatically opened rather than jumping to the target site in the current tab.

It makes sense for authors to use "target=_new" for selfish reasons too as you may lose readers mid-stream otherwise.

Suciô Sanchez said...

Ha! Doesn't work in comments.

Unknown said...

Footnotes can exist, many websites break the content of an article into pages if it's too long therefore the notes at the end of a page would be footnotes and not endnotes.

Since the web was originaly created to share documents, footnotes and endnotes make a lot of sense, although inmediate hyperlinks are ok too as long as you don't overwhelm the reader, just my opinion.

There are also ways to keep the reader on the site when he clicks on a link, like telling the browser to open a new tab or window, though it's generally better to keep that control in the hands of the user.

Anonymous said...

I actually prefer them in the middle of paragraphs; simply because I naturally right-click and make said link into a tab. Once when I'm finished with the first article (or get bored), I'll peruse the tabbed one.

Thank goodness for organization!

Charles Valsechi said...

When I started reading Gurney Journey my brain filtered out your bottom links for a very long time, so I didn't even realize they were there. Often times clumped up attention grabbers nullify themselves. We are used to ignoring this type of thing thanks to the advertising world.

Alonso said...

I agree with some of the others, I prefer the links in the body,to be right clicked and read after.

Links at the bottom I tend to ignore because they seem to require me to gather focus to wade through the blob of bold underlined colored stacked text. Also I'm used to ignoring the bottom which frequently is a digital signature with unneeded information.

Don't kids today consume more media hours a day then there are hours in the day because they multitask it? Carr grew up before the internet. I wonder if his ideas which are evolved from the paper tradition will be as applicable to minds that are shaped by constant information assimilation from multiple sources.

Kevin said...

I don't see why hyperlinks are more obtrusive than end/foot notes. If anything, they're easier since you can open them in another tab.

Marc said...

I don't find hyperlinks in context distracting when the hyperlink color doesn't contrast too much with the body copy color (like your blog).

I also agree with Suciô Sanchez, that "target=new" should be used so links open in a new tab.

Carolyn A. Pappas said...

I right click links I want to follow and open in a new tab as I read the article. Then, when I am through reading I check out the other links. I blacklist sites that disable right clicking. I find it insulting because they assume that I am trying to steal images. I wish they would realize that there are other valid things you can do with right clicking other than download images.

I don't mind linking within the article. I find it gives some context and makes things interesting.

David Glenn said...

Usually I just post a link or insert a hyperlink with the word here to have people click there. Maybe I'll change it up to let people know what the link is and what site it's from.

Daroo said...

Great post.
I feel that tugging too but if its a short article, I make my mind up at the outset to read the whole thing, and then go back and follow the links. Seeing the link in context is nice because I know I can quickly get more information.

But I think that tugging is indicative of consuming information in a different way.

This was clearly illustrated for me when I compared the experience of following Gurney Journey to reading Color and Light. Both were good experiences but in the former I was scavenging along the surface for new information in the midst of my daily activities, with no time for real reflection. Reading Color and Light let me dig deeper and live with the information for awhile -- and then once I internalized it ( or started to) I followed up with some of the further reading at the back of the book.

Reading the book for me was the richer experience, but I was first introduced to (and became interested in) the ideas on the blog.

Kent M said...

Linking within the text is indeed distracting. One way to minimize the distraction is to make the link less obtrusive (make it just a shade different than the regular text, rather than bright blue).

Another way is if you are using references, to use the old-style print convention you mentioned of a superscripted number - the number can then be linked (it's small, it's a convention we're used to, and therefore is less distracting).

Additionally, you can use the hover text to display where the link goes, or in the case of a footnote-type comment, put the whole text of the comment in. Like this¹.

Kent M said...

Addendum: hover text does not work on the Kindle, however.

Cuprohastes said...

Actually HTML handles end-notes with an anchor tag that would let you link to an arbitrary point on the page, letting you add a link to an end-note as well as a link back to where you came from.

As for the notion of interruption, that was possibly truer ten years ago before tabbed browsers enabled you to open up a link in a background tab to create a queue of pages to read after the main article was finished.

Unknown said...

In text links give more context to where you link and I prefer that when it's specific to what you're discussing. It's more like using a quote or direct reference. Generally related info or websites that your discussing make sense to have at the end if it's further reading on the topic.

You can also have foot note or endnote info appear when you hover over them. This makes them more useful because you don't have to scroll to find the info and then scroll back to the text your were reading as you might see in wikipedia. Unfortunately with wikipedia most of the footnotes aren't actually text but links which would be better as in-text hyper links.

Super Villain said...

oh no!

not a blog entry without pictures!

the horror of it all!!!!

Richard said...

I never write something in my blog that appears somewhere else on the internet. Therefore the thread of my writing is connected by the hyperlinks. I want the reader to take the link. For example, " James Gurney says THIS (hyperlink) but I think it's better to do what Stapleton Keans suggests HERE (hyperlink) unless you run into this problem HERE (hyperlink) in which case it would be better to do THIS (hyperlink).

Author (see here)

sfox said...

I hadn't really thought about it until I read your post, but I guess I've gotten in the habit of noting a link in a text I'm reading, but then moving on. When I'm done, I scan back through it and click on any links that caught my eye.

I don't think that I've even been aware of "end links" until now, probably because out of context, i.e. at the end of an article, I don't notice them.

On my own blog, I embed my links in the text. Same with my newsletter.

Carr may be over-thinking this one.

Unknown said...

I prefer the links in the body of the text where they are in context. I have a button on my mouse that automatically opens the link in a new tab, so I don't even notice. If the link isn't what I wanted when I open it from the body, it only takes a few seconds to realize and then I can close the tab.

Also, I don't notice the links at the end of the post.

I think that the "tugging" might have to do with the shorter attention span I keep reading about. Everything is so fast paced and short that by the time you get to a link you are already used to switching topics.

Unknown said...

I personally don't see the difference between hyperlinks mid-text and the footnotes in books that use them. I have to stop reading to check out the info in the footnote. Scholarly texts have to cite references in parenthesis after every fact (Jones, 2010). That is distracting. But I can live with the links at the end.

Tyler J said...

I am posting before reading, just so I'm not influenced by what are bound to be interesting and persuasive points.

I don't care for hyperlinks embedded in the text. Yes, they are immediate but also distracting. The same way that poor kerning and leading can be in print, having that other colored word or words is distracting. I never left-click a hyperlink while I'm reading something, but I will click with the middle-mouse mouse 3, scroll-wheel button) if I'm interested; that way it opens in another tab behind the one that I'm currently reading.

The analogy of tugging on your sleeve is a good one and one that I wish more web designers et al. would consider more often. However, the internet is very much a "do whatever it takes to grab your attention" sort of place (bless you, Ad Block Plus).

daylily fan said...

Hyperlinks seem to work best when they are contained within the save site.

Almost ten years ago I worked on a 'dictionary' of terms related to the flower genus Hemerocallis - Daylilies.

Within all of the definitions we hyperlinked to other terms within our own dictionary site. So, this allowed us to use specific terms in the definitions that someone may not know, but by following the links they can figure out the context.

Look under 'Dictionary of Daylily Terms'.

By keeping the hyperlinks confined to the same web site you have a contextual reference to all the terms and can jump around easily. When you link to external sites it is much harder to make the links contextual

nana said...

I noticed how you tend to put hyperlinks at the end of posts quite soon after finding your blog and decidedly like it. It's one more thing that makes Gurney Journey such an enjoyable read. Back then you didn't see people to it that much but nowadays I feel that you see more of it, maybe not so much in personal blogs but at least in informative blogs.
I love how it's clear that you've really thought about how you can best present the posts to the readers.
I've tried to put links at the end of a blog post myself at times but it takes some extra thought and is probably more suited for more carefully planned and written blog posts, not ones off the top of your head. Putting hyperlinks in the middle of the text can give the impression of spontaneity, which some might like.

PatternGhost said...

I prefer to have relevant links show up to the right of the text as part of a two column format where the text column takes up more screen than the link column.

That keeps the links in context for browsing later, but doesn't distract from reading or tempt me to bail on the text too early.

Unfortunately, most commercial webcontent uses that method to fill up the right hand side with ads.

Rubysboy said...

Leave the link in the body of the text! Doing so gives your readers choices: follow the link now or come back later. Putting it at the end makes readers have to recall something that interested them several moments ago, after several other interesting items intervened in their stream of consciousness. What's more important, enforcing the author's choices or facilitating the readers'?

coyo said...

I've never thought on this before. I don't mind links in the text because I Command-click (presumably ctrl-click on a PC) anything that looks interesting which opens the link in a new tab without switching focus away from the main article. This way, I can check the links after I've finished the article.

Anonymous said...

I love them at the end. They are easier to find and it is quicker to find a link when I come back to the post later.

Agapetos said...

Both strategies have their use. For technical or encyclopedic text I prefer link in the text. However, for reading essays or other similar texts I prefer link to be at the end; as you said, they can be distracting.

James Gurney said...

Thanks, all of you, for all these fascinating comments. It’s kind of exciting that the Internet is so new, like the highway system in the 1930s, when signs and rules of the road weren’t conventionalized yet.

I was surprised how many of you said that you disregarded the endlinks because they look like advertising or just presented a wall of type out of context, but I can understand that.

A lot of you made a good case for embedded comments, and I can better see now why they help. Reading online content really is a different mind-state. Carr explores this topic in his book, by the way, noting that people’s brains change with a fairly short exposure to Linkyland. But I agree with some of you that the new way of reading, distracted as it may seem, can be a very productive mind-state indeed, not necessarily shallower at all.

Where I come out on all this is that the experience of the reader comes first. Links should never be put in gratuitously because then they are annoying. Rather, they should be used only when they suggest a worthy side trip for a curious reader. By linking, the writer tacitly endorses the destination. And the endlinks should be prefaced by something to indicate that they are “Further Reading” or “Resources” or “Links for more information” so that the reader knows what they’re getting.

Unknown said...

I think it is also a good way to cite our sources, leading the reader to the original source online.

For a very creative approach to hyperlinks -- often hilarious -- check out Dan Pirrarro's Bizarro blog.

Making A Mark said...

I've done both from the beginning

The way my system works is that Named individuals always have their websites and blogs linked to them in-text as do any key topics eg exhibitions

I keep related material and repetition of links people may have missed in the text to the end when it seems to me they provide a neat summary.

I can't remember where I got it from - I think partly it was the system I was taught re referencing academic papers and writing reports and partly it's what makes sense to me.

Mind you, I probably still do a bit too much in-text linking. It's a useful post which I shall go and ponder!

PS I always right click hyperlinks so they always open in another tab!

Matthew Meyer said...

That's a pretty interesting point. Thinking about it, I much prefer my links in the text than at the end. But I suppose that depends on the content, too.

It may just be that I am a huge fan of Wikipedia and have become used to browing and skipping over what links I find unnecessary. But when I start reading about The Battle of the Bulge, if I don't know what it is, I want to click on it immediately, rather than scroll to the end to find if there is or isn't a relevant link.

As long as it is clear what the link is linking too; i.e. Battle of the Bulge should link to Wikipedia or such to explain what it was, for reference purposes, rather than to, say, a site with photos of WW2 battles. Links with extra, non-essential information go well at the end of the article -- photos, links to references, or other articles on a similar topic. Definition links belong right in the article, I think.

Unknown said...

Well, I will say that I if it wasn't for that link in the middle of your page, I probably wouldn't have read your post! Strange, huh!? Here's the thing: I have alot of blogs piled up in my reader and I was sifting through them, reading anything that looked interesting. I was about to skip over your post because it just looked like a bunch of text and I mostly look at art blogs, but then I noticed the bright blue link in the middle and decided to read just that paragraph. I ended up reading the entire post after that AND I left a comment. If the link had been in a list at the end, I probably would have skipped the whole thing. Interesting. Now to read the first few paragraphs…

David Morning said...

The <sup> tag lets you do superscripts, which you could use to link particular passages to the references in the bottom as in many academic papers. You can also put links in them which will link the user directly to the location of the reference if you link to '#tagid' and give the object you're linking to the id '#tagid'. Means that you don't include the links directly in the text, but any users who want to can easily find the extra details