29 September 2011

How to write good hyperlinks

Click here. Find out more. Check this out.

Every day on my internet travels I see hyperlinks written like this, where the link itself, when taken out of context, is entirely meaningless. This is not the way to write hyperlinks, for plenty of reasons.

Links should have meaning

The first is accessibility. Not everyone who uses the web has perfect sight or is able to use a mouse, trackpad or keyboard like most people can. That’s why they use a screen reader, a marvellous device that reads web pages aloud. The person using it can then navigate from page to page like anyone else.

Or at least they can if the hyperlinks mean something. Screen readers work by calling up a list of links on a page. Imagine a list of ‘click heres’ and ‘find out mores’ and think about how you could possibly know where on earth they will take you.

On a basic level, to make sure your site can be read and enjoyed by everyone, your links should mean something.

See the difference?

People scan pages

Studies show that generally, people scan web pages, rather than read them, and that they’re always looking for the next place to go. You should aim to make this process as easy as possible.

First, as before, your links should mean something. They are typically designed to stand out on the page, so when someone scans, they too don’t want ‘click heres’ and ‘find out mores’. You’re forcing them to find the extra context and slowing them down.

The second thing to think about is whether your links are presented in the best possible way. If you have, say, four or five links in a single paragraph, would they be better arranged in bullet points, or even as part of the navigation system?

When you’re writing for the web, whether you’re a professional copywriter or an occasional blogger, your aim is to express yourself in the best way possible. That goes for the words you choose, of course, but also how they appear on the page.

You have to think like a reader, not just a writer.

Form and structure

Finally, the way you structure your link will affect the likelihood of someone clicking it. It may be meaningful and positioned sensibly, but if it’s too long then it won’t get read. People scan pages, remember.

Four or five words is a good maximum to aim for. Anything over that and you’re heading into too-long-ignore-it territory. Like constructing a sentence, it’s about rhythm and context. It’s not that complicated once you get used to it.

Another strange web phenomenon is that people only tend to focus on the first two words of a link. Where possible, you should try and put the important information up front. It’s pretty tricky, but it can be done.

Let me have a go here, using the same example I used above to show meaningful links.

My first attempt had meaning, which is great, but the important information was at the end of the link. You can see how a quick rewrite can make a difference.

The Holy Grail of writing web copy

The problem with trying to follow all these rules is that, if you’re not careful, they can impact the quality of your writing. I’ll be honest with you, I think that my ‘before’ sentence above sounds better than the ‘after’ version.

And that’s the Holy Grail of writing web copy: finding the balance between form and function. You have to make something sound great, but ensure that it’s appropriate for both your reader and the format. Pretty much all writing is about expressing yourself to an audience in the best possible way that you can.

When you write links, it may not feel like poetry, but you do have to engage people. What’s more, your primary job is to help them get from one place to another, all with the minimum of fuss.

12 Comments

  1. Well said, Iain.

    Many blogs seem very often to ignore these basic rules….which is a shame.

    K

    • Iain Broome (Author)

      They do, but there are many people who simply don’t know about the basic rules.

      I almost didn’t write the post because I thought it might be a bit straightforward. But then I know that there are many writers just starting their own blog who would have no idea about accessibility and whatnot. So I figured it might be handy.

      The online writing community tends to focus on, quick, get a blog and make a fortune, rather than, hey, if you get a blog, there’s one or two things you need to know.

      Thanks for the comment!

  2. Agree – I nearly said “ignore (or simply don’t know about)”, but then didn’t lest I sound patronising! But agree that many bloggers simply won’t have come across accessibility rules. And you can’t know something that you don’t know – so it’s useful that you’ve put this post up for those who don’t know… :) For anyone unfamiliar with accessability best practice, this – this link may be of interest: http://www.rnib.org.uk/PROFESSIONALS/WEBACCESSIBILITY/DESIGNBUILD/Pages/design_build.aspx Ok it goes way beyond links – but still useful. Main thing is to put yourself in the customer’s shoes and ask yourself whether your link makes sense out of context.

  3. Courtney Ecker

    Thank you Ian.

    Not every blogger is a web guru and not every writer is good at web content. Every time someone writes a blog clarifying some of these little web content intricacies, the world of content strategy gets a little bit better.

    • Iain Broome (Author)

      I totally agree and that’s why I decided to go ahead and write the piece.

      It’s especially pertinent in the writing community – I’m talking fiction here – where people are encouraged to get their own blog all the time, and yet have no experience of writing for the web.

      Anyway. Thanks!

  4. Thanks Ian for the wonderful information.

  5. Jeff

    Hi Iain,
    I hope you don’t mind if I provide this link to my journalism students. This article touches upon a lot of issues they have with writing hyperlinks properly. Well done!

Trackbacks for this post

  1. Six Thought-Provoking Writing Posts | Laura Stanfill
  2. Anatomy, Grammar, Syntax & Taxonomy of a Hyperlink | Langwitches Blog
  3. Affordances of a Networked Media Culture | With All My Heart

Leave a Reply

hr { border-style: solid; border-width: 1px; }