UX Crash Course: Stupid Question 22 of 30


To non-designers, UX often looks like a job where you mostly argue about button colours & headlines. That is barely any of what UX actually is, but it’s true that we do those things. So let’s answer:

“What link color gets the most clicks?”


 

Just starting the Crash Course? Start here!

****

In one of the previous lessons we discussed Google’s huge 40-option A/B test of link colours in their search for the perfect shade of blue.

We also discussed that red links seem to have a reputation for winning A/B tests. 

And I have personally increased clicks by 400%, just by making a button yellow instead of purple.

So, which color is the best?

****

The Stupid Answer:

Somebody should A/B test all the colours to settle this once and for all.

(Actually that wouldn’t settle anything… keep reading).

****

The Real Answer:

You shouldn’t look at the colour of links as an isolated element in your design. 

The background colour is a huge factor!

The colour of the branding around the link is a factor.

The colour of the regular, non-clickable text is a factor.

Whether the link looks like a link is probably the real question you should ask yourself. In every project. Forever. Starting yesterday.

****

When it comes to buttons and links, what you want is contrast.

Links should be the opposite of the background colour, they should go with your branding while standing out, they should be noticeably different from the paragraph text — even if they aren’t in a paragraph!

Compare your menu and your links with your paragraph text. Are they radically different, or almost the same?

****

Why this isn’t a stupid question:
Beginners think in specifics. 

Contrast is a relative concept. It means difference. But different than what? 

If you want people to click something you need to make it easy to see compared to other stuff around it. 

i.e. — increase contrast.

Imagine you’re going to one of those “white party” events. The kind where everybody wears white clothing and there is a big concert… not the angry supremacist kind.

Let’s imagine you are the douchebag who wants to be noticed by the camera in the helicopter above. What colour would you wear? Think, douchebag, think!

Red would work. Blue would work. Black would even work. Anything that isn’t white, basically.

What if it was a yellow party instead? Or a red party? Or a blue party?

If the crowd was bad at following instructions and isn’t all one colour, it’s gets much harder for you to be noticed.

Links and buttons work like that. The user is the helicopter. You need to choose a colour that gets noticed. If you design everything in different colours, then your links and buttons disappear into an ocean of visual noise.

****

Experts think in systems.

As a beginner, you may look at designs and think “red worked for them, so it will work for me.” But you should look at the context that made red work for them.

And don’t just assume that red worked! Get data! How do you know red worked for them?!

Beginners think about links and buttons as a specific color, and a specific shape, and maybe a specific style, like Flat design.

Experienced designers see links and buttons as part of a system. Some parts are meant to support other parts, style is about consistency and brand instead of details like flatness or corner radius, and your exact choice of colours, shapes, styles, and underwear don’t matter as long as they all work together to achieve the results you want. Mainly the underwear. Very important.

You can make people click links by changing things that are not links!

What beginners miss is that one purple button — in the menu, on a white background — is not the same as another purple button — on a purple background, in the side bar.

Even if those purple buttons are exactly the same button.

Let that one stir around in your head for a while.

****

Tomorrow we will get into some stupid questions about usability, starting with: “Why can’t credit card numbers include spaces?”