Prefer to read? Here’s the video transcript about links on websites:
Here are some things I want you to keep in mind.
First off, links need to have really good information scent. You might be wondering, "What the heck is that?"
Information scent refers to the visual and textual clues that suggest what information the link may lead to.
That's why things like "Click Here" aren't great because they don't provide good information scent. (Plus that's not helpful to anyone using a screenreader either.) Somebody needs to have a sense of what they're going to get if they click on a link.
Help USERS Make INFORMED DECISIONS
Here are some examples of information-rich links using descriptive text. This language is pretty clear about what you're going to get if you click on it.
"Meet our interim program director," is probably going to be either some kind of video or some kind of article about this new person.
"Newest animal babies" - that totally makes me want to click on it, I don't know about you.
Here it's very clearly an article about "4 signs of alcohol abuse."
These are the types of links that we want. These descriptive links will have a lot of meaning for people. This will help them make an informed decision about whether they want to click.
Words to Avoid
Here are the words you want to be careful with:
“Click here”
“Read more”
“Learn more”
“More”
These words are really vague. If I come across those on a website, and links like this will catch my eye, I still don't know what exactly I'm going to be getting into.
Should I click on these links? As much as possible, avoid using these vague words without context. If I have to use them, they need to be very closely related visually to whatever the item is.
For example, it's some beginning of the article and you get to continue the article, you can read more. So at least I know, OK, I'm continuing with this same article, that sort of thing. Otherwise what happens is these words pop out to me on a page as links, but then I have to kind of sit around and wonder what they're connected to.
Be aware that it's always better to have good information scent. It's better to be more clear about what somebody is going to get when they click on the link.
Link Length
The best practice I've seen based on research would be having a length of three to seven words. When it gets beyond seven words, it feels too long, but sometimes one word isn't enough. So here is the best practice to aim for on your links.
Here are some information-rich links that are better and longer than if I just wrote, "Learn more."
“Learn more tips to stay healthy”
“Read about our newest program”
“Top tips for better eating here”
These will help the user make good choices about whether this link is worth clicking on it from their perspective. Great UX helps people make informed choices.
Color
Let's talk about color now. Color is fun to talk about and you can definitely have variety with your colors before your links. They definitely need to be accessible. So that means there needs to be a good color contrast between the color and the background.
So, for example, I've seen websites that have chosen orange as a color for links. That is not accessible on a white background. So you want to be sure to check color contrast.
I use a color checker called the Web AIM color checker. There are other ones you can find online. Use whichever one because you definitely want your links to be accessible.
Underlined Links
There's a good argument that links probably should be underlined, right, because not everybody sees colors in the same way. And if a link is underlined, it's very clear that this is a link.
If you don't want to underline from the get go, you would want to change that on. But, you could change the color as well as add an underline.
Visited Links
You may use another color to show visited links. Then it's very clear that, hey, this is a link after somebody has visited a page on your website. This is especially important if it's a larger site with a lot of content. Visited links may be in purple or whatever other color might be helpful. This is for the user to know, "Oh, I've already explored that area of the website in those pages."
So you can have fun with links, but just be sure they are accessible. We want to make sure we have great links that are information-rich that people want to click on.
Want to learn more about UX, check out Birdcall courses for nonprofit and small business websites.