The meaning of… links

To return to basics for a moment, I’ve been feeling the need to chime in that hyperlinks should speak for themselves, whether you are using an assistive technology or not. So let the chiming begin!

I tend to think of this requirement as up there in familiarity with including alternative text for images, but then my bubble keeps getting popped. A couple of times recently, even.

But I’m not going to throw stones only at others today, as one instance I came across was on the home page for this site.

Let me first confess to using WordPress because I’m too lazy to spend the energy to develop yet another site when all I’m doing is writing posts. It’s not bad for what it does, even if customizing can be a pain.

The downside of this laziness is that I’m periodically late to find deficiencies. When you don’t own the code, you have to rely on validation (machine and manual), and I’ve only been able to do some more testing lately. That led to some discoveries.

The one pertinent to this post is that all the “more” links from the home page had the identical text: “Read the rest of this entry”. Sure, that’s what you’re going to do by following the link, given the context of the post header and first few paragraphs, but it’s a poor mechanism on its own.

Now, I’ll grant that the post titles are linked — and you reach them first — but it doesn’t excuse boilerplate linking. The other incident was another case of using the same words on the same page to link to different things, so take my word that the problem is still real.

Don’t click here

First off, it is amazing, and heartening, how quickly the old staple “click here” has been disappearing. I’m not so naive to believe that the world at large has caught up with accessibility best practices — any change is invariably tied some other driving force that wakes people up to bad practice.

Keyboard access has always made the “click” a misnomer, for example, so if I were a betting man I’d wager on the rise of touch devices as the real impetus for the trend away from clickiness.

Regardless, it was long past time to stop treating users like noobs who can’t tie their own shoelaces. What else am I going to do with your link, stare intently at it and see what happens? (It’s a relic of the days when most internet users were new.)

But I’m not out to pick on poor old “click here”, as “read more” and others are lurking all around, too. It’s the underlying generality of these labels that makes them useless.

If you’re still wondering why this is worth writing about, consider the number of times you’ve read an article and then gone back after finishing to check the links. Or you might bookmark pages with useful links to reach them quickly again later.

Don’t you find it annoying if the link text isn’t clear? What a pain if you have to read the text around the link to find out which one goes where, right? Almost defeats the purpose.

Now consider that someone using an AT may only be hearing the label. The ability to cycle through the links is a common feature for the same reason that links are visually distinguishable for sighted readers wanting to find them or return to them without reading the document, but this functionality is rendered moot when all the links have the same label or are similarly unhelpful.

Be descriptive

It’s not that hard to come up with decent text to put a link on, so the fix is more one of awareness. You’re giving the reader a reason why they would want to follow the link, after all, or at least a direct reference to what is on the other end.

And that’s the simple key to being accessible: the link text should stand as a decent description of what is being referenced.

If you hyperlink an author’s name, for example, the expectation is that the link goes to more information about that person (their site). If you link an article the person wrote, you expect the link to take you to the article. If you link a corporate or web site name, you go there. In most cases, you’re just using common sense.

Don’t be scared of hyperlinking more than two words, either. Underlinking is a vestige of the “click here” mentality. Link only as many words as are necessary to convey the information, and only the words that convey that information, but don’t set artificial lengths.

Also keep in mind that the text you hyperlink is not only to facilitate users of AT. As a sighted reader, I like to get the context without reading the surrounding text. Non-descript links are a nuisance for everyone.

Ooh, titles

As a final note, avoid using the title attribute on links.

Repeat: avoid using the title attribute on links. (And in a lot of other cases, too.)

It’s not going to do what you think, as AT users are most likely going to hear the bad text you used as a link, not the wonderful title you thought you were giving them.

Even the WCAG guidelines give this practice very weak endorsement:

Because of the extensive user agent limitations in supporting access to the title attribute, authors should use caution in applying this technique. For this reason, it is preferred that the author use technique C7: Using CSS to hide a portion of the link text (CSS) or H30: Providing link text that describes the purpose of a link for anchor elements.

We don’t live in a mouse-bound world anymore — and mouse control is not easy for everyone — so hopefully this advice will sound duly antiquated.

But there are tooltips galore on WordPress links, so my frosted side says it’s not completely getting through.

I’m going to cut myself off there, as much information already exists elsewhere if you still need convincing.

I’ll end by noting that if anyone does notice any inaccessible features of this site, please let me know. I know the contrast in this theme isn’t particularly great, but I’ll be trying to fix that over the next while.

I’ve added a couple of plugin toolbars at the left side to control contrast, font size and allow greyscaling of the page, too, but hope to find options that integrate a little more nicely into the site.

Tags: ,


Your email address will not be published. Required fields are marked *